Optmi renderer model & renderer shape parameter #38

Merged
MrKBear merged 5 commits from dev-mrkbear into master 2022-04-09 17:50:38 +08:00
10 changed files with 81 additions and 26 deletions
Showing only changes of commit a31bb73faa - Show all commits

View File

@ -29,11 +29,11 @@ class ClassicRenderer extends BasicRenderer<IClassicRendererParameter> {
public override rendererParameterOption = {}; public override rendererParameterOption = {};
public override pointsParameterOption = { public override pointsParameterOption = {
color: { type: "color", name: "" }, color: { type: "color", name: "", defaultValue: [0, 0, 0] },
size: { type: "number", name: "Common.Attr.Key.Size" } size: { type: "number", name: "Common.Attr.Key.Size", defaultValue: 60, numberStep: 10, numberMin: 0 }
}; };
public override cubeParameterOption = { public override cubeParameterOption = {
color: { type: "color", name: "" }, color: { type: "color", name: "", defaultValue: [0, 0, 0] },
}; };
private basicShader: BasicsShader = undefined as any; private basicShader: BasicsShader = undefined as any;

View File

@ -10,7 +10,7 @@ import { ColorInput } from "@Input/ColorInput/ColorInput";
import { ComboInput, IDisplayItem } from "@Input/ComboInput/ComboInput"; import { ComboInput, IDisplayItem } from "@Input/ComboInput/ComboInput";
import { import {
IParameter, IParameterOption, IParameterOptionItem, IParameter, IParameterOption, IParameterOptionItem,
IParameterValue, IParamValue, isObjectType, isVectorType IParameterValue, IParamValue, isObjectType
} from "@Model/Parameter"; } from "@Model/Parameter";
import "./Parameter.scss"; import "./Parameter.scss";
@ -20,6 +20,7 @@ interface IParameterProps<P extends IParameter = {}> {
key: ObjectID; key: ObjectID;
change: <K extends keyof P>(key: K, val: IParamValue<P[K]>) => any; change: <K extends keyof P>(key: K, val: IParamValue<P[K]>) => any;
i18n?: (key: string, language: Language) => string; i18n?: (key: string, language: Language) => string;
renderKey?: Array<keyof P>;
title?: AllI18nKeys; title?: AllI18nKeys;
titleOption?: Record<string, string>; titleOption?: Record<string, string>;
isFirst?: boolean; isFirst?: boolean;
@ -249,12 +250,18 @@ class Parameter<P extends IParameter> extends Component<IParameterProps<P> & IMi
} }
public render(): ReactNode { public render(): ReactNode {
const allOptionKeys: Array<keyof P> = Object.getOwnPropertyNames(this.props.option);
let allOptionKeys: Array<keyof P>;
if (this.props.renderKey) {
allOptionKeys = this.props.renderKey;
} else {
allOptionKeys = Object.getOwnPropertyNames(this.props.option);
}
return <> return <>
{ {
allOptionKeys.length <= 0 && this.props.title ? allOptionKeys.length > 0 && this.props.title ?
<Message <Message
isTitle isTitle
first={this.props.isFirst} first={this.props.isFirst}

View File

@ -76,6 +76,7 @@ const EN_US = {
"Common.Attr.Title.Individual.Generation": "Individual generation", "Common.Attr.Title.Individual.Generation": "Individual generation",
"Common.Attr.Title.Behaviors": "Behaviors list", "Common.Attr.Title.Behaviors": "Behaviors list",
"Common.Attr.Title.Individual.kill": "Individual kill", "Common.Attr.Title.Individual.kill": "Individual kill",
"Common.Attr.Title.Render.Parameter": "Render parameters",
"Common.Attr.Key.Display.Name": "Display name", "Common.Attr.Key.Display.Name": "Display name",
"Common.Attr.Key.Position.X": "Position X", "Common.Attr.Key.Position.X": "Position X",
"Common.Attr.Key.Position.Y": "Position Y", "Common.Attr.Key.Position.Y": "Position Y",

View File

@ -76,6 +76,7 @@ const ZH_CN = {
"Common.Attr.Title.Individual.Generation": "生成个体", "Common.Attr.Title.Individual.Generation": "生成个体",
"Common.Attr.Title.Behaviors": "行为列表", "Common.Attr.Title.Behaviors": "行为列表",
"Common.Attr.Title.Individual.kill": "消除个体", "Common.Attr.Title.Individual.kill": "消除个体",
"Common.Attr.Title.Render.Parameter": "渲染参数",
"Common.Attr.Key.Display.Name": "显示名称", "Common.Attr.Key.Display.Name": "显示名称",
"Common.Attr.Key.Position.X": "X 坐标", "Common.Attr.Key.Position.X": "X 坐标",
"Common.Attr.Key.Position.Y": "Y 坐标", "Common.Attr.Key.Position.Y": "Y 坐标",

View File

@ -1,5 +1,5 @@
import { LabelObject } from "@Model/Label" import { LabelObject } from "@Model/Label"
import type { Model } from "@Model/Model"; import type { IAnyObject, Model } from "@Model/Model";
import type { ObjectID } from "@Model/Model"; import type { ObjectID } from "@Model/Model";
/** /**
@ -37,6 +37,11 @@ class CtrlObject extends LabelObject {
*/ */
protected model: Model; protected model: Model;
/**
*
*/
public renderParameter: IAnyObject = {};
/** /**
* *
*/ */

View File

@ -3,6 +3,8 @@ import { CtrlObject } from "@Model/CtrlObject";
import type { Behavior } from "@Model/Behavior"; import type { Behavior } from "@Model/Behavior";
import { Label } from "@Model/Label"; import { Label } from "@Model/Label";
import { Range } from "@Model/Range"; import { Range } from "@Model/Range";
import { Model, ObjectID } from "@Model/Model";
import { getDefaultValue } from "@Model/Parameter";
enum GenMod { enum GenMod {
Point = "p", Point = "p",
@ -381,10 +383,14 @@ class Group extends CtrlObject {
return dataBuffer; return dataBuffer;
} }
/** public constructor(model: Model, id: ObjectID) {
*
*/ super(model, id);
public size: number = 60;
if (model.renderer) {
this.renderParameter = getDefaultValue(model.renderer.pointsParameterOption);
}
}
} }
export default Group; export default Group;

View File

@ -362,16 +362,12 @@ class Model extends Emitter<ModelEvent> {
// 渲染 // 渲染
for (let i = 0; i < this.objectPool.length; i++) { for (let i = 0; i < this.objectPool.length; i++) {
let object = this.objectPool[i]; let object = this.objectPool[i];
object.renderParameter.color = object.color;
if (object.display && object instanceof Group) { if (object.display && object instanceof Group) {
this.renderer.points(object.id, object.exportPositionData(), { this.renderer.points(object.id, object.exportPositionData(), object.renderParameter);
color: object.color,
size: object.size
} as any);
} }
if (object.display && object instanceof Range) { if (object.display && object instanceof Range) {
this.renderer.cube(object.id, object.position, object.radius, { this.renderer.cube(object.id, object.position, object.radius, object.renderParameter);
color: object.color
} as any);
} }
} }
} }

View File

@ -1,4 +1,6 @@
import { CtrlObject } from "@Model/CtrlObject"; import { CtrlObject } from "@Model/CtrlObject";
import { Model, ObjectID } from "@Model/Model";
import { getDefaultValue } from "@Model/Parameter";
/** /**
* *
@ -15,6 +17,15 @@ class Range extends CtrlObject {
*/ */
public radius: number[] = [1, 1, 1]; public radius: number[] = [1, 1, 1];
public constructor(model: Model, id: ObjectID) {
super(model, id);
if (model.renderer) {
this.renderParameter = getDefaultValue(model.renderer.cubeParameterOption);
}
}
} }
export default Range; export default Range;

View File

@ -13,6 +13,7 @@ import { AllI18nKeys } from "@Component/Localization/Localization";
import { ObjectPicker } from "@Input/ObjectPicker/ObjectPicker"; import { ObjectPicker } from "@Input/ObjectPicker/ObjectPicker";
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup"; import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
import { BehaviorPicker } from "@Input/BehaviorPicker/BehaviorPicker"; import { BehaviorPicker } from "@Input/BehaviorPicker/BehaviorPicker";
import { Parameter } from "@Input/Parameter/Parameter";
import "./GroupDetails.scss"; import "./GroupDetails.scss";
interface IGroupDetailsProps {} interface IGroupDetailsProps {}
@ -54,14 +55,6 @@ class GroupDetails extends Component<IGroupDetailsProps & IMixinStatusProps & IM
}} }}
/> />
<AttrInput
id={group.id} isNumber={true} step={10} keyI18n="Common.Attr.Key.Size"
value={group.size} min={0}
valueChange={(val) => {
this.props.status?.changeGroupAttrib(group.id, "size", (val as any) / 1);
}}
/>
<LabelPicker <LabelPicker
keyI18n="Common.Attr.Key.Label" keyI18n="Common.Attr.Key.Label"
labels={group.allLabels()} labels={group.allLabels()}
@ -115,6 +108,23 @@ class GroupDetails extends Component<IGroupDetailsProps & IMixinStatusProps & IM
}} }}
/> />
<Parameter
key={group.id}
option={this.props.status?.renderer.pointsParameterOption ?? {}}
title={"Common.Attr.Title.Render.Parameter"}
value={group.renderParameter}
renderKey={
Object.getOwnPropertyNames(this.props.status?.renderer.pointsParameterOption ?? {})
.filter((key) => key !== "color")
}
change={(key, value) => {
group.renderParameter[key as any] = value;
this.props.status?.changeGroupAttrib(
group.id, "renderParameter", group.renderParameter
);
}}
/>
<Message i18nKey="Common.Attr.Title.Behaviors" isTitle/> <Message i18nKey="Common.Attr.Title.Behaviors" isTitle/>
<BehaviorPicker <BehaviorPicker

View File

@ -8,6 +8,7 @@ import { ColorInput } from "@Input/ColorInput/ColorInput";
import { TogglesInput } from "@Input/TogglesInput/TogglesInput"; import { TogglesInput } from "@Input/TogglesInput/TogglesInput";
import { LabelPicker } from "@Input/LabelPicker/LabelPicker"; import { LabelPicker } from "@Input/LabelPicker/LabelPicker";
import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup"; import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
import { Parameter } from "@Input/Parameter/Parameter";
import "./RangeDetails.scss"; import "./RangeDetails.scss";
@useStatusWithEvent("rangeAttrChange", "focusObjectChange", "rangeLabelChange") @useStatusWithEvent("rangeAttrChange", "focusObjectChange", "rangeLabelChange")
@ -72,6 +73,23 @@ class RangeDetails extends Component<IMixinStatusProps> {
}} }}
/> />
<Parameter
key={range.id}
option={this.props.status?.renderer.cubeParameterOption ?? {}}
title={"Common.Attr.Title.Render.Parameter"}
value={range.renderParameter}
renderKey={
Object.getOwnPropertyNames(this.props.status?.renderer.cubeParameterOption ?? {})
.filter((key) => key !== "color")
}
change={(key, value) => {
range.renderParameter[key as any] = value;
this.props.status?.changeRangeAttrib(
range.id, "renderParameter", range.renderParameter
);
}}
/>
<Message i18nKey="Common.Attr.Title.Spatial" isTitle/> <Message i18nKey="Common.Attr.Title.Spatial" isTitle/>
<AttrInput <AttrInput