// materials
Materials
A material decides how a shape's surface looks and how it reacts to light. flutter_fiber has six, from a fully physically based one down to a flat unlit color. Every mesh takes exactly one material.
They can be mixed freely: different shapes in the same scene can use different materials, and all of them draw correctly together.
// demo
Demo
Every material in one lit scene: a Phong torus knot in the center, a Lambert torus (left), a Standard sphere (right), a Toon octahedron (front left), a Matcap cone (front right), and a row of metal Standard spheres with roughness from 0.05 to 1.0 along the bottom.
// how to use it
How to use it
Pass a material to the material parameter of Fiber3DMesh. To change a shape's look, change that one line:
Fiber3DMesh(
geometry: Fiber3DTorusKnot(radius: 1.1, tube: 0.35),
material: Fiber3DPhongMaterial(
color: 0xcc4433,
specular: 0xffffff,
shininess: 80.0,
),
)Colors are 0xRRGGBB integers. Every material except the Standard one can be written const.
| Material | Lighting |
|---|---|
| Standard | Physically based, with environment reflections |
| Lambert | Matte diffuse only |
| Phong | Diffuse plus a glossy highlight |
| Toon | Stepped, cel-shaded bands |
| Matcap | From the view-space normal, no scene lights |
| Basic | None: always its flat color |
// the materials
The materials
Fiber3DStandardMaterial
Physically based: roughness and metalness, with environment reflections. The only material that takes textures, clearcoat and transparency. Use it for realistic surfaces, metals, glass, textured objects and glTF models. It is not const.
Parameters (defaults)
- color (0xffffff)
- roughness (1.0)
- metalness (0.0)
- emissive (0x000000)
- emissiveIntensity (1.0)
- wireframe (false)
- flatShading (false)
- map, roughnessMap, metalnessMap (null)
- envMapIntensity (1.0)
- clearcoat (0.0)
- clearcoatRoughness (0.0)
- opacity (1.0)
- transparent (false)
Fiber3DStandardMaterial(
color: 0x2255cc,
roughness: 0.15,
metalness: 0.6,
)Fiber3DLambertMaterial
Matte diffuse lighting only, with no highlight. Cheap and non-shiny.
Parameters (defaults)
- color (0xffffff)
- emissive (0x000000)
- emissiveIntensity (1.0)
- wireframe (false)
- flatShading (false)
Fiber3DLambertMaterial(
color: 0x33aa77,
flatShading: true,
)Fiber3DPhongMaterial
Diffuse plus a classic Blinn-Phong highlight. A higher shininess gives a smaller, sharper highlight.
Parameters (defaults)
- everything in Lambert
- specular (0x111111): highlight color
- shininess (30.0)
Fiber3DPhongMaterial(
color: 0xcc4433,
specular: 0xffffff,
shininess: 80.0,
)Fiber3DToonMaterial
Direct light is stepped into discrete bands for a cel-shaded cartoon look. There is no specular term and no gradient-map option yet.
Parameters (defaults)
- color (0xffffff)
- emissive (0x000000)
- emissiveIntensity (1.0)
- wireframe (false)
- flatShading (false)
Fiber3DToonMaterial(color: 0xffaa22)Fiber3DMatcapMaterial
Shading comes from the view-space normal and ignores the scene's lights, so the shading stays fixed relative to the camera as the shape spins. Custom matcap textures are not supported yet.
Parameters (defaults)
- color (0xffffff)
- wireframe (false)
- flatShading (false)
Fiber3DMatcapMaterial(color: 0xdddddd)Fiber3DBasicMaterial
No lighting at all: it always renders its flat color. Good for markers and helpers.
Parameters (defaults)
- color (0xffffff)
- wireframe (false)
Fiber3DBasicMaterial(color: 0x3366ff)// tips & limits
Tips & limits
- One material per mesh. There is no per-face material.
- Only
Fiber3DStandardMaterialsupports textures and transparency. The other materials render fully opaque. The hemisphere light also affects the Standard material only. - Matcap and Basic ignore the scene's lights. Lambert, Phong and Toon respond to ambient and point lights.
- The Standard material adds environment reflections by default. Set
envMapIntensity: 0.0to turn them off for a pure light-only look, as the demo does for its sphere and roughness row. - More on the Standard material: Clearcoat, Photo in shape and Text in shape.