diff --git a/docs/en/graphics/material/builtinShaders/pbr.mdx b/docs/en/graphics/material/builtinShaders/pbr.mdx index e1956dd03..1fea7d586 100644 --- a/docs/en/graphics/material/builtinShaders/pbr.mdx +++ b/docs/en/graphics/material/builtinShaders/pbr.mdx @@ -1,175 +1,192 @@ --- -title: PBR +title: PBR --- +PBR stands for **Physically Based Rendering**. It was first introduced by Disney in 2012 and later widely adopted by the gaming industry. Compared to traditional rendering methods like **Blinn-Phong**, PBR adheres to the principle of energy conservation and follows physical rules. Artists only need to adjust a few simple parameters to ensure correct rendering effects even in complex scenes. PBR is a physically-based rendering method that follows energy conservation and introduces [IBL](/docs/graphics-light-ambient) to simulate global illumination. It uses parameters like metallic, roughness, etc., to make adjusting rendering effects more convenient. -**PBR** stands for **Physically Based Rendering**, or **Physically Based Rendering** in Chinese. Originally proposed by Disney in 2012, it has since been widely adopted in the gaming industry. Compared to traditional rendering methods like **Blinn-Phong**, PBR adheres to energy conservation and physical rules. Artists only need to adjust a few simple parameters to ensure accurate rendering results even in complex scenes. PBR follows energy conservation principles, is physically based, and incorporates [IBL](/en/docs/graphics-light-ambient) to simulate global illumination. It allows for easier adjustment of rendering effects through parameters like metallic and roughness. +## Base +| Parameter | Description | +| :-- | :-- | +| [IOR](/apis/core/#PBRMaterial-ior) | Index of Refraction | +| [baseColor](/apis/core/#PBRBaseMaterial-baseColor) | The base color. **Base Color** \* **Base Color Texture** = **Final Base Color**. The base color is the albedo value of the object. Unlike traditional diffuse color, it contributes to both specular and diffuse reflection. We can control the contribution ratio using the aforementioned metallic and roughness parameters. | +| [baseTexture](/apis/core/#PBRBaseMaterial-baseTexture) | The base color texture. Used in conjunction with the base color, they are multiplied together. | -## PBR Basic Parameters -| Parameter | Description | -| :-- | :-- | -| [metallic](/apis/core/#PBRMaterial-metallic) | **Metallic**. Simulates the metallic properties of a material. Higher values result in stronger specular reflections, reflecting more surrounding environment. | -| [roughness](/apis/core/#PBRMaterial-roughness) | **Roughness**. Simulates the roughness of a material. Higher roughness creates a less flat microsurface and blurrier specular reflections. | -| [roughnessMetallicTexture](/apis/core/#PBRMaterial-roughnessMetallicTexture) | **Roughness Metallic Texture**. Used with metallic and roughness, operates in a multiplicative relationship. | -| [baseColor](/apis/core/#PBRBaseMaterial-baseColor) | **Base Color**. **Base Color * Base Color Texture = Final Base Color**. The base color represents the albedo value of an object. Unlike traditional diffuse color, it contributes to both specular and diffuse components. We can control the contribution ratio using metallic and roughness. | -| [emissiveColor](/apis/core/#PBRBaseMaterial-emissiveColor) | **Emissive Color**. Renders color even without lighting. | -| [baseTexture](/apis/core/#PBRBaseMaterial-baseTexture) | **Base Color Texture**. Used with base color, operates in a multiplicative relationship. | -| [normalTexture](/apis/core/#PBRBaseMaterial-normalTexture) | **Normal Texture**. Creates surface detail with a bump map and controls depth via normal intensity. | -| [emissiveTexture](/apis/core/#PBRBaseMaterial-emissiveTexture) | **Emissive Texture**. Combine with emissive color ([emissiveFactor](/apis/core/#PBRBaseMaterial-emissiveTexture)) to achieve emissive effects, rendering color even without lighting. | -| [occlusionTexture](/apis/core/#PBRBaseMaterial-occlusionTexture) | **Occlusion Texture**. Enhances shadow details of objects. | -| [tilingOffset](/apis/core/#PBRBaseMaterial-tilingOffset) | **Tiling Offset**. A Vector4 value controlling UV scale and offset (see [example](/examples/tiling-offset)). | -| [clearCoat](/apis/core/#PBRBaseMaterial-clearCoat) | **Clear Coat Strength**. Default is 0 (disabled). See [example](/examples/pbr-clearcoat). | -| [clearCoatTexture](/apis/core/#PBRBaseMaterial-clearCoatTexture) | **Clear Coat Strength Texture**. Multiplied with clearCoat. | -| [clearCoatRoughness](/apis/core/#PBRBaseMaterial-clearCoatRoughness) | **Clear Coat Roughness**. | -| [clearCoatRoughnessTexture](/apis/core/#PBRBaseMaterial-clearCoatRoughnessTexture) | **Clear Coat Roughness Texture**. Multiplied with clearCoatRoughness. | -| [clearCoatNormalTexture](/apis/core/#PBRBaseMaterial-clearCoatNormalTexture) | **Clear Coat Normal Texture**. Shares the original material’s normal if not set. | +## MetallicRoughness +| Parameter | Description | +| :-- | :-- | +| [metallic](/apis/core/#PBRMaterial-metallic) | Simulates the metallic degree of a material. The higher the metallic value, the stronger the specular reflection, meaning it reflects more of the surrounding environment. | +| [roughness](/apis/core/#PBRMaterial-roughness) | Simulates the roughness of a material. The higher the roughness, the more uneven the micro-surface, and the blurrier the specular reflection. | +| [roughnessMetallicTexture](/apis/core/#PBRMaterial-roughnessMetallicTexture) | The metallic-roughness texture. Used in conjunction with metallic and roughness values, they are multiplied together. | -By adjusting the metallic parameter, you’ll notice that higher metallic values make the surrounding environment clearer and transition from a white pure color to a colorful one. This occurs because dielectric materials (metallic = 1) reflect 100% of light at the surface, resulting in colorful environmental reflections: +As we adjust the material's metallic value, we can observe that the higher the metallic value, the clearer the reflection of the surrounding environment becomes, and it starts changing from a solid white to colored. This is because dielectric materials (i.e., when metallic is 1) reflect 100% of the light off the object's surface, thus reflecting the colored surrounding environment: - + - -In addition to the above general parameters, PBR provides two workflows: **Metal-Roughness** and **Specular-Glossiness**, corresponding to [PBRMaterial](/apis/core/#PBRMaterial) and [PBRSpecularMaterial](/apis/core/#PBRSpecularMaterial). - -## PBRMaterial +## Specular +| Parameter | Description | +| :-- | :-- | +| [specular](/apis/core/#PBRMaterial-specular) | Controls the intensity of specular reflection. | +| [specularColor](/apis/core/#PBRMaterial-specularColor) | Controls the color of specular reflection. | +| [specularTexture](/apis/core/#PBRMaterial-specularTexture) | Used to control the intensity distribution of specular reflection. | +| [specularColorTexture](/apis/core/#PBRMaterial-specularColorTexture) | Used to control the color distribution of specular reflection. | -#### Anisotropy - -Refers to the directional variation of light reflection on a surface, often manifesting as distinct gloss or reflection effects. This phenomenon is common in real-world materials, especially metals, fabrics, and hair. - + -| Parameter | Description | -| :-- | :-- | -| [anisotropy](/apis/core/#PBRMaterial-anisotropy) | **Anisotropy Strength**. Default is 0 (disabled). See [example](/examples/pbr-anisotropy). | -| [anisotropyRotation](/apis/core/#PBRMaterial-anisotropyRotation) | **Anisotropy Rotation Angle**. Rotates along tangent and bitangent space. | -| [anisotropyTexture](/apis/core/#PBRMaterial-anisotropyTexture) | **Anisotropy Texture**. RG channels store anisotropy direction (multiplied with rotation); B channel stores strength (multiplied with anisotropy). | +## Anisotropy +Refers to the property of a surface material where light reflection characteristics differ in different directions, often manifesting as varying gloss or reflection effects on the material's surface. This effect is present in many real-world materials, especially metals, fabrics, and hair. -Enabling Anisotropy -- Navigate to **Inspector**, enable [anisotropy](/apis/core/#PBRMaterial-anisotropy), and adjust parameters for desired effects: +| Parameter | Application | +| :-- | :-- | +| [anisotropy](/apis/core/#PBRMaterial-anisotropy) | Anisotropy strength. Defaults to 0, which disables anisotropic calculations. See [Example](/examples/pbr-anisotropy). | +| [anisotropyRotation](/apis/core/#PBRMaterial-anisotropyRotation) | Anisotropy rotation angle. Rotates by the corresponding angle along the tangent and bitangent space. | +| [anisotropyTexture](/apis/core/#PBRMaterial-anisotropyTexture) | Anisotropy texture. The RG channels store the anisotropic direction, which is multiplied by the result of anisotropyRotation; the B channel stores the anisotropic strength, which is multiplied by anisotropy. | - +Enabling Anisotropy +- Navigate to the Inspector, enable [anisotropy](/apis/core/#PBRMaterial-anisotropy), and then adjust the corresponding parameters to achieve the desired effect: -#### Sheen - -Used to simulate subtle glossy effects on fabric surfaces. This gloss is visible at specific viewing angles, resembling light scattering on silk, velvet, or other fine fibers. - + -| Parameter | Description | -| :-- | :-- | -| [sheenColor](/apis/core/#PBRMaterial-sheenColor) | **Base Sheen Color**. Determines the color observed when light interacts with the surface. | -| [sheenColorTexture](/apis/core/#PBRMaterial-sheenColorTexture) | **Sheen Color Texture**. Provides complex color variations across the surface. | -| [sheenRoughness](/apis/core/#PBRMaterial-sheenRoughness) | **Sheen Roughness**. Lower values = smoother surfaces with concentrated gloss; higher values = rougher surfaces with softer, diffused gloss. | -| [sheenRoughnessTexture](/apis/core/#PBRMaterial-sheenRoughnessTexture) | **Sheen Roughness Texture**. Defines varying roughness across the surface. | +## Normal +| Parameter | Description | +| :-- | :-- | +| [normalTexture](/apis/core/#PBRBaseMaterial-normalTexture) | The normal texture. You can set a normal texture to create a visual sense of bumpiness, and control the degree of bumpiness with the normal strength. | - -Enabling Sheen -- Select the material and adjust parameters: +## Emissive +| Parameter | Description | +| :-- | :-- | +| [emissiveColor](/apis/core/#PBRBaseMaterial-emissiveColor) | The emissive color. Allows the material to be rendered with color even without any lighting. | +| [emissiveTexture](/apis/core/#PBRBaseMaterial-emissiveTexture) | The emissive texture. We can set an emissive texture and an emissive color ([emissiveFactor](/apis/core/#PBRBaseMaterial-emissiveTexture)) to achieve a self-illuminating effect, allowing the material to be rendered with color even without lighting. | - -#### Thin Film Iridescence - -Occurs when surface colors change with viewing and lighting angles. Common in soap bubbles, insect wings, and pearls. - +## Occlusion +| Parameter | Description | +| :-- | :-- | +| [occlusionTexture](/apis/core/#PBRBaseMaterial-occlusionTexture) | The ambient occlusion texture. We can set an occlusion texture to enhance the shadow details of the object. | -| Parameter | Description | -| :-- | :-- | -| [iridescence](/apis/core/#PBRMaterial-iridescence) | **Thin Film Interference Strength** (0–1). | -| [iridescenceTexture](/apis/core/#PBRMaterial-iridescenceTexture) | **Iridescence Strength Texture**. | -| [iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR) | **Iridescence Refractive Index**. Controls light bending and resulting colors. | -| [iridescenceThicknessRange](/apis/core/#PBRMaterial-iridescenceThicknessRange) | **Iridescence Thickness Range**. Determines color variation. | -| [iridescenceThicknessTexture](/apis/core/#PBRMaterial-iridescenceThicknessTexture) | **Iridescence Thickness Texture**. Affects color and thickness. | - +## ClearCoat +Used to simulate a transparent protective layer covering an object's surface (similar to the clear varnish on car paint). It adds an independent layer of specular reflection on top of the original material, making the surface appear shinier, deeper, and more realistic. -Enabling Iridescence -- Select the material, ensure [iridescence](/apis/core/#PBRMaterial-iridescence) > 0, and adjust [metallic](/apis/core/#PBRMaterial-metallic), [roughness](/apis/core/#PBRMaterial-roughness), [iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR), etc.: +| Parameter | Description | +| :-- | :-- | +| [clearCoat](/apis/core/#PBRBaseMaterial-clearCoat) | The strength of the clear coat layer. Defaults to 0, meaning the clear coat effect is disabled. See [Example](/examples/pbr-clearcoat). | +| [clearCoatTexture](/apis/core/#PBRBaseMaterial-clearCoatTexture) | The clear coat strength texture, which is multiplied by the clearCoat value. | +| [clearCoatRoughness](/apis/core/#PBRBaseMaterial-clearCoatRoughness) | The roughness of the clear coat layer. | +| [clearCoatRoughnessTexture](/apis/core/#PBRBaseMaterial-clearCoatRoughnessTexture) | The clear coat roughness texture, which is multiplied by the clearCoatRoughness value. | +| [clearCoatNormalTexture](/apis/core/#PBRBaseMaterial-clearCoatNormalTexture) | The normal texture for the clear coat layer. If not set, it will use the base material's normal map. | + - -#### Transmission - -Describes light passing through a material rather than being reflected or absorbed. When light hits a transparent/semi-transparent object, some light transmits through it. - +## Thin Film Iridescence +Often manifested as a change in the surface color of an object with varying viewing and lighting angles. This effect can be seen in nature on things like soap bubbles, insect wings, and pearls. +| Parameter | Description | +| :-- | :-- | +| [iridescence](/apis/core/#PBRMaterial-iridescence) | The strength of the thin-film interference effect, ranging from 0 to 1.| +| [iridescenceTexture](/apis/core/#PBRMaterial-iridescenceTexture) | Specifies a texture to control the strength of the thin-film interference effect. | +| [iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR) | The index of refraction for the thin film. This value determines the degree of light bending and, for thin-film interference, affects the resulting color of the light. | +| [iridescenceThicknessRange](/apis/core/#PBRMaterial-iridescenceThicknessRange) | Used to control the thickness of the thin film, which determines the final color variation of the interference effect. | +| [iridescenceThicknessTexture](/apis/core/#PBRMaterial-iridescenceThicknessTexture) | Specifies a texture to control the thickness of the thin-film interference effect, which also affects the final color. | + - +Enabling Iridescence -| Parameter | Description | -| :-- | :-- | -| [transmission](/apis/core/#PBRMaterial-transmission) | **Transmission Strength** (0–1). 0 = no transmission; 1 = fully transparent. | -| [transmissionTexture](/apis/core/#PBRMaterial-transmissionTexture) | **Transmission Texture**. Samples R channel, multiplied with transmission. | +- Select the material, ensure [iridescence](/apis/core/#PBRMaterial-iridescence) is greater than 0 to enable the effect. +- Adjust parameters like [metallic](/apis/core/#PBRMaterial-metallic), [roughness](/apis/core/#PBRMaterial-roughness), and [iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR) to achieve the desired effect. -Enabling Transmission -- Enable **Opaque Texture** in Camera and Scene: + - -- Adjust transmission parameters: +## Sheen + +Typically used to simulate the subtle sheen on the surface of materials like fabric. This sheen is generally visible at certain viewing angles and is similar to the light scattering properties of materials like silk, velvet, or other fine fibers. + - +| Parameter | Description | +| :-- | :-- | +| [sheenColor](/apis/core/#PBRMaterial-sheenColor) | The base sheen color for the object's surface. This property determines the color of the sheen observed on the surface when light interacts with it.| +| [sheenColorTexture](/apis/core/#PBRMaterial-sheenColorTexture) | Used to provide more complex and detailed color variations for the sheen effect. By using this texture, the sheen color can have different appearances in different areas of the surface. | +| [sheenRoughness](/apis/core/#PBRMaterial-sheenRoughness) | Defines the surface roughness for the sheen. A lower value indicates a smoother surface with a more concentrated sheen; a higher value means a rougher surface with a softer, more diffused sheen. | +| [sheenRoughnessTexture](/apis/core/#PBRMaterial-sheenRoughnessTexture) | Allows the roughness to have different characteristics in different areas. By defining this variation with a texture, complex roughness can be achieved on the same surface. | - -According to physics, refraction relies on transmission. Refraction only occurs when transmission > 0. - + -#### Refraction -| Parameter | Description | -| :-- | :-- | -| [attenuationColor](/apis/core/#PBRMaterial-attenuationColor) | **Absorption Color**. Simulates optical absorption in colored glass, liquids, or gems. | -| [attenuationDistance](/apis/core/#PBRMaterial-attenuationDistance) | **Attenuation Distance**. Shorter distances = denser, more vivid colors; longer distances = softer color transitions. | -| [thickness](/apis/core/#PBRMaterial-thickness) | **Refraction Thickness**. Controls light bending. Larger values = more pronounced refraction. | -| [thicknessTexture](/apis/core/#PBRMaterial-thicknessTexture) | **Thickness Texture**. Samples G channel; white = thicker, black = thinner. Multiplied with thickness. | +Enabling Sheen - +- Select the material and adjust the corresponding parameters to get the desired effect: -Enabling Refraction -- Ensure [transmission](/apis/core/#PBRMaterial-transmission) is enabled, set [thickness](/apis/core/#PBRMaterial-thickness) > 0, and adjust attenuation color/distance: + - +## Transmission +Describes the portion of light that passes through an object rather than being reflected or absorbed. When light hits a transparent or translucent object, some of it will pass through, which is the basic manifestation of transmission. -> For refraction calculations, we assume: -> - Use a simplified geometry shape to approximate surface properties. -> - Use [refractionMode](/apis/core/#PBRMaterial-refractionMode) to define the refraction mode. + -| refractionMode | Description | -| :-- | :-- | -| [Sphere](/apis/core/#PBRMaterial-Sphere) | Uses spheres to approximate curved surface refraction. | -| [Planar](/apis/core/#PBRMaterial-Planar) | Uses planes for flat surface refraction. | +| Parameter | Description | +| :-- | :-- | +| [transmission](/apis/core/#PBRMaterial-transmission) | Controls the transmission intensity of the material, with a range from 0 to 1. 0 means no transmission, and 1 means full transmission. | +| [transmissionTexture](/apis/core/#PBRMaterial-transmissionTexture) | The transmission texture, sampling the R channel, is multiplied by [transmission](/apis/core/#PBRMaterial-transmission) to control the transmission intensity of different areas on the material's surface. | -## PBRSpecularMaterial +Enabling Transmission -| Parameter | Description | -| :-- | :-- | -| [specularColor](/apis/core/#PBRMaterial-specularColor) | **Specular Color**. Unlike metal-roughness workflows, this directly defines specular color (only active when metal-roughness workflow is disabled). | -| [glossiness](/apis/core/#PBRMaterial-glossiness) | **Glossiness**. Opposite of roughness (only active when metal-roughness workflow is disabled). | -| [specularGlossinessTexture](/apis/core/#PBRMaterial-specularGlossinessTexture) | **Specular Glossiness Texture**. Multiplied with specular and glossiness. | +- First, you need to enable Opaque Texture under the Camera and in the scene: -> **Note**: PBR must enable [ambient lighting](/en/docs/graphics-light-ambient). + -For script-based material usage, refer to the [material usage tutorial](/en/docs/graphics-material-script). \ No newline at end of file +- Then select the material and adjust the transmission-related parameters: + + + + +According to physical laws, we consider `refraction` to be built upon `transmission`. This means that the phenomenon of `refraction` only occurs when light `transmits` through a material. That is, `refraction` will only take effect when [transmission](/apis/core/#PBRMaterial-transmission) is greater than 0. + + +## Refraction +| Parameter | Description | +| :-- | :-- | +| [attenuationColor](/apis/core/#PBRMaterial-attenuationColor) | The absorption color, which determines the change in color as light travels inside an object. By setting this color, you can simulate optical absorption effects in materials like colored glass, liquids, or gemstones. | +| [attenuationDistance](/apis/core/#PBRMaterial-attenuationDistance) | The attenuation distance, which defines the distance over which light attenuates as it travels inside an object. A shorter distance makes the material appear denser with more pronounced color changes. A longer distance allows light to penetrate further with more gradual color changes. A value of 0 means light does not attenuate with distance. | +| [thickness](/apis/core/#PBRMaterial-thickness) | The refraction thickness, used to control the refractive effect as light passes through an object. A larger thickness value will cause more significant bending of light, while a smaller value will result in more linear propagation. | +| [thicknessTexture](/apis/core/#PBRMaterial-thicknessTexture) | The refraction thickness texture, sampling the G channel. White areas represent greater thickness, and black areas represent lesser thickness. It is multiplied by [thickness](/apis/core/#PBRMaterial-thickness). | + + + +Enabling Refraction +- After ensuring [transmission](/apis/core/#PBRMaterial-transmission) is enabled, set [thickness](/apis/core/#PBRMaterial-thickness) to a value greater than 0 to enable refraction. +- You can adjust parameters like attenuation color and attenuation distance to work with refraction. + + + +> To implement our refraction algorithm, we made the following assumptions: +> +> We use a simple geometric shape to approximate the surface properties of the object and use [refractionMode](/apis/core/#PBRMaterial-refractionMode) to represent the material's refraction mode. + +| refractionMode | Description | +| :-- | :-- | +| [Sphere](/apis/core/#PBRMaterial-Sphere) | Uses a sphere as the geometric approximation to simulate the object's surface, which can efficiently handle the behavior of light refraction on curved surfaces. | +| [Planar](/apis/core/#PBRMaterial-Planar) | Uses a plane as the geometric approximation to simulate the object's surface, suitable for handling light transmission and refraction on flat materials. | \ No newline at end of file diff --git a/docs/zh/graphics/material/builtinShaders/pbr.mdx b/docs/zh/graphics/material/builtinShaders/pbr.mdx index b9884193b..2e72ac17c 100644 --- a/docs/zh/graphics/material/builtinShaders/pbr.mdx +++ b/docs/zh/graphics/material/builtinShaders/pbr.mdx @@ -3,38 +3,37 @@ title: PBR --- PBR 全称是 **Physically Based Rendering**，中文意思是**基于物理的渲染**，最早由迪士尼在 2012 年提出，后来被游戏界广泛使用。跟传统的 **Blinn-Phong** 等渲染方法相比，PBR 遵循能量守恒，符合物理规则，美术们只需要调整几个简单的参数，即使在复杂的场景中也能保证正确的渲染效果。PBR 遵循能量守恒，是基于物理的渲染，并且引入了 [IBL](/docs/graphics-light-ambient) 模拟全局光照，通过金属度、粗糙度等参数，更加方便地调节渲染效果。 -## PBR 基础参数介绍 +## Base +| 参数 | 描述 | +| :-- | :-- | +| [IOR](/apis/core/#PBRMaterial-ior) | 折射率 | +| [baseColor](/apis/core/#PBRBaseMaterial-baseColor) | 基础颜色。**基础颜色** \* **基础颜色纹理** = **最后的基础颜色**。基础颜色是物体的反照率值，与传统的漫反射颜色不同，它会同时贡献镜面反射和漫反射的颜色，我们可以通过上面提到过的金属度、粗糙度，来控制贡献比。 | +| [baseTexture](/apis/core/#PBRBaseMaterial-baseTexture) | 基础颜色纹理。搭配基础颜色使用，是个相乘的关系。 | -| 参数 | 应用 | + +## MetallicRoughness +| 参数 | 描述 | | :-- | :-- | | [metallic](/apis/core/#PBRMaterial-metallic) | 金属度。模拟材质的金属程度，金属值越大，镜面反射越强，即能反射更多周边环境。 | | [roughness](/apis/core/#PBRMaterial-roughness) | 粗糙度。模拟材质的粗糙程度，粗糙度越大，微表面越不平坦，镜面反射越模糊。 | | [roughnessMetallicTexture](/apis/core/#PBRMaterial-roughnessMetallicTexture) | 金属粗糙度纹理。搭配金属粗糙度使用，是相乘的关系。 | -| [baseColor](/apis/core/#PBRBaseMaterial-baseColor) | 基础颜色。**基础颜色** \* **基础颜色纹理** = **最后的基础颜色**。基础颜色是物体的反照率值,与传统的漫反射颜色不同，它会同时贡献镜面反射和漫反射的颜色，我们可以通过上面提到过的金属度、粗糙度，来控制贡献比。 | -| [emissiveColor](/apis/core/#PBRBaseMaterial-emissiveColor) | 自发光颜色。使得即使没有光照也能渲染出颜色。 | -| [baseTexture](/apis/core/#PBRBaseMaterial-baseTexture) | 基础颜色纹理。搭配基础颜色使用，是个相乘的关系。 | -| [normalTexture](/apis/core/#PBRBaseMaterial-normalTexture) | 法线纹理。可以设置法线纹理 ，在视觉上造成一种凹凸感，还可以通过法线强度来控制凹凸程度。 | -| [emissiveTexture](/apis/core/#PBRBaseMaterial-emissiveTexture) | 自发射光纹理。我们可以设置自发光纹理和自发光颜色（[emissiveFactor](/apis/core/#PBRBaseMaterial-emissiveTexture)）达到自发光的效果，即使没有光照也能渲染出颜色。 | -| [occlusionTexture](/apis/core/#PBRBaseMaterial-occlusionTexture) | 阴影遮蔽纹理。我们可以设置阴影遮蔽纹理来提升物体的阴影细节。 | -| [tilingOffset](/apis/core/#PBRBaseMaterial-tilingOffset) | 纹理坐标的缩放与偏移。是一个 Vector4 数据，分别控制纹理坐标在 uv 方向上的缩放和偏移，参考 [案例](/examples/tiling-offset) | -| [clearCoat](/apis/core/#PBRBaseMaterial-clearCoat) | 透明涂层的强度，默认为 0，既不开启透明涂层效果，参考 [案例](/examples/pbr-clearcoat) 。 | -| [clearCoatTexture](/apis/core/#PBRBaseMaterial-clearCoatTexture) | 透明涂层强度纹理，和 clearCoat 是相乘的关系。 | -| [clearCoatRoughness](/apis/core/#PBRBaseMaterial-clearCoatRoughness) | 透明涂层的粗糙度。 | -| [clearCoatRoughnessTexture](/apis/core/#PBRBaseMaterial-clearCoatRoughnessTexture) | 透明涂层粗糙度纹理，和 clearCoatRoughness 是相乘的关系。 | -| [clearCoatNormalTexture](/apis/core/#PBRBaseMaterial-clearCoatNormalTexture) | 透明涂层法线纹理，如果没有设置则会共用原材质的法线。 | 我们调节材质的金属度，可以发现，金属度越大，周围的环境越清晰，并且开始从白色纯色变成彩色。这是因为电介质（即金属度为 1 时）材质会将光线 100% 全部反射出物体表面，即反射出彩色的周边环境： - -除了以上通用参数，PBR 提供了 **金属-粗糙度** 和 **高光-光泽度** 两种工作流，分别对应 [PBRMaterial](/apis/core/#PBRMaterial) 和 [PBRSpecularMaterial](/apis/core/#PBRSpecularMaterial)。 - +## Specular +| 参数 | 描述 | +| :-- | :-- | +| [specular](/apis/core/#PBRMaterial-specular) | 控制高光反射的强度 | +| [specularColor](/apis/core/#PBRMaterial-specularColor) | 控制高光反射的颜色 | +| [specularTexture](/apis/core/#PBRMaterial-specularTexture) | 用来控制高光反射的强度分布 | +| [specularColorTexture](/apis/core/#PBRMaterial-specularColorTexture) | 用来控制高光反射的颜色分布 | -## PBRMaterial + -#### Anisotropy +## Anisotropy 指表面材料在不同方向上的光反射特性不同，通常表现为材料表面呈现出不同的光泽或反射效果。这种效应在许多真实世界的材质中都有出现，尤其是金属、织物、头发等材料。 | 参数 | 应用 | @@ -50,8 +49,63 @@ PBR 全称是 **Physically Based Rendering**，中文意思是**基于物理的 src="https://mdn.alipayobjects.com/huamei_9ahbho/afts/img/A*j0jGRZL3iBsAAAAAAAAAAAAADgDwAQ/original" /> -#### Sheen +## Normal +| 参数 | 描述 | +| :-- | :-- | +| [normalTexture](/apis/core/#PBRBaseMaterial-normalTexture) | 法线纹理。可以设置法线纹理 ，在视觉上造成一种凹凸感，还可以通过法线强度来控制凹凸程度。 | + +## Emissive +| 参数 | 描述 | +| :-- | :-- | +| [emissiveColor](/apis/core/#PBRBaseMaterial-emissiveColor) | 自发光颜色。使得即使没有光照也能渲染出颜色。 | +| [emissiveTexture](/apis/core/#PBRBaseMaterial-emissiveTexture) | 自发射光纹理。我们可以设置自发光纹理和自发光颜色（[emissiveFactor](/apis/core/#PBRBaseMaterial-emissiveTexture)）达到自发光的效果，即使没有光照也能渲染出颜色。 | + + +## Occlusion +| 参数 | 描述 | +| :-- | :-- | +| [occlusionTexture](/apis/core/#PBRBaseMaterial-occlusionTexture) | 阴影遮蔽纹理。我们可以设置阴影遮蔽纹理来提升物体的阴影细节。 | + + +## ClearCoat + 用来模拟物体表面覆盖的透明保护层（类似汽车漆面最外层的透明清漆），能够在原有材质之上增加一层独立的高光反射，让表面看起来更亮、更有深度和真实感。 + +| 参数 | 描述 | +| :-- | :-- | +| [clearCoat](/apis/core/#PBRBaseMaterial-clearCoat) | 透明涂层的强度，默认为 0，既不开启透明涂层效果，参考 [案例](/examples/pbr-clearcoat) 。 | +| [clearCoatTexture](/apis/core/#PBRBaseMaterial-clearCoatTexture) | 透明涂层强度纹理，和 clearCoat 是相乘的关系。 | +| [clearCoatRoughness](/apis/core/#PBRBaseMaterial-clearCoatRoughness) | 透明涂层的粗糙度。 | +| [clearCoatRoughnessTexture](/apis/core/#PBRBaseMaterial-clearCoatRoughnessTexture) | 透明涂层粗糙度纹理，和 clearCoatRoughness 是相乘的关系。 | +| [clearCoatNormalTexture](/apis/core/#PBRBaseMaterial-clearCoatNormalTexture) | 透明涂层法线纹理，如果没有设置则会共用原材质的法线。 | + + + +## Thin Film Iridescence +通常表现为物体表面颜色随着观察角度和光照角度的变化而变化，这种效应在自然界中可以于肥皂泡、昆虫翅膀、珍珠等地方看到。 +| 参数 | 描述 | +| :-- | :-- | +| [iridescence](/apis/core/#PBRMaterial-iridescence) | 薄膜干涉强度，范围从 0 到 1。| +| [iridescenceTexture](/apis/core/#PBRMaterial-iridescenceTexture) | 指定一张纹理，用于控制薄膜干涉效果的强度。 | +| [iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR) | 薄膜干涉折射率，该值决定了光线的弯曲程度，对于薄膜干涉而言，它影响所得光线的颜色。 | +| [iridescenceThicknessRange](/apis/core/#PBRMaterial-iridescenceThicknessRange) | 用于控制薄膜干涉厚度，决定了最终薄膜干涉的颜色变化。 | +| [iridescenceThicknessTexture](/apis/core/#PBRMaterial-iridescenceThicknessTexture) | 指定一张纹理，用于控制薄膜干涉效果的厚度，同时也会影响到最终效果颜色。 | + + +启用 Iridescence + +- 选中 material ，确保 [iridescence](/apis/core/#PBRMaterial-iridescence) 大于 0， 打开薄膜干涉 +- 调节 [metallic](/apis/core/#PBRMaterial-metallic) ， [roughness](/apis/core/#PBRMaterial-roughness) ，[iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR) 等参数实现想要的效果 + + + + +## Sheen 通常用于模拟织物等材质表面微小的光泽效果，这种光泽一般在一定的观察角度下可以看到，类似于一些丝绸、天鹅绒或其他细致纤维材料表面的光散射特性。 @@ -76,31 +130,7 @@ PBR 全称是 **Physically Based Rendering**，中文意思是**基于物理的 src="https://mdn.alipayobjects.com/huamei_9ahbho/afts/img/A*ID62RJf8sFYAAAAAAAAAAAAADgDwAQ/original" /> -#### Thin Film Iridescence -通常表现为物体表面颜色随着观察角度和光照角度的变化而变化，这种效应在自然界中可以于肥皂泡、昆虫翅膀、珍珠等地方看到。 -| 参数 | 描述 | -| :-- | :-- | -| [iridescence](/apis/core/#PBRMaterial-iridescence) | 薄膜干涉强度，范围从 0 到 1。| -| [iridescenceTexture](/apis/core/#PBRMaterial-iridescenceTexture) | 指定一张纹理，用于控制薄膜干涉效果的强度。 | -| [iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR) | 薄膜干涉折射率，该值决定了光线的弯曲程度，对于薄膜干涉而言，它影响所得光线的颜色。 | -| [iridescenceThicknessRange](/apis/core/#PBRMaterial-iridescenceThicknessRange) | 用于控制薄膜干涉厚度，决定了最终薄膜干涉的颜色变化。 | -| [iridescenceThicknessTexture](/apis/core/#PBRMaterial-iridescenceThicknessTexture) | 指定一张纹理，用于控制薄膜干涉效果的厚度，同时也会影响到最终效果颜色。 | - - -启用 Iridescence - -- 选中 material ，确保 [iridescence](/apis/core/#PBRMaterial-iridescence) 大于 0， 打开薄膜干涉 -- 调节 [metallic](/apis/core/#PBRMaterial-metallic) ， [roughness](/apis/core/#PBRMaterial-roughness) ，[iridescenceIOR](/apis/core/#PBRMaterial-iridescenceIOR) 等参数实现想要的效果 - - - - -#### Transmission +## Transmission 描述了光线穿过物体而不是被反射或吸收的部分，当一个光照到透明或半透明物体时，部分光会穿过该物体，这就是透射的基本表现。 -#### Refraction +## Refraction | 参数 | 描述 | | :-- | :-- | | [attenuationColor](/apis/core/#PBRMaterial-attenuationColor) | 吸收颜色，决定光线在物体内部传播时颜色的变化，通过设置该颜色，可以模拟如彩色玻璃、液体或宝石内部的光学吸收效果。 | @@ -160,16 +190,3 @@ PBR 全称是 **Physically Based Rendering**，中文意思是**基于物理的 | :-- | :-- | | [Sphere](/apis/core/#PBRMaterial-Sphere) | 使用球体作为几何形状近似模拟物体的表面，可以高效地处理光线在曲面上的折射行为。 | | [Planar](/apis/core/#PBRMaterial-Planar) | 使用平面作为几何形状近似模拟物体的表面，适合处理光线在平坦材质上的透射和折射行为。 | - - -## PBRSpecularMaterial - -| 参数 | 应用 | -| :-- | :-- | -| [specularColor](/apis/core/#PBRMaterial-specularColor) | 高光度。不同于金属粗糙度工作流的根据金属度和基础颜色计算镜面反射，而是直接使用高光度来表示镜面反射颜色。(注，只有关闭金属粗糙工作流才生效) 。| -| [glossiness](/apis/core/#PBRMaterial-glossiness) | 光泽度。模拟光滑程度，与粗糙度相反。(注，只有关闭金属粗糙工作流才生效)。 | -| [specularGlossinessTexture](/apis/core/#PBRMaterial-specularGlossinessTexture) | 高光光泽度纹理。搭配高光光泽度使用，是相乘的关系。 | - -> **注**：PBR 必须开启[环境光](/docs/graphics-light-ambient) - -如果需要通过脚本使用材质，可以前往[材质的使用教程](/docs/graphics-material-script)。