Skip to content

Commit db06f7f

Browse files
Popov72ryantrem
andauthored
Inspector V2: fully support PBR materials (#17562)
Also in this PR: * Support for editing stencil parameters completed * Support for editing standard materials completed * Fixed a bug where updating **useAlbedoToTintRefraction** and **useAlbedoToTintTranslucency** did not trigger the effect update * Fixed normal map parameter editing to work for both standard and PBR materials * Fixed `HexPropertyLine` * Added support for **onBlur** to `TextInput` Note that unlike Inspector v1, we don't have a special page for `PBRMetallicRoughnessMaterial` and `PBRSpecularGlossinessMaterial`. They now both use the same editing page as `PBRMaterial`. --------- Co-authored-by: Ryan Tremblay <ryan.tremblay@microsoft.com>
1 parent 695b9ec commit db06f7f

File tree

10 files changed

+987
-344
lines changed

10 files changed

+987
-344
lines changed

packages/dev/core/src/Materials/PBR/pbrBaseMaterial.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -839,8 +839,9 @@ export abstract class PBRBaseMaterial extends PBRBaseMaterialBase {
839839

840840
/**
841841
* If set to true, no lighting calculations will be applied.
842+
* @internal
842843
*/
843-
private _unlit = false;
844+
public _unlit = false;
844845

845846
/**
846847
* If sets to true, the decal map will be applied after the detail map. Else, it is applied before (default: false)

packages/dev/core/src/Materials/PBR/pbrSubSurfaceConfiguration.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -160,16 +160,20 @@ export class PBRSubSurfaceConfiguration extends MaterialPluginBase {
160160
@serialize()
161161
public translucencyIntensity: number = 1;
162162

163+
private _useAlbedoToTintRefraction = false;
163164
/**
164165
* When enabled, transparent surfaces will be tinted with the albedo colour (independent of thickness)
165166
*/
166167
@serialize()
168+
@expandToProperty("_markAllSubMeshesAsTexturesDirty")
167169
public useAlbedoToTintRefraction: boolean = false;
168170

171+
private _useAlbedoToTintTranslucency = false;
169172
/**
170173
* When enabled, translucent surfaces will be tinted with the albedo colour (independent of thickness)
171174
*/
172175
@serialize()
176+
@expandToProperty("_markAllSubMeshesAsTexturesDirty")
173177
public useAlbedoToTintTranslucency: boolean = false;
174178

175179
private _thicknessTexture: Nullable<BaseTexture> = null;
@@ -560,15 +564,15 @@ export class PBRSubSurfaceConfiguration extends MaterialPluginBase {
560564
defines.SS_REFRACTIONMAP_OPPOSITEZ = this._scene.useRightHandedSystem && refractionTexture.isCube ? !refractionTexture.invertZ : refractionTexture.invertZ;
561565
defines.SS_LODINREFRACTIONALPHA = refractionTexture.lodLevelInAlpha;
562566
defines.SS_LINKREFRACTIONTOTRANSPARENCY = this._linkRefractionWithTransparency;
563-
defines.SS_ALBEDOFORREFRACTIONTINT = this.useAlbedoToTintRefraction;
567+
defines.SS_ALBEDOFORREFRACTIONTINT = this._useAlbedoToTintRefraction;
564568
defines.SS_USE_LOCAL_REFRACTIONMAP_CUBIC = refractionTexture.isCube && (<any>refractionTexture).boundingBoxSize;
565569
defines.SS_USE_THICKNESS_AS_DEPTH = this.useThicknessAsDepth;
566570
}
567571
}
568572
}
569573

570574
if (this._isTranslucencyEnabled) {
571-
defines.SS_ALBEDOFORTRANSLUCENCYTINT = this.useAlbedoToTintTranslucency;
575+
defines.SS_ALBEDOFORTRANSLUCENCYTINT = this._useAlbedoToTintTranslucency;
572576
}
573577
}
574578
}

packages/dev/inspector-v2/src/components/properties/materials/materialProperties.tsx

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import { SyncedSliderPropertyLine } from "shared-ui-components/fluent/hoc/proper
1414
import { Collapse } from "shared-ui-components/fluent/primitives/collapse";
1515
import { useProperty } from "../../../hooks/compoundPropertyHooks";
1616
import { BoundProperty } from "../boundProperty";
17+
import { HexPropertyLine } from "shared-ui-components/fluent/hoc/propertyLines/hexPropertyLine";
1718

1819
const OrientationOptions = [
1920
{ label: "Clockwise", value: Material.ClockWiseSideOrientation },
@@ -96,8 +97,6 @@ export const MaterialGeneralProperties: FunctionComponent<{ material: Material }
9697
nullable
9798
defaultValue={material.getScene().useRightHandedSystem ? Material.CounterClockWiseSideOrientation : Material.ClockWiseSideOrientation}
9899
/>
99-
{/* TODO: Property name is different per material type
100-
<BoundProperty component={SwitchPropertyLine} label="Disable Lighting" target={material} propertyKey="disableLighting" /> */}
101100
<BoundProperty component={SwitchPropertyLine} label="Disable Color Write" target={material} propertyKey="disableColorWrite" />
102101
<BoundProperty component={SwitchPropertyLine} label="Disable Depth Write" target={material} propertyKey="disableDepthWrite" />
103102
<BoundProperty component={SwitchPropertyLine} label="Force Depth Write" target={material} propertyKey="forceDepthWrite" />
@@ -164,9 +163,6 @@ export const MaterialTransparencyProperties: FunctionComponent<{ material: Mater
164163
propertyKey="alphaMode"
165164
options={AlphaModeOptions}
166165
/>
167-
{/* TODO: Property names are different per material type
168-
<BoundProperty component={SwitchPropertyLine} label="Diffuse/albedo texture has alpha" target={material.albedoTexture} propertyKey="hasAlpha" />
169-
<BoundProperty component={SwitchPropertyLine} label="Use alpha from diffuse/albedo texture" target={material} propertyKey="useAlphaFromDiffuseTexture" /> */}
170166
<BoundProperty component={SwitchPropertyLine} label="Separate Culling Pass" target={material} propertyKey="separateCullingPass" />
171167
</>
172168
);
@@ -181,11 +177,18 @@ export const MaterialStencilProperties: FunctionComponent<{ material: Material }
181177
<BoundProperty component={SwitchPropertyLine} label="Enabled" target={material.stencil} propertyKey="enabled" />
182178
<Collapse visible={stencilEnabled}>
183179
<>
184-
{/* TODO: Make HexPropertyLine work in the case of simply editing a hex value */}
185-
{/* <BoundProperty component={HexPropertyLine} label="Write Mask" target={material.stencil} propertyKey="mask" /> */}
186-
{/* <BoundProperty component={HexPropertyLine} label="Read Mask" target={material.stencil} propertyKey="funcMask" /> */}
187-
{/** TODO: Force int integer-only for NumberInputPropertyLine */}
188-
<BoundProperty component={NumberInputPropertyLine} label="Reference Value" target={material.stencil} propertyKey="funcRef" step={0} />
180+
<BoundProperty component={HexPropertyLine} label="Write Mask" target={material.stencil} propertyKey="mask" numBits={8} />
181+
<BoundProperty component={HexPropertyLine} label="Read Mask" target={material.stencil} propertyKey="funcMask" numBits={8} />
182+
<BoundProperty
183+
component={NumberInputPropertyLine}
184+
label="Reference Value"
185+
target={material.stencil}
186+
propertyKey="funcRef"
187+
step={1}
188+
forceInt={true}
189+
min={0}
190+
max={255}
191+
/>
189192
<PropertyLine
190193
label="Front"
191194
expandByDefault={true}

packages/dev/inspector-v2/src/components/properties/materials/normalMapProperties.tsx

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,22 @@ import type { FunctionComponent } from "react";
33
import { BoundProperty } from "../boundProperty";
44
import { SwitchPropertyLine } from "shared-ui-components/fluent/hoc/propertyLines/switchPropertyLine";
55

6-
export type MaterialWithNormalMaps = {
6+
type MaterialWithPublicNormalMaps = {
77
invertNormalMapX: boolean;
88
invertNormalMapY: boolean;
99
};
1010

11+
type MaterialWithInternalNormalMaps = {
12+
_invertNormalMapX: boolean;
13+
_invertNormalMapY: boolean;
14+
};
15+
16+
export type MaterialWithNormalMaps = MaterialWithPublicNormalMaps | MaterialWithInternalNormalMaps;
17+
18+
function IsMaterialWithPublicNormalMaps(mat: MaterialWithNormalMaps): mat is MaterialWithPublicNormalMaps {
19+
return (mat as MaterialWithPublicNormalMaps).invertNormalMapX !== undefined;
20+
}
21+
1122
/**
1223
* Displays the normal map properties of a standard material.
1324
* @param props - The required properties
@@ -18,8 +29,17 @@ export const NormalMapProperties: FunctionComponent<{ material: MaterialWithNorm
1829

1930
return (
2031
<>
21-
<BoundProperty component={SwitchPropertyLine} label="Invert X Axis" target={material} propertyKey="invertNormalMapX" />
22-
<BoundProperty component={SwitchPropertyLine} label="Invert Y Axis" target={material} propertyKey="invertNormalMapY" />
32+
{IsMaterialWithPublicNormalMaps(material) ? (
33+
<>
34+
<BoundProperty component={SwitchPropertyLine} label="Invert X Axis" target={material} propertyKey="invertNormalMapX" />
35+
<BoundProperty component={SwitchPropertyLine} label="Invert Y Axis" target={material} propertyKey="invertNormalMapY" />
36+
</>
37+
) : (
38+
<>
39+
<BoundProperty component={SwitchPropertyLine} label="Invert X Axis" target={material} propertyKey="_invertNormalMapX" />
40+
<BoundProperty component={SwitchPropertyLine} label="Invert Y Axis" target={material} propertyKey="_invertNormalMapY" />
41+
</>
42+
)}
2343
</>
2444
);
2545
};

0 commit comments

Comments
 (0)