MeshPhysicalMaterial: Added sheen roughness (#22457)

docs/api/en/materials/MeshPhysicalMaterial.html

@@ -133,6 +133,11 @@
 			This models the reflectivity of non-metallic materials. It has no effect when [page:MeshStandardMaterial.metalness metalness] is *1.0*
 		</p>
 
+		<h3>[property:Float sheenRoughness]</h3>
+		<p>
+			Roughness of the sheen layer, from *0.0* to *1.0*. Default is *1.0*.</p>
+		</p>
+
 		<h3>[property:Color sheenTint]</h3>
 		<p>
 			Used for rendering materials such as velvet. It has no effect when set to black (0x000000). Default is black.

src/loaders/MaterialLoader.js

@@ -75,6 +75,7 @@ class MaterialLoader extends Loader {
 		if ( json.roughness !== undefined ) material.roughness = json.roughness;
 		if ( json.metalness !== undefined ) material.metalness = json.metalness;
 		if ( json.sheenTint !== undefined ) material.sheenTint = new Color().setHex( json.sheenTint );
+		if ( json.sheenRoughness !== undefined ) material.sheenRoughness = json.sheenRoughness;
 		if ( json.emissive !== undefined && material.emissive !== undefined ) material.emissive.setHex( json.emissive );
 		if ( json.specular !== undefined && material.specular !== undefined ) material.specular.setHex( json.specular );
 		if ( json.specularIntensity !== undefined ) material.specularIntensity = json.specularIntensity;

src/materials/Material.js

@@ -190,6 +190,7 @@ class Material extends EventDispatcher {
 		if ( this.metalness !== undefined ) data.metalness = this.metalness;
 
 		if ( this.sheenTint && this.sheenTint.isColor ) data.sheenTint = this.sheenTint.getHex();
+		if ( this.sheenRoughness !== undefined ) data.sheenRoughness = this.sheenRoughness;
 		if ( this.emissive && this.emissive.isColor ) data.emissive = this.emissive.getHex();
 		if ( this.emissiveIntensity && this.emissiveIntensity !== 1 ) data.emissiveIntensity = this.emissiveIntensity;
 

src/materials/MeshPhysicalMaterial.js

@@ -16,6 +16,7 @@ import * as MathUtils from '../math/MathUtils.js';
  *  reflectivity: <float>,
  *
  *  sheenTint: <Color>,
+ *  sheenRoughness: <float>,
  *
  *  transmission: <float>,
  *  transmissionMap: new THREE.Texture( <Image> ),
@@ -69,6 +70,7 @@ class MeshPhysicalMaterial extends MeshStandardMaterial {
 		} );
 
 		this.sheenTint = new Color( 0x000000 );
+		this.sheenRoughness = 1.0;
 
 		this.transmission = 0.0;
 		this.transmissionMap = null;
@@ -149,6 +151,7 @@ class MeshPhysicalMaterial extends MeshStandardMaterial {
 		this.ior = source.ior;
 
 		this.sheenTint.copy( source.sheenTint );
+		this.sheenRoughness = source.sheenRoughness;
 
 		this.transmission = source.transmission;
 		this.transmissionMap = source.transmissionMap;

src/renderers/shaders/ShaderChunk/lights_physical_fragment.glsl.js

@@ -76,6 +76,7 @@ material.roughness = min( material.roughness, 1.0 );
 #ifdef USE_SHEEN
 
 	material.sheenTint = sheenTint;
+	material.sheenRoughness = clamp( sheenRoughness, 0.07, 1.0 );
 
 #endif
 `;

src/renderers/shaders/ShaderChunk/lights_physical_pars_fragment.glsl.js

@@ -15,6 +15,7 @@ struct PhysicalMaterial {
 
 	#ifdef USE_SHEEN
 		vec3 sheenTint;
+		float sheenRoughness;
 	#endif
 
 };
@@ -132,7 +133,7 @@ void RE_Direct_Physical( const in IncidentLight directLight, const in GeometricC
 
 	#ifdef USE_SHEEN
 
-		reflectedLight.directSpecular += irradiance * BRDF_Sheen( directLight.direction, geometry.viewDir, geometry.normal, material.sheenTint, material.roughness );
+		reflectedLight.directSpecular += irradiance * BRDF_Sheen( directLight.direction, geometry.viewDir, geometry.normal, material.sheenTint, material.sheenRoughness );
 
 	#else
 

src/renderers/shaders/ShaderLib.js

@@ -297,6 +297,7 @@ ShaderLib.physical = {
 			clearcoatNormalScale: { value: new Vector2( 1, 1 ) },
 			clearcoatNormalMap: { value: null },
 			sheenTint: { value: new Color( 0x000000 ) },
+			sheenRoughness: { value: 0 },
 			transmission: { value: 0 },
 			transmissionMap: { value: null },
 			transmissionSamplerSize: { value: new Vector2() },

src/renderers/shaders/ShaderLib/meshphysical_frag.glsl.js

@@ -36,6 +36,7 @@ uniform float opacity;
 
 #ifdef USE_SHEEN
 	uniform vec3 sheenTint;
+	uniform float sheenRoughness;
 #endif
 
 varying vec3 vViewPosition;

src/renderers/webgl/WebGLMaterials.js

@@ -598,7 +598,13 @@ function WebGLMaterials( properties ) {
 
 		uniforms.ior.value = material.ior; // also part of uniforms common
 
-		if ( material.sheenTint ) uniforms.sheenTint.value.copy( material.sheenTint );
+		if ( material.sheenTint && ( material.sheenTint.r > 0 || material.sheenTint.g > 0 || material.sheenTint.b > 0 ) ) {
+
+			uniforms.sheenTint.value.copy( material.sheenTint );
+
+			uniforms.sheenRoughness.value = material.sheenRoughness;
+
+		}
 
 		if ( material.clearcoat > 0 ) {