Merge branch 'master' into dev-mrkbear

Reviewed-on: http://git.mrkbear.com/MrKBear/living-together/pulls/38

source/Behavior/Behavior.ts

@@ -1,14 +1,22 @@
 import { BehaviorRecorder, IAnyBehaviorRecorder } from "@Model/Behavior";
-import { Template } from "./Template";
-import { Dynamics } from "./Dynamics";
-import { Brownian } from "./Brownian";
-import { BoundaryConstraint } from "./BoundaryConstraint"; 
+import { Template } from "@Behavior/Template";
+import { PhysicsDynamics } from "@Behavior/PhysicsDynamics";
+import { Brownian } from "@Behavior/Brownian";
+import { BoundaryConstraint } from "@Behavior/BoundaryConstraint";
+import { Tracking } from "@Behavior/Tracking";
+import { ContactAttacking } from "@Behavior/ContactAttacking";
+import { ContactAssimilate } from "@Behavior/ContactAssimilate";
+import { DelayAssimilate } from "@Behavior/DelayAssimilate";
 
 const AllBehaviors: IAnyBehaviorRecorder[] = [
-    // new BehaviorRecorder(Template),
-    new BehaviorRecorder(Dynamics),
+    new BehaviorRecorder(Template),
+    new BehaviorRecorder(PhysicsDynamics),
     new BehaviorRecorder(Brownian),
     new BehaviorRecorder(BoundaryConstraint),
+    new BehaviorRecorder(Tracking),
+    new BehaviorRecorder(ContactAttacking),
+    new BehaviorRecorder(ContactAssimilate),
+    new BehaviorRecorder(DelayAssimilate),
 ]
 
 /**
@@ -54,4 +62,13 @@ function categoryBehaviors(behaviors: IAnyBehaviorRecorder[]): ICategory[] {
     return res;
 }
 
-export { AllBehaviors, AllBehaviorsWithCategory, ICategory as ICategoryBehavior };
+function getBehaviorById(id: string): IAnyBehaviorRecorder {
+    for (let i = 0; i < AllBehaviors.length; i++) {
+        if (AllBehaviors[i].behaviorId === id) {
+            return AllBehaviors[i];
+        }
+    }
+    return getBehaviorById("Template");
+}
+
+export { AllBehaviors, AllBehaviorsWithCategory, getBehaviorById, ICategory as ICategoryBehavior };

source/Behavior/BoundaryConstraint.ts

@@ -17,46 +17,18 @@ class BoundaryConstraint extends Behavior<IBoundaryConstraintBehaviorParameter,
 
     public override behaviorName: string = "$Title";
 
-    public override iconName: string = "Running";
+    public override iconName: string = "Quantity";
 
     public override describe: string = "$Intro";
 
     public override category: string = "$Physics";
 
 	public override parameterOption = {
-		range: {
-			type: "LR",
-			name: "$range"
-		},
-		strength: {
-			type: "number",
-			name: "$Strength",
-			defaultValue: 1,
-            numberMin: 0,
-            numberStep: .1
-		}
+		range: { type: "LR", name: "$range" },
+		strength: { type: "number", name: "$Strength", defaultValue: 1, numberMin: 0, numberStep: .1 }
 	};
 
-    public override terms: Record<string, Record<string, string>> = {
-        "$Title": {
-            "ZH_CN": "边界约束",
-            "EN_US": "Boundary constraint"
-        },
-		"$range": {
-			"ZH_CN": "约束范围",
-			"EN_US": "Constraint range"
-		},
-		"$Strength": {
-			"ZH_CN": "约束强度系数",
-			"EN_US": "Restraint strength coefficient"
-		},
-        "$Intro": {
-            "ZH_CN": "个体越出边界后将主动返回",
-            "EN_US": "Individuals will return actively after crossing the border"
-        }
-    };
-
-    public effect(individual: Individual, group: Group, model: Model, t: number): void {
+    public effect = (individual: Individual, group: Group, model: Model, t: number): void => {
         let rangeList: Range[] = this.parameter.range.objects;
 
 		let fx = 0;
@@ -85,7 +57,6 @@ class BoundaryConstraint extends Behavior<IBoundaryConstraintBehaviorParameter,
 				}
 
 			} else {
-
 				fx = 0;
 				fy = 0;
 				fz = 0;
@@ -93,12 +64,33 @@ class BoundaryConstraint extends Behavior<IBoundaryConstraintBehaviorParameter,
 			}
 		}
 
-		individual.applyForce(
-			fx * this.parameter.strength,
-			fy * this.parameter.strength,
-			fz * this.parameter.strength
-		);
+        if (fLen && fLen !== Infinity) {
+            individual.applyForce(
+                fx * this.parameter.strength / fLen,
+                fy * this.parameter.strength / fLen,
+                fz * this.parameter.strength / fLen
+            );
+        }
     }
+
+	public override terms: Record<string, Record<string, string>> = {
+        "$Title": {
+            "ZH_CN": "边界约束",
+            "EN_US": "Boundary constraint"
+        },
+		"$range": {
+			"ZH_CN": "约束范围",
+			"EN_US": "Constraint range"
+		},
+		"$Strength": {
+			"ZH_CN": "约束强度系数",
+			"EN_US": "Restraint strength coefficient"
+		},
+        "$Intro": {
+            "ZH_CN": "个体越出边界后将主动返回",
+            "EN_US": "Individuals will return actively after crossing the border"
+        }
+    };
 }
 
 export { BoundaryConstraint };

source/Behavior/Brownian.ts

@@ -18,44 +18,43 @@ class Brownian extends Behavior<IBrownianBehaviorParameter, IBrownianBehaviorEve
 
     public override behaviorName: string = "$Title";
 
-    public override iconName: string = "Running";
+    public override iconName: string = "ScatterChart";
 
     public override describe: string = "$Intro";
 
 	public override category: string = "$Physics";
 
 	public override parameterOption = {
-		maxFrequency: {
-			type: "number",
-			name: "$Max.Frequency",
-			defaultValue: 5,
-			numberStep: .1,
-			numberMin: 0
-		},
-		minFrequency: {
-			type: "number",
-			name: "$Min.Frequency",
-			defaultValue: 0,
-			numberStep: .1,
-			numberMin: 0
-		},
-		maxStrength: {
-			type: "number",
-			name: "$Max.Strength",
-			defaultValue: 10,
-			numberStep: .01,
-			numberMin: 0
-		},
-		minStrength: {
-			type: "number",
-			name: "$Min.Strength",
-			defaultValue: 0,
-			numberStep: .01,
-			numberMin: 0
-		}
+		maxFrequency: { type: "number", name: "$Max.Frequency", defaultValue: 5, numberStep: .1, numberMin: 0 },
+		minFrequency: { type: "number", name: "$Min.Frequency", defaultValue: 0, numberStep: .1, numberMin: 0 },
+		maxStrength: { type: "number", name: "$Max.Strength", defaultValue: 10, numberStep: .01, numberMin: 0 },
+		minStrength: { type: "number", name: "$Min.Strength", defaultValue: 0, numberStep: .01, numberMin: 0 }
 	};
 
-    public override terms: Record<string, Record<string, string>> = {
+	public effect = (individual: Individual, group: Group, model: Model, t: number): void => {
+
+		const {maxFrequency, minFrequency, maxStrength, minStrength} = this.parameter;
+
+		let nextTime = individual.getData("Brownian.nextTime") ?? 
+		minFrequency +  Math.random() * (maxFrequency - minFrequency);
+		let currentTime = individual.getData("Brownian.currentTime") ?? 0;
+		
+		currentTime += t;
+		if (currentTime > nextTime) {
+			individual.applyForce(
+				minStrength + (Math.random() * 2 - 1) * (maxStrength - minStrength),
+				minStrength + (Math.random() * 2 - 1) * (maxStrength - minStrength),
+				minStrength + (Math.random() * 2 - 1) * (maxStrength - minStrength)
+			);
+			nextTime = minFrequency +  Math.random() * (maxFrequency - minFrequency);
+			currentTime = 0;
+		}
+
+		individual.setData("Brownian.nextTime", nextTime);
+		individual.setData("Brownian.currentTime", currentTime);
+	}
+
+	public override terms: Record<string, Record<string, string>> = {
         "$Title": {
             "ZH_CN": "布朗运动",
             "EN_US": "Brownian motion"
@@ -81,29 +80,6 @@ class Brownian extends Behavior<IBrownianBehaviorParameter, IBrownianBehaviorEve
             "EN_US": "Minimum strength"
         }
     };
-
-	public effect(individual: Individual, group: Group, model: Model, t: number): void {
-
-		const {maxFrequency, minFrequency, maxStrength, minStrength} = this.parameter;
-
-		let nextTime = individual.getData("Brownian.nextTime") ?? 
-		minFrequency +  Math.random() * (maxFrequency - minFrequency);
-		let currentTime = individual.getData("Brownian.currentTime") ?? 0;
-		
-		currentTime += t;
-		if (currentTime > nextTime) {
-			individual.applyForce(
-				minStrength + (Math.random() * 2 - 1) * (maxStrength - minStrength),
-				minStrength + (Math.random() * 2 - 1) * (maxStrength - minStrength),
-				minStrength + (Math.random() * 2 - 1) * (maxStrength - minStrength)
-			);
-			nextTime = minFrequency +  Math.random() * (maxFrequency - minFrequency);
-			currentTime = 0;
-		}
-
-		individual.setData("Brownian.nextTime", nextTime);
-		individual.setData("Brownian.currentTime", currentTime);
-	}
 }
 
 export { Brownian };

source/Behavior/ContactAssimilate.ts

@@ -0,0 +1,88 @@
+import { Behavior } from "@Model/Behavior";
+import { Group } from "@Model/Group";
+import { Individual } from "@Model/Individual";
+import { Model } from "@Model/Model";
+
+type IContactAssimilateBehaviorParameter = {
+    target: "CLG",
+    assimilate: "CG",
+	success: "number",
+    range: "number"
+}
+
+type IContactAssimilateBehaviorEvent = {}
+
+class ContactAssimilate extends Behavior<IContactAssimilateBehaviorParameter, IContactAssimilateBehaviorEvent> {
+
+    public override behaviorId: string = "ContactAssimilate";
+
+    public override behaviorName: string = "$Title";
+
+    public override iconName: string = "SyncStatus";
+
+    public override describe: string = "$Intro";
+
+    public override category: string = "$Interactive";
+
+	public override parameterOption = {
+		target: { type: "CLG", name: "$Target" },
+        assimilate: { type: "CG", name: "$Assimilate" },
+        range: { type: "number", name: "$Range", defaultValue: .05, numberMin: 0, numberStep: .01 },
+        success: { type: "number", name: "$Success", defaultValue: 90, numberMin: 0, numberMax: 100, numberStep: 5 }
+	};
+
+    public effect = (individual: Individual, group: Group, model: Model, t: number): void => {
+
+        let assimilateGroup = this.parameter.assimilate.objects;
+        if (!assimilateGroup) return;
+
+        for (let i = 0; i < this.parameter.target.objects.length; i++) {
+			const targetGroup = this.parameter.target.objects[i];
+
+			targetGroup.individuals.forEach((targetIndividual) => {
+
+				// 排除自己
+				if (targetIndividual === individual) return;
+				let dis = targetIndividual.distanceTo(individual);
+
+                // 进入同化范围
+				if (dis <= this.parameter.range) {
+					
+                    // 成功判定
+                    if (Math.random() * 100 < this.parameter.success) {
+                        targetIndividual.transfer(assimilateGroup!);
+                    }
+				}
+			});
+		}
+    }
+
+	public override terms: Record<string, Record<string, string>> = {
+        "$Title": {
+            "ZH_CN": "接触同化",
+            "EN_US": "Contact Assimilate"
+        },
+		"$Target": {
+			"ZH_CN": "从哪个群...",
+			"EN_US": "From group..."
+		},
+        "$Assimilate": {
+            "ZH_CN": "到哪个群...",
+			"EN_US": "To group..."
+        },
+        "$Range": {
+            "ZH_CN": "同化范围 (m)",
+			"EN_US": "Assimilate range (m)"
+        },
+		"$Success": {
+			"ZH_CN": "成功率 (%)",
+			"EN_US": "Success rate (%)"
+		},
+        "$Intro": {
+            "ZH_CN": "将进入同化范围内的个体同化至另一个群",
+            "EN_US": "Assimilate individuals who enter the assimilation range to another group"
+        }
+    };
+}
+
+export { ContactAssimilate };

source/Behavior/ContactAttacking.ts

@@ -0,0 +1,79 @@
+import { Behavior } from "@Model/Behavior";
+import { Group } from "@Model/Group";
+import { Individual } from "@Model/Individual";
+import { Model } from "@Model/Model";
+
+type IContactAttackingBehaviorParameter = {
+    target: "CLG",
+	success: "number",
+    range: "number"
+}
+
+type IContactAttackingBehaviorEvent = {}
+
+class ContactAttacking extends Behavior<IContactAttackingBehaviorParameter, IContactAttackingBehaviorEvent> {
+
+    public override behaviorId: string = "ContactAttacking";
+
+    public override behaviorName: string = "$Title";
+
+    public override iconName: string = "DefenderTVM";
+
+    public override describe: string = "$Intro";
+
+    public override category: string = "$Interactive";
+
+	public override parameterOption = {
+		target: { type: "CLG", name: "$Target" },
+        range: { type: "number", name: "$Range", defaultValue: .05, numberMin: 0, numberStep: .01 },
+        success: { type: "number", name: "$Success", defaultValue: 90, numberMin: 0, numberMax: 100, numberStep: 5 }
+	};
+
+    public effect = (individual: Individual, group: Group, model: Model, t: number): void => {
+
+        for (let i = 0; i < this.parameter.target.objects.length; i++) {
+			const targetGroup = this.parameter.target.objects[i];
+
+			targetGroup.individuals.forEach((targetIndividual) => {
+
+				// 排除自己
+				if (targetIndividual === individual) return;
+				let dis = targetIndividual.distanceTo(individual);
+
+                // 进入攻击范围
+				if (dis <= this.parameter.range) {
+					
+                    // 成功判定
+                    if (Math.random() * 100 < this.parameter.success) {
+                        targetIndividual.die();
+                    }
+				}
+			});
+		}
+    }
+
+	public override terms: Record<string, Record<string, string>> = {
+        "$Title": {
+            "ZH_CN": "接触攻击",
+            "EN_US": "Contact Attacking"
+        },
+		"$Target": {
+			"ZH_CN": "攻击目标",
+			"EN_US": "Attacking target"
+		},
+        "$Range": {
+            "ZH_CN": "攻击范围 (m)",
+			"EN_US": "Attacking range (m)"
+        },
+		"$Success": {
+			"ZH_CN": "成功率 (%)",
+			"EN_US": "Success rate (%)"
+		},
+        "$Intro": {
+            "ZH_CN": "攻击进入共进范围的目标群个体",
+            "EN_US": "Attack the target group and individual entering the range"
+        }
+    };
+}
+
+export { ContactAttacking };

source/Behavior/DelayAssimilate.ts

@@ -0,0 +1,96 @@
+import { Behavior } from "@Model/Behavior";
+import { Group } from "@Model/Group";
+import { Individual } from "@Model/Individual";
+import { Model } from "@Model/Model";
+
+type IDelayAssimilateBehaviorParameter = {
+    target: "CG",
+    maxDelay: "number",
+	minDelay: "number",
+	success: "number"
+}
+
+type IDelayAssimilateBehaviorEvent = {}
+
+class DelayAssimilate extends Behavior<IDelayAssimilateBehaviorParameter, IDelayAssimilateBehaviorEvent> {
+
+    public override behaviorId: string = "DelayAssimilate";
+
+    public override behaviorName: string = "$Title";
+
+    public override iconName: string = "FunctionalManagerDashboard";
+
+    public override describe: string = "$Intro";
+
+	public override category: string = "$Initiative";
+
+	public override parameterOption = {
+        target: { type: "CG", name: "$Target" },
+		maxDelay: { type: "number", name: "$Max.Delay", defaultValue: 20, numberStep: 1, numberMin: 0 },
+		minDelay: { type: "number", name: "$Min.Delay", defaultValue: 5, numberStep: 1, numberMin: 0 },
+		success: { type: "number", name: "$Success", defaultValue: 90, numberStep: 5, numberMin: 0 }
+	};
+
+	public effect = (individual: Individual, group: Group, model: Model, t: number): void => {
+
+        let assimilateGroup = this.parameter.target.objects;
+        if (!assimilateGroup) return;
+        
+        const {maxDelay, minDelay, success} = this.parameter;
+
+		let nextTime = individual.getData("DelayAssimilate.nextTime") ?? 
+		minDelay +  Math.random() * (maxDelay - minDelay);
+		let currentTime = individual.getData("DelayAssimilate.currentTime") ?? 0;
+		
+		currentTime += t;
+		if (currentTime > nextTime) {
+		
+            // 成功判定
+            if (Math.random() * 100 < success) {
+                individual.transfer(assimilateGroup);
+                nextTime = undefined;
+                currentTime = undefined;
+            } else {
+
+                nextTime = minDelay +  Math.random() * (maxDelay - minDelay);
+			    currentTime = 0;
+            }
+		}
+
+		individual.setData("DelayAssimilate.nextTime", nextTime);
+		individual.setData("DelayAssimilate.currentTime", currentTime);
+	}
+
+	public override terms: Record<string, Record<string, string>> = {
+        "$Title": {
+            "ZH_CN": "延迟同化",
+            "EN_US": "Delayed assimilation"
+        },
+        "$Intro": {
+            "ZH_CN": "随着时间的推移，个体逐渐向另一个群同化。",
+            "EN_US": "Over time, individuals gradually assimilate to another group."
+        },
+        "$Target": {
+            "ZH_CN": "同化目标",
+            "EN_US": "Assimilation target"
+        },
+		"$Max.Delay": {
+            "ZH_CN": "最长时间",
+            "EN_US": "Longest time"
+        },
+		"$Min.Delay": {
+            "ZH_CN": "最短时间",
+            "EN_US": "Shortest time"
+        },
+		"$Success": {
+            "ZH_CN": "成功率",
+            "EN_US": "Minimum strength"
+        },
+        "$Initiative": {
+            "ZH_CN": "主动",
+            "EN_US": "Initiative"
+        }
+    };
+}
+
+export { DelayAssimilate };

source/Behavior/PhysicsDynamics.ts

@@ -3,90 +3,43 @@ import Group from "@Model/Group";
 import Individual from "@Model/Individual";
 import { Model } from "@Model/Model";
 
-type IDynamicsBehaviorParameter = {
+type IPhysicsDynamicsBehaviorParameter = {
     mass: "number",
 	maxAcceleration: "number",
 	maxVelocity: "number",
-	resistance: "number"
+	resistance: "number",
+	limit: "boolean"
 }
 
-type IDynamicsBehaviorEvent = {}
+type IPhysicsDynamicsBehaviorEvent = {}
 
-class Dynamics extends Behavior<IDynamicsBehaviorParameter, IDynamicsBehaviorEvent> {
+class PhysicsDynamics extends Behavior<IPhysicsDynamicsBehaviorParameter, IPhysicsDynamicsBehaviorEvent> {
 
-    public override behaviorId: string = "Dynamics";
+    public override behaviorId: string = "PhysicsDynamics";
 
     public override behaviorName: string = "$Title";
 
-    public override iconName: string = "Running";
+    public override iconName: string = "SliderHandleSize";
 
     public override describe: string = "$Intro";
 
 	public override category: string = "$Physics";
 
 	public override parameterOption = {
-		mass: {
-			name: "$Mass",
-			type: "number",
-			defaultValue: 1,
-			numberStep: .01,
-			numberMin: .001
-		},
+		mass: { name: "$Mass", type: "number", defaultValue: 1, numberStep: .01, numberMin: .001 },
+		resistance: { name: "$Resistance", type: "number", defaultValue: 2.8, numberStep: .1, numberMin: 0 },
+		limit: { name: "$Limit", type: "boolean", defaultValue: true },
 		maxAcceleration: {
-			name: "$Max.Acceleration",
-			type: "number",
-			defaultValue: 5,
-			numberStep: .1,
-			numberMin: 0
+			name: "$Max.Acceleration", type: "number", defaultValue: 6.25, 
+			numberStep: .1, numberMin: 0, condition: { key: "limit", value: true }
 		},
 		maxVelocity: {
-			name: "$Max.Velocity",
-			type: "number",
-			defaultValue: 10,
-			numberStep: .1,
-			numberMin: 0
+			name: "$Max.Velocity", type: "number", defaultValue: 12.5,
+			numberStep: .1, numberMin: 0, condition: { key: "limit", value: true }
 		},
-		resistance: {
-			name: "$Resistance",
-			type: "number",
-			defaultValue: 0.5,
-			numberStep: .1,
-			numberMin: 0
-		}
 	};
 
-    public override terms: Record<string, Record<string, string>> = {
-        "$Title": {
-            "ZH_CN": "动力学",
-            "EN_US": "Dynamics"
-        },
-        "$Intro": {
-            "ZH_CN": "一切可以运动物体的必要行为，执行物理法则。",
-            "EN_US": "All necessary behaviors that can move objects and implement the laws of physics."
-        },
-		"$Mass": {
-			"ZH_CN": "质量 (Kg)",
-            "EN_US": "Mass (Kg)"
-		},
-		"$Max.Acceleration": {
-			"ZH_CN": "最大加速度 (m/s²)",
-            "EN_US": "Maximum acceleration (m/s²)"
-		},
-		"$Max.Velocity": {
-			"ZH_CN": "最大速度 (m/s)",
-            "EN_US": "Maximum velocity (m/s)"
-		},
-		"$Resistance": {
-			"ZH_CN": "阻力系数",
-			"EN_US": "Resistance coefficient"
-		},
-		"$Physics": {
-			"ZH_CN": "物理",
-            "EN_US": "Physics"
-		}
-    };
-
-	public override finalEffect(individual: Individual, group: Group, model: Model, t: number): void {
+	public override finalEffect = (individual: Individual, group: Group, model: Model, t: number): void => {
 
 		// 计算当前速度
 		const currentV = individual.vectorLength(individual.velocity);
@@ -109,24 +62,28 @@ class Dynamics extends Behavior<IDynamicsBehaviorParameter, IDynamicsBehaviorEve
 		individual.acceleration[2] = individual.force[2] / this.parameter.mass;
 
 		// 加速度约束
-		const lengthA = individual.vectorLength(individual.acceleration);
-		if (lengthA > this.parameter.maxAcceleration) {
-			individual.acceleration[0] = individual.acceleration[0] * this.parameter.maxAcceleration / lengthA;
-			individual.acceleration[1] = individual.acceleration[1] * this.parameter.maxAcceleration / lengthA;
-			individual.acceleration[2] = individual.acceleration[2] * this.parameter.maxAcceleration / lengthA;
+		if (this.parameter.limit) {
+			const lengthA = individual.vectorLength(individual.acceleration);
+			if (lengthA > this.parameter.maxAcceleration) {
+				individual.acceleration[0] = individual.acceleration[0] * this.parameter.maxAcceleration / lengthA;
+				individual.acceleration[1] = individual.acceleration[1] * this.parameter.maxAcceleration / lengthA;
+				individual.acceleration[2] = individual.acceleration[2] * this.parameter.maxAcceleration / lengthA;
+			}
 		}
-
+		
 		// 计算速度
 		individual.velocity[0] = individual.velocity[0] + individual.acceleration[0] * t;
 		individual.velocity[1] = individual.velocity[1] + individual.acceleration[1] * t;
 		individual.velocity[2] = individual.velocity[2] + individual.acceleration[2] * t;
 
 		// 速度约束
-		const lengthV = individual.vectorLength(individual.velocity);
-		if (lengthV > this.parameter.maxVelocity) {
-			individual.velocity[0] = individual.velocity[0] * this.parameter.maxVelocity / lengthV;
-			individual.velocity[1] = individual.velocity[1] * this.parameter.maxVelocity / lengthV;
-			individual.velocity[2] = individual.velocity[2] * this.parameter.maxVelocity / lengthV;
+		if (this.parameter.limit) {
+			const lengthV = individual.vectorLength(individual.velocity);
+			if (lengthV > this.parameter.maxVelocity) {
+				individual.velocity[0] = individual.velocity[0] * this.parameter.maxVelocity / lengthV;
+				individual.velocity[1] = individual.velocity[1] * this.parameter.maxVelocity / lengthV;
+				individual.velocity[2] = individual.velocity[2] * this.parameter.maxVelocity / lengthV;
+			}
 		}
 
 		// 应用速度
@@ -139,6 +96,41 @@ class Dynamics extends Behavior<IDynamicsBehaviorParameter, IDynamicsBehaviorEve
 		individual.force[1] = 0;
 		individual.force[2] = 0;
 	};
+	
+    public override terms: Record<string, Record<string, string>> = {
+        "$Title": {
+            "ZH_CN": "物理动力学",
+            "EN_US": "Physics dynamics"
+        },
+        "$Intro": {
+            "ZH_CN": "一切按照物理规则运动物体的行为, 按照牛顿经典物理运动公式执行。",
+            "EN_US": "The behavior of all moving objects according to physical rules is carried out according to Newton's classical physical motion formula."
+        },
+		"$Limit": {
+			"ZH_CN": "开启限制",
+            "EN_US": "Enable limit"
+		},
+		"$Mass": {
+			"ZH_CN": "质量 (Kg)",
+            "EN_US": "Mass (Kg)"
+		},
+		"$Max.Acceleration": {
+			"ZH_CN": "最大加速度 (m/s²)",
+            "EN_US": "Maximum acceleration (m/s²)"
+		},
+		"$Max.Velocity": {
+			"ZH_CN": "最大速度 (m/s)",
+            "EN_US": "Maximum velocity (m/s)"
+		},
+		"$Resistance": {
+			"ZH_CN": "阻力系数",
+			"EN_US": "Resistance coefficient"
+		},
+		"$Physics": {
+			"ZH_CN": "物理",
+            "EN_US": "Physics"
+		}
+    };
 }
 
-export { Dynamics };
+export { PhysicsDynamics };

source/Behavior/Template.ts

@@ -7,11 +7,15 @@ type ITemplateBehaviorParameter = {
     testNumber: "number";
     testString: "string";
     testBoolean: "boolean";
+    testColor: "color";
+    testOption: "option";
     testR: "R";
     testG: "G";
     testLR: "LR";
     testLG: "LG";
     testVec: "vec";
+    testCG: "CG",
+    testCLG: "CLG",
 }
 
 type ITemplateBehaviorEvent = {}
@@ -29,52 +33,26 @@ class Template extends Behavior<ITemplateBehaviorParameter, ITemplateBehaviorEve
     public override category: string = "$Category";
 
     public override parameterOption = {
-        testNumber: {
-            name: "$Test",
-            type: "number",
-            defaultValue: 1,
-            numberMax: 10,
-            numberMin: 0,
-            numberStep: 1
-        },
-        testString: {
-            name: "$Test",
-            type: "string",
-            defaultValue: "default",
-            maxLength: 12
-        },
-        testBoolean: {
-            name: "$Test",
-            type: "boolean",
-            defaultValue: false,
-            iconName: "Send"
-        },
-        testR: {
-            name: "$Test",
-            type: "R"
-        },
-        testG: {
-            name: "$Test",
-            type: "G"
-        },
-        testLR: {
-            name: "$Test",
-            type: "LR"
-        },
-        testLG: {
-            name: "$Test",
-            type: "LG"
-        },
-        testVec: {
-            name: "$Test",
-            type: "vec",
-            defaultValue: [1, 2, 3],
-            numberMax: 10,
-            numberMin: 0,
-            numberStep: 1
-        }
+        testNumber: { name: "$Test", type: "number", defaultValue: 1, numberMax: 10, numberMin: 0, numberStep: 1 },
+        testString: { name: "$Test", type: "string", defaultValue: "default", maxLength: 12 },
+        testColor: { name: "$Test", type: "color", defaultValue: [.5, .1, 1], colorNormal: true },
+        testOption: { name: "$Test", type: "option", defaultValue: "T", allOption: [
+            { key: "P", name: "$Test"}, { key: "T", name: "$Title"}
+        ]},
+        testBoolean: { name: "$Test", type: "boolean", defaultValue: false, iconName: "Send" },
+        testR: { name: "$Test", type: "R" },
+        testG: { name: "$Test", type: "G" },
+        testLR: { name: "$Test", type: "LR" },
+        testLG: { name: "$Test", type: "LG" },
+        testCG: { name: "$Test", type: "CG" },
+        testCLG: { name: "$Test", type: "CLG" },
+        testVec: { name: "$Test", type: "vec", defaultValue: [1, 2, 3], numberMax: 10, numberMin: 0, numberStep: 1 }
     };
 
+    public effect = (individual: Individual, group: Group, model: Model, t: number): void => {
+        
+    }
+
     public override terms: Record<string, Record<string, string>> = {
         "$Title": {
             "ZH_CN": "行为",
@@ -87,12 +65,12 @@ class Template extends Behavior<ITemplateBehaviorParameter, ITemplateBehaviorEve
         "$Test": {
             "ZH_CN": "测试参数",
             "EN_US": "Test Parameter"
+        },
+        "$Category": {
+            "ZH_CN": "测序模板",
+            "EN_US": "Test template"
         }
     };
-
-    public effect(individual: Individual, group: Group, model: Model, t: number): void {
-        
-    }
 }
 
 export { Template };

source/Behavior/Tracking.ts

@@ -0,0 +1,157 @@
+import { Behavior } from "@Model/Behavior";
+import { Group } from "@Model/Group";
+import { Individual } from "@Model/Individual";
+import { Model } from "@Model/Model";
+
+type ITrackingBehaviorParameter = {
+    target: "CLG",
+	strength: "number",
+    range: "number",
+    lock: "boolean"
+}
+
+type ITrackingBehaviorEvent = {}
+
+class Tracking extends Behavior<ITrackingBehaviorParameter, ITrackingBehaviorEvent> {
+
+    public override behaviorId: string = "Tracking";
+
+    public override behaviorName: string = "$Title";
+
+    public override iconName: string = "Bullseye";
+
+    public override describe: string = "$Intro";
+
+    public override category: string = "$Interactive";
+
+	public override parameterOption = {
+		target: { type: "CLG", name: "$Target" },
+        lock: { type: "boolean", name: "$Lock", defaultValue: false },
+        range: { type: "number", name: "$Range", defaultValue: 4, numberMin: 0, numberStep: .1 },
+		strength: { type: "number", name: "$Strength", defaultValue: 1, numberMin: 0, numberStep: .1 }
+	};
+
+    private target: Individual | undefined = undefined;
+    private currentDistant: number = Infinity;
+
+    private searchTarget(individual: Individual) {
+
+		for (let i = 0; i < this.parameter.target.objects.length; i++) {
+			const targetGroup = this.parameter.target.objects[i];
+
+			targetGroup.individuals.forEach((targetIndividual) => {
+
+				// 排除自己
+				if (targetIndividual === individual) return;
+				let dis = targetIndividual.distanceTo(individual);
+
+				if (dis < this.currentDistant && dis <= this.parameter.range) {
+					this.target = targetIndividual;
+					this.currentDistant = dis;
+				}
+
+			});
+		}
+    }
+
+    private clearTarget() {
+        this.target = undefined as Individual | undefined;
+        this.currentDistant = Infinity;
+    }
+
+    public effect = (individual: Individual, group: Group, model: Model, t: number): void => {
+
+        this.clearTarget();
+
+        if (this.parameter.lock) {
+
+            let isValidTarget = false;
+            this.target = individual.getData("Tracking.lock.target");
+
+            if (this.target) {
+
+                // 校验目标所在的群是否仍是目标
+                let isInTarget = false;
+                for (let i = 0; i < this.parameter.target.objects.length; i++) {
+                    if (this.parameter.target.objects[i].equal(this.target.group)) {
+                        isInTarget = true;
+                        break;
+                    }
+                }
+
+                // 如果还在目标范围内，校验距离
+                if (isInTarget) {
+                    let dis = individual.distanceTo(this.target);
+
+                    // 校验成功
+                    if (dis <= this.parameter.range) {
+                        this.currentDistant = dis;
+                        isValidTarget = true;
+                    }
+                }
+            }
+
+            // 如果目标无效，尝试搜索新的目标
+            if (!isValidTarget) {
+
+                this.clearTarget();
+                this.searchTarget(individual);
+
+                // 如果成功搜索，缓存目标
+                if (this.target && this.currentDistant && this.currentDistant !== Infinity) {
+                    individual.setData("Tracking.lock.target", this.target);
+                }
+
+                // 搜索失败，清除目标
+                else {
+                    individual.setData("Tracking.lock.target", undefined);
+                }
+            }
+        }
+
+        else {
+            this.searchTarget(individual);
+        }
+
+		if (this.target && this.currentDistant && this.currentDistant !== Infinity) {
+			individual.applyForce(
+				(this.target.position[0] - individual.position[0]) * this.parameter.strength / this.currentDistant,
+				(this.target.position[1] - individual.position[1]) * this.parameter.strength / this.currentDistant,
+				(this.target.position[2] - individual.position[2]) * this.parameter.strength / this.currentDistant
+			);
+		}
+    }
+
+	public override terms: Record<string, Record<string, string>> = {
+        "$Title": {
+            "ZH_CN": "追踪",
+            "EN_US": "Tracking"
+        },
+		"$Target": {
+			"ZH_CN": "追踪目标",
+			"EN_US": "Tracking target"
+		},
+        "$Lock": {
+            "ZH_CN": "追踪锁定",
+			"EN_US": "Tracking lock"
+        },
+        "$Range": {
+            "ZH_CN": "追踪范围 (m)",
+			"EN_US": "Tracking range (m)"
+        },
+		"$Strength": {
+			"ZH_CN": "追踪强度系数",
+			"EN_US": "Tracking intensity coefficient"
+		},
+        "$Intro": {
+            "ZH_CN": "个体将主动向最近的目标群个体发起追踪",
+            "EN_US": "The individual will actively initiate tracking to the nearest target group individual"
+        },
+		"$Interactive": {
+			"ZH_CN": "交互",
+            "EN_US": "Interactive"
+		}
+    };
+}
+
+export { Tracking };

source/Component/BehaviorList/BehaviorList.scss

@@ -94,8 +94,8 @@ div.behavior-list {
             }
 
             div.behavior-content-view {
-                width: calc( 100% - 50px );
-                padding-right: 5px;
+                width: calc( 100% - 55px );
+                padding-right: 10px;
                 max-width: 125px;
                 height: $behavior-item-height;
                 display: flex;

source/Component/BehaviorList/BehaviorList.tsx

@@ -1,11 +1,13 @@
-import { Theme } from "@Component/Theme/Theme";
 import { Component, ReactNode } from "react";
-import { IRenderBehavior, Behavior, BehaviorRecorder } from "@Model/Behavior";
+import { Icon } from "@fluentui/react";
 import { useSettingWithEvent, IMixinSettingProps } from "@Context/Setting";
 import { useStatus, IMixinStatusProps } from "@Context/Status";
-import { Icon } from "@fluentui/react";
+import { IRenderBehavior, Behavior, BehaviorRecorder } from "@Model/Behavior";
+import { Theme } from "@Component/Theme/Theme";
 import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
-import { Message } from "@Component/Message/Message";
+import { Message } from "@Input/Message/Message";
+
+
 import "./BehaviorList.scss";
 
 interface IBehaviorListProps {

source/Component/BehaviorPopup/BehaviorPopup.tsx

@@ -1,15 +1,15 @@
 import { Component, ReactNode, Fragment } from "react";
 import { Popup } from "@Context/Popups";
+import { useStatus, IMixinStatusProps, randomColor } from "@Context/Status";
+import { useSettingWithEvent, IMixinSettingProps } from "@Context/Setting";
 import { Localization } from "@Component/Localization/Localization";
-import { SearchBox } from "@Component/SearchBox/SearchBox";
+import { SearchBox } from "@Input/SearchBox/SearchBox";
 import { ConfirmContent } from "@Component/ConfirmPopup/ConfirmPopup";
 import { BehaviorList } from "@Component/BehaviorList/BehaviorList";
 import { AllBehaviorsWithCategory, ICategoryBehavior } from "@Behavior/Behavior";
-import { Message } from "@Component/Message/Message";
+import { Message } from "@Input/Message/Message";
 import { IRenderBehavior, BehaviorRecorder } from "@Model/Behavior";
-import { useStatus, IMixinStatusProps, randomColor } from "@Context/Status";
-import { useSettingWithEvent, IMixinSettingProps } from "@Context/Setting";
-import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
+
 import "./BehaviorPopup.scss";
 
 interface IBehaviorPopupProps {

source/Component/CommandBar/CommandBar.tsx

@@ -1,12 +1,12 @@
-import { BackgroundLevel, Theme } from "@Component/Theme/Theme";
+import { Component, ReactNode } from "react";
 import { DirectionalHint, IconButton } from "@fluentui/react";
-import { LocalizationTooltipHost } from "../Localization/LocalizationTooltipHost";
 import { useSetting, IMixinSettingProps } from "@Context/Setting";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
-import { AllI18nKeys } from "../Localization/Localization";
-import { SettingPopup } from "../SettingPopup/SettingPopup";
-import { BehaviorPopup } from "../BehaviorPopup/BehaviorPopup";
-import { Component, ReactNode } from "react";
+import { BackgroundLevel, Theme } from "@Component/Theme/Theme";
+import { LocalizationTooltipHost } from "@Component/Localization/LocalizationTooltipHost";
+import { AllI18nKeys } from "@Component/Localization/Localization";
+import { SettingPopup } from "@Component/SettingPopup/SettingPopup";
+import { BehaviorPopup } from "@Component/BehaviorPopup/BehaviorPopup";
 import { MouseMod } from "@GLRender/ClassicRenderer";
 import "./CommandBar.scss";
 

source/Component/ConfirmPopup/ConfirmPopup.tsx

@@ -1,6 +1,6 @@
-import { Popup } from "@Context/Popups";
 import { Component, ReactNode } from "react";
-import { Message } from "@Component/Message/Message";
+import { Popup } from "@Context/Popups";
+import { Message } from "@Input/Message/Message";
 import { Theme } from "@Component/Theme/Theme";
 import { AllI18nKeys, Localization } from "@Component/Localization/Localization";
 import "./ConfirmPopup.scss";

source/Component/Container/Container.scss

@@ -119,6 +119,10 @@ div.app-container {
 		flex-shrink: 1;
 	}
 
+	div.app-panel.hide-scrollbar {
+		overflow: hidden;
+	}
+
 	div.app-panel.hide-scrollbar::-webkit-scrollbar {
 		width : 0;  /*高宽分别对应横竖滚动条的尺寸*/
 		height: 0;

source/Component/Container/Container.tsx

@@ -1,11 +1,11 @@
-import { Localization } from "@Component/Localization/Localization";
-import { Theme, BackgroundLevel, FontLevel } from "@Component/Theme/Theme";
-import { Themes } from "@Context/Setting";
-import { DirectionalHint } from "@fluentui/react";
-import { ILayout, LayoutDirection } from "@Context/Layout";
 import { Component, ReactNode, MouseEvent } from "react";
-import { getPanelById, getPanelInfoById } from "../../Panel/Panel";
-import { LocalizationTooltipHost } from "../Localization/LocalizationTooltipHost";
+import { DirectionalHint } from "@fluentui/react";
+import { Themes } from "@Context/Setting";
+import { ILayout, LayoutDirection } from "@Context/Layout";
+import { Localization } from "@Component/Localization/Localization";
+import { BackgroundLevel, FontLevel } from "@Component/Theme/Theme";
+import { getPanelById, getPanelInfoById } from "@Panel/Panel";
+import { LocalizationTooltipHost } from "@Component/Localization/LocalizationTooltipHost";
 import "./Container.scss";
 
 interface IContainerProps extends ILayout {

source/Component/DetailsList/DetailsList.tsx

@@ -1,6 +1,6 @@
-import { Icon } from "@fluentui/react";
 import { Component, ReactNode } from "react";
-import { BackgroundLevel, FontLevel, Theme } from "../Theme/Theme";
+import { Icon } from "@fluentui/react";
+import { BackgroundLevel, FontLevel, Theme } from "@Component/Theme/Theme";
 import "./DetailsList.scss";
 
 type IItems = Record<string, any> & {key: string, select?: boolean};

source/Component/HeaderBar/HeaderBar.tsx

@@ -1,12 +1,11 @@
 import { Component, ReactNode } from "react";
+import { Icon } from '@fluentui/react/lib/Icon';
 import { useStatus, IMixinStatusProps } from "@Context/Status";
 import { useSetting, IMixinSettingProps } from "@Context/Setting";
 import { Theme, BackgroundLevel, FontLevel } from "@Component/Theme/Theme";
-import { Icon } from '@fluentui/react/lib/Icon';
-import { LocalizationTooltipHost } from "../Localization/LocalizationTooltipHost";
-import { I18N } from "../Localization/Localization";
+import { LocalizationTooltipHost } from "@Component/Localization/LocalizationTooltipHost";
+import { I18N } from "@Component/Localization/Localization";
 import "./HeaderBar.scss";
-import { Tooltip, TooltipHost } from "@fluentui/react";
 
 interface IHeaderBarProps {
     height: number;

source/Component/LabelList/LabelList.tsx

@@ -1,7 +1,7 @@
 import { Component, RefObject } from "react";
-import { Label } from "@Model/Label";
 import { Icon } from "@fluentui/react";
 import { useSetting, IMixinSettingProps, Themes } from "@Context/Setting";
+import { Label } from "@Model/Label";
 import "./LabelList.scss";
 
 interface ILabelListProps {

source/Component/Localization/Localization.tsx

@@ -78,4 +78,4 @@ class Localization extends Component<ILocalizationProps & IMixinSettingProps &
     }
 }
 
-export { Localization, I18N, LanguageDataBase, AllI18nKeys };
+export { Localization, I18N, LanguageDataBase, AllI18nKeys, ILocalizationProps };

source/Component/Popup/Popup.tsx

@@ -1,9 +1,9 @@
 import { Component, ReactNode } from "react";
+import { Icon } from "@fluentui/react";
 import { IMixinStatusProps, useStatusWithEvent } from "@Context/Status";
 import { IMixinSettingProps, useSettingWithEvent } from "@Context/Setting";
 import { BackgroundLevel, FontLevel, getClassList, Theme } from "@Component/Theme/Theme";
 import { Popup as PopupModel, ResizeDragDirection } from "@Context/Popups";
-import { Icon } from "@fluentui/react";
 import "./Popup.scss";
 
 interface IPopupProps {}

source/Component/Theme/Theme.tsx

@@ -1,5 +1,5 @@
-import { useSettingWithEvent, Themes, IMixinSettingProps, Setting } from "@Context/Setting";
 import { Component, ReactNode, DetailedHTMLProps, HTMLAttributes } from "react";
+import { useSettingWithEvent, Themes, IMixinSettingProps, Setting } from "@Context/Setting";
 import "./Theme.scss";
 
 enum FontLevel {

source/Context/Context.tsx

@@ -1,5 +1,5 @@
-import { Emitter, EventType } from "@Model/Emitter";
 import { Component, FunctionComponent, ReactNode, Consumer } from "react";
+import { Emitter, EventType } from "@Model/Emitter";
 
 type RenderComponent = (new (...p: any) => Component<any, any, any>) | FunctionComponent<any>;
 

source/Context/Popups.ts

@@ -1,7 +1,7 @@
 import { ReactNode, createElement } from "react";
 import { Emitter } from "@Model/Emitter";
 import { Localization } from "@Component/Localization/Localization";
-import { IAnyObject } from "@Model/Renderer";
+import { IAnyObject } from "@Model/Model";
 
 enum ResizeDragDirection {
     top = 1,

source/Context/Setting.tsx

@@ -1,7 +1,7 @@
 import { createContext } from "react";
-import { superConnect, superConnectWithEvent } from "./Context";
+import { superConnect, superConnectWithEvent } from "@Context/Context";
 import { Emitter } from "@Model/Emitter";
-import { Layout } from "./Layout";
+import { Layout } from "@Context/Layout";
 
 /**
  * 主题模式

source/Context/Status.tsx

@@ -7,11 +7,12 @@ import { Group } from "@Model/Group";
 import { Archive } from "@Model/Archive";
 import { AbstractRenderer } from "@Model/Renderer";
 import { ClassicRenderer, MouseMod } from "@GLRender/ClassicRenderer";
-import { Setting } from "./Setting";
+import { Setting } from "@Context/Setting";
 import { I18N } from "@Component/Localization/Localization";
-import { superConnectWithEvent, superConnect } from "./Context";
-import { PopupController } from "./Popups";
-import { Behavior, IBehaviorParameter, IParamValue } from "@Model/Behavior";
+import { superConnectWithEvent, superConnect } from "@Context/Context";
+import { PopupController } from "@Context/Popups";
+import { Behavior } from "@Model/Behavior";
+import { IParameter, IParamValue } from "@Model/Parameter";
 import { Actuator } from "@Model/Actuator";
 
 function randomColor(unNormal: boolean = false) {
@@ -208,7 +209,7 @@ class Status extends Emitter<IStatusEvent> {
     /**
      * 修改群属性
      */
-    public changeBehaviorAttrib<K extends IBehaviorParameter, P extends keyof K | keyof Behavior<K>>
+    public changeBehaviorAttrib<K extends IParameter, P extends keyof K | keyof Behavior<K>>
     (id: ObjectID, key: P, val: IParamValue<K[P]>, noParameter?: boolean) {
         const behavior = this.model.getBehaviorById(id);
         if (behavior) {

source/GLRender/BasicGroup.ts

@@ -44,6 +44,11 @@ class BasicGroup extends DisplayObject<GroupShader> {
      */
     public color = [1, 1, 1];
 
+    /**
+     * 形状
+     */
+    public shape: number = 0;
+
     /**
      * 绘制立方体
      */
@@ -66,6 +71,9 @@ class BasicGroup extends DisplayObject<GroupShader> {
         // 半径传递
         this.shader.radius(this.size);
 
+        // 形状传递
+        this.shader.shape(this.shape);
+
         // 指定颜色
         this.shader.color(this.color);
 

source/GLRender/BasicRenderer.ts

@@ -1,4 +1,4 @@
-import { AbstractRenderer, IRendererParam, IAnyObject } from "@Model/Renderer";
+import { AbstractRenderer, IRendererParam } from "@Model/Renderer";
 import { EventType } from "@Model/Emitter";
 import { GLCanvas, GLCanvasOption } from "./GLCanvas";
 import { GLContext } from "./GLContext";
@@ -16,19 +16,13 @@ type IRendererParams = IRendererOwnParams & GLCanvasOption;
 
 abstract class BasicRenderer<
     P extends IRendererParam = {},
-    M extends IAnyObject = {},
     E extends Record<EventType, any> = {}
-> extends AbstractRenderer<P, M & IRendererParams, E & {loop: number}> {
+> extends AbstractRenderer<P, E & {loop: number}> {
 
     public get dom() {
         return this.canvas.dom
     }
 
-    /**
-	 * 渲染器参数
-	 */
-	public param: Partial<M & IRendererParams> = {};
-
     /**
 	 * 使用的画布
 	 */
@@ -44,19 +38,16 @@ abstract class BasicRenderer<
      */
     protected clock: Clock;
 
-    public constructor(param: Partial<M & IRendererParams> = {}) {
+    public constructor() {
 		super();
-
-		// 初始化参数
-		this.param = {
-			autoResize: param.autoResize ?? true,
-			mouseEvent: param.autoResize ?? true,
-			eventLog: param.eventLog ?? false,
-			className: param.className ?? ""
-		} as M & IRendererParams;
 		
 		// 实例化画布对象
-		this.canvas = new GLCanvas(param.canvas, this.param);
+		this.canvas = new GLCanvas(undefined, {
+			autoResize: true,
+			mouseEvent: true,
+			eventLog: false,
+			className: "canvas"
+		});
 
         // 实例化摄像机
         this.camera = new Camera(this.canvas);

source/GLRender/ClassicRenderer.ts

@@ -1,27 +1,49 @@
-import { ObjectID, ObjectData, ICommonParam } from "@Model/Renderer";
+import { ObjectData } from "@Model/Renderer";
+import { ObjectID } from "@Model/Model";
+import { IParameterValue, getDefaultValue } from "@Model/Parameter";
 import { BasicRenderer } from "./BasicRenderer";
 import { BasicsShader } from "./BasicShader";
 import { Axis } from "./Axis";
 import { BasicCube } from "./BasicCube";
 import { GroupShader } from "./GroupShader";
 import { BasicGroup } from "./BasicGroup";
-import DisplayObject from "./DisplayObject";
-
-interface IClassicRendererParams {
-    point: {
-        size: number;
-    }
-    cube: {
-        radius: number[];
-    }
-}
+import { DisplayObject } from "./DisplayObject";
 
 enum MouseMod {
     Drag = 1,
     click = 2
 }
 
-class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> {
+type IClassicRendererParameter = {
+	renderer: {};
+	points: {
+        color: "color",
+        size: "number",
+        shape: "option"
+    };
+	cube: {
+        color: "color"
+    };
+}
+
+class ClassicRenderer extends BasicRenderer<IClassicRendererParameter> {
+
+    public override rendererParameterOption = {};
+	public override pointsParameterOption = {
+        color: { type: "color", name: "", defaultValue: [0, 0, 0] },
+        size: { type: "number", name: "Common.Attr.Key.Size", defaultValue: 60, numberStep: 10, numberMin: 0 },
+        shape: { type: "option", name: "Common.Render.Attr.Key.Display.Shape", defaultValue: "0", allOption: [
+            { key: "0", name: "Common.Render.Attr.Key.Display.Shape.Square" },
+            { key: "1", name: "Common.Render.Attr.Key.Display.Shape.Hollow.Square" },
+            { key: "2", name: "Common.Render.Attr.Key.Display.Shape.Hollow.Plus" },
+            { key: "3", name: "Common.Render.Attr.Key.Display.Shape.Hollow.Reduce" },
+            { key: "4", name: "Common.Render.Attr.Key.Display.Shape.Hollow.Cross" },
+            { key: "5", name: "Common.Render.Attr.Key.Display.Shape.Hollow.Checkerboard" }
+        ]}
+    };
+	public override cubeParameterOption = {
+        color: { type: "color", name: "", defaultValue: [0, 0, 0] },
+    };
 
     private basicShader: BasicsShader = undefined as any;
     private axisObject: Axis = undefined as any;
@@ -51,6 +73,8 @@ class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> {
     }
 
     public onLoad(): this {
+
+        this.rendererParameter = getDefaultValue(this.rendererParameterOption);
         
         // 自动调节分辨率
         this.autoResize();
@@ -187,7 +211,7 @@ class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> {
 
     points(
         id: ObjectID, position?: ObjectData,
-        param?: Readonly<Partial<ICommonParam & IClassicRendererParams["point"]>>
+        param?: Readonly<IParameterValue<IClassicRendererParameter["points"]>>
     ): this {
         let object = this.objectPool.get(id);
         let group: BasicGroup;
@@ -229,14 +253,19 @@ class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> {
             if (param.size) {
                 group.size = param.size;
             }
+
+            // 半径数据
+            if (param.shape) {
+                group.shape = parseInt(param.shape);
+            }
         }
 
         return this;
     }
 
     cube(
-        id: ObjectID, position?: ObjectData,
-        param?: Readonly<Partial<ICommonParam & IClassicRendererParams["cube"]>>
+        id: ObjectID, position?: ObjectData, radius?: ObjectData,
+        param?: Readonly<IParameterValue<IClassicRendererParameter["cube"]>>
     ): this {
         let object = this.objectPool.get(id);
         let cube: BasicCube;
@@ -250,6 +279,13 @@ class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> {
                     cube.position[1] = position[1] ?? cube.position[1];
                     cube.position[2] = position[2] ?? cube.position[2];
                 }
+
+                if (radius) {
+                    cube.r[0] = radius[0] ?? cube.r[0];
+                    cube.r[1] = radius[1] ?? cube.r[1];
+                    cube.r[2] = radius[2] ?? cube.r[2];
+                }
+
             } else {
                 throw new Error("Renderer: Use duplicate ObjectID when drawing different types of objects");
             }
@@ -263,6 +299,12 @@ class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> {
                 cube.position[2] = position[2] ?? cube.position[2];
             }
 
+            if (radius) {
+                cube.r[0] = radius[0] ?? cube.r[0];
+                cube.r[1] = radius[1] ?? cube.r[1];
+                cube.r[2] = radius[2] ?? cube.r[2];
+            }
+
             this.objectPool.set(id, cube);
             console.log(`Renderer: Create new cube object with id ${id}`);
         }
@@ -271,21 +313,11 @@ class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> {
         cube.isDraw = true;
 
         // 参数传递
-        if (param) {
+        if (param && param.color) {
 
-            // 颜色数据
-            if (param.color) {
-                cube.color[0] = param.color[0] ?? cube.color[0]
-                cube.color[1] = param.color[1] ?? cube.color[1]
-                cube.color[2] = param.color[2] ?? cube.color[2]
-            }
-
-            // 半径数据
-            if (param.radius) {
-                cube.r[0] = param.radius[0] ?? cube.r[0];
-                cube.r[1] = param.radius[1] ?? cube.r[1];
-                cube.r[2] = param.radius[2] ?? cube.r[2];
-            }
+            cube.color[0] = param.color[0] ?? cube.color[0];
+            cube.color[1] = param.color[1] ?? cube.color[1];
+            cube.color[2] = param.color[2] ?? cube.color[2];
         }
 
         return this;

source/GLRender/GroupShader.ts

@@ -10,6 +10,7 @@ interface IGroupShaderAttribute {
 
 interface IGroupShaderUniform {
     uRadius: number,
+    uShape: number,
     uMvp: ObjectData,
     uColor: ObjectData,
     uFogColor: ObjectData,
@@ -50,10 +51,42 @@ class GroupShader extends GLShader<IGroupShaderAttribute, IGroupShaderUniform>{
             
             uniform vec3 uColor;
             uniform vec3 uFogColor;
+            uniform int uShape;
 
             varying float vFogPower;
         
             void main(){
+
+                float dist = distance(gl_PointCoord, vec2(0.5, 0.5));
+                vec2 normalPos = (gl_PointCoord - vec2(0.5, 0.5)) * 2.;
+                
+                if ( uShape == 1 && abs(normalPos.x) < .6 && abs(normalPos.y) < .6) {
+                    discard;
+                }
+
+                if ( uShape == 2 && abs(normalPos.x) > .3 && abs(normalPos.y) > .3) {
+                    discard;
+                }
+
+                if ( uShape == 3 && abs(normalPos.y) > .3) {
+                    discard;
+                }
+
+                if ( uShape == 4 &&
+                    (abs(normalPos.x) < .4 || abs(normalPos.y) < .4) &&
+                    (abs(normalPos.x) > .4 || abs(normalPos.y) > .4)
+                ) {
+                    discard;
+                }
+
+                if ( uShape == 5 &&
+                    (abs(normalPos.x) < .75 && abs(normalPos.y) < .75) &&
+                    (abs(normalPos.x) < .28 || abs(normalPos.y) < .28) &&
+                    (abs(normalPos.x) > .28 || abs(normalPos.y) > .28)
+                ) {
+                    discard;
+                }
+
                 gl_FragColor = vec4(mix(uColor, uFogColor, vFogPower), 1.);
             }
         `;
@@ -111,4 +144,13 @@ class GroupShader extends GLShader<IGroupShaderAttribute, IGroupShaderUniform>{
             this.uniformLocate("uFogDensity"), rgb
         )
     }
+
+    /**
+     * 形状
+     */
+    public shape(shape: number) {
+        this.gl.uniform1i(
+            this.uniformLocate("uShape"), shape
+        )
+    }
 }

source/Input/AttrInput/AttrInput.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 
 $line-min-height: 24px;
 

source/Input/AttrInput/AttrInput.tsx

@@ -1,8 +1,8 @@
 import { Component, ReactNode } from "react";
 import { Icon } from "@fluentui/react";
-import { Localization, AllI18nKeys } from "@Component/Localization/Localization";
-import { ObjectID } from "@Model/Renderer";
-import { TextField, ITextFieldProps } from "../TextField/TextField";
+import { AllI18nKeys } from "@Component/Localization/Localization";
+import { ObjectID } from "@Model/Model";
+import { TextField, ITextFieldProps } from "@Input/TextField/TextField";
 import "./AttrInput.scss";
 
 interface IAttrInputProps extends ITextFieldProps {

source/Input/BehaviorPicker/BehaviorPicker.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 
 div.behavior-picker-list {
     width: 100%;

source/Input/BehaviorPicker/BehaviorPicker.tsx

@@ -1,11 +1,11 @@
-import { DetailsList } from "@Component/DetailsList/DetailsList";
 import { Component, ReactNode, createRef } from "react";
-import { Behavior } from "@Model/Behavior";
 import { Icon } from "@fluentui/react";
+import { Behavior } from "@Model/Behavior";
 import { useSettingWithEvent, IMixinSettingProps } from "@Context/Setting";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
+import { DetailsList } from "@Component/DetailsList/DetailsList";
 import { Localization } from "@Component/Localization/Localization";
-import { PickerList } from "@Component/PickerList/PickerList";
+import { PickerList } from "@Input/PickerList/PickerList";
 import "./BehaviorPicker.scss";
 
 interface IBehaviorPickerProps {
@@ -145,10 +145,10 @@ class BehaviorPicker extends Component<IBehaviorPickerProps & IMixinSettingProps
 
     private renderPickerList(): ReactNode {
         return <PickerList
-            objectList={this.getAllData()}
+            item={this.getAllData()}
             noData="Behavior.Picker.Add.Nodata"
             target={this.clickLineRef}
-            clickObjectItems={((item) => {
+            click={((item) => {
                 if (item instanceof Behavior && this.props.add) {
                     this.props.add(item);
                 }

source/Input/ColorInput/ColorInput.tsx

@@ -1,6 +1,6 @@
 import { Component, createRef, ReactNode } from "react";
-import { TextField, ITextFieldProps } from "@Component/TextField/TextField";
 import { Callout, ColorPicker, DirectionalHint } from "@fluentui/react";
+import { TextField, ITextFieldProps } from "@Input/TextField/TextField";
 import "./ColorInput.scss";
 
 interface IColorInputProps extends ITextFieldProps {

source/Input/ComboInput/ComboInput.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 
 $line-min-height: 24px;
 

source/Input/ComboInput/ComboInput.tsx

@@ -1,7 +1,7 @@
 import { Component, createRef, ReactNode } from "react";
-import { PickerList, IDisplayItem } from "../PickerList/PickerList";
-import { TextField, ITextFieldProps } from "../TextField/TextField";
 import { Icon } from "@fluentui/react";
+import { ComboList, IDisplayItem } from "@Input/ComboList/ComboList";
+import { TextField, ITextFieldProps } from "@Input/TextField/TextField";
 import { Localization } from "@Component/Localization/Localization";
 import "./ComboInput.scss";
 interface IComboInputProps extends ITextFieldProps {
@@ -26,13 +26,11 @@ class ComboInput extends Component<IComboInputProps, IComboInputState> {
     private pickerTarget = createRef<HTMLDivElement>();
 
     private renderPicker() {
-        return <PickerList
+        return <ComboList
             target={this.pickerTarget}
-            displayItems={(this.props.allOption ?? []).map((item) => {
-                return item.key === this.props.value?.key ? 
-                    {...item, mark: true} : item;
-            })}
-            clickDisplayItems={((item) => {
+            item={this.props.allOption ?? []}
+            focus={this.props.value}
+            click={((item) => {
                 if (this.props.valueChange) {
                     this.props.valueChange(item);
                 }
@@ -64,8 +62,8 @@ class ComboInput extends Component<IComboInputProps, IComboInputState> {
                 <div className="value-view">
                     {
                         this.props.value ? 
-                        <Localization i18nKey={this.props.value.nameKey}/> :
-                        null
+                            <Localization i18nKey={this.props.value.i18n} options={this.props.value.i18nOption}/> :
+                            <Localization i18nKey="Input.Error.Combo"/>
                     }
                 </div>
                 <div className="list-button">

source/Input/ComboList/ComboList.scss

@@ -0,0 +1 @@
+@import "../PickerList/PickerList.scss";

source/Input/ComboList/ComboList.tsx

@@ -0,0 +1,71 @@
+import { AllI18nKeys, Localization } from "@Component/Localization/Localization";
+import { Callout, DirectionalHint, Icon } from "@fluentui/react";
+import { Component, ReactNode, RefObject } from "react";
+import "./ComboList.scss";
+
+interface IDisplayItem {
+	i18nOption?: Record<string, string>;
+    i18n: AllI18nKeys;
+    key: string;
+}
+
+interface IComboListProps {
+	target?: RefObject<any>;
+    item: IDisplayItem[];
+	focus?: IDisplayItem;
+    noData?: AllI18nKeys;
+	dismiss?: () => any;
+	click?: (item: IDisplayItem) => any;
+}
+
+class ComboList extends Component<IComboListProps> {
+
+    private renderString(item: IDisplayItem) {
+
+		const isFocus = item.key === this.props.focus?.key;
+
+        return <div
+			className="picker-list-item"
+			key={item.key}
+			onClick={() => {
+				if (this.props.click) {
+					this.props.click(item)
+				}
+			}}
+		>
+			<div className="list-item-icon">
+				<Icon
+					iconName="CheckMark"
+					style={{
+						display: isFocus ? "block" : "none"
+					}}
+				/>
+			</div>
+			<div className="list-item-name">
+				<Localization i18nKey={item.i18n} options={item.i18nOption}/>
+			</div>
+		</div>;
+    }
+
+	public render(): ReactNode {
+		return <Callout
+			onDismiss={this.props.dismiss}
+			target={this.props.target}
+			directionalHint={DirectionalHint.topCenter}
+		>
+			<div className="picker-list-root">
+                { this.props.item.map((item) => this.renderString(item)) }
+				{
+                    this.props.item.length <= 0 ?
+                        <Localization
+                            className="picker-list-nodata"
+                            i18nKey={this.props.noData ?? "Common.No.Data"}
+                        />
+                        : null
+				}
+			</div>
+		</Callout>
+	}
+}
+
+export { ComboList, IDisplayItem }

source/Input/LabelPicker/LabelPicker.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 
 $line-min-height: 26px;
 

source/Input/LabelPicker/LabelPicker.tsx

@@ -1,9 +1,9 @@
-import { PickerList } from "../PickerList/PickerList";
-import { Label } from "@Model/Label";
-import { TextField, ITextFieldProps } from "../TextField/TextField";
-import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
 import { Component, ReactNode, createRef } from "react";
-import { LabelList } from "../LabelList/LabelList";
+import { Label } from "@Model/Label";
+import { PickerList } from "@Input/PickerList/PickerList";
+import { TextField, ITextFieldProps } from "@Input/TextField/TextField";
+import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
+import { LabelList } from "@Component/LabelList/LabelList";
 import "./LabelPicker.scss"
 
 interface ILabelPickerProps extends ITextFieldProps {
@@ -48,13 +48,13 @@ class LabelPicker extends Component<ILabelPickerProps & IMixinStatusProps, ILabe
     private renderPicker() {
         return <PickerList
             noData="Common.Attr.Key.Label.Picker.Nodata"
-            objectList={this.getOtherLabel()}
+            item={this.getOtherLabel()}
             dismiss={() => {
                 this.setState({
                     isPickerVisible: false
                 });
             }}
-            clickObjectItems={(label) => {
+            click={(label) => {
                 if (label instanceof Label && this.props.labelAdd) {
                     this.props.labelAdd(label)
                 }

source/Input/Message/Message.tsx

@@ -1,6 +1,6 @@
+import { FunctionComponent } from "react";
 import { AllI18nKeys, I18N } from "@Component/Localization/Localization";
 import { useSettingWithEvent, IMixinSettingProps, Themes, Language } from "@Context/Setting";
-import { FunctionComponent } from "react";
 import "./Message.scss";
 
 interface IMessageProps {

source/Input/ObjectPicker/ObjectPicker.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 @import "../PickerList/RainbowBg.scss";
 
 $line-min-height: 24px;

source/Input/ObjectPicker/ObjectPicker.tsx

@@ -1,14 +1,14 @@
 import { Component, createRef, ReactNode } from "react";
+import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
 import { Label } from "@Model/Label";
 import { Group } from "@Model/Group";
 import { Range } from "@Model/Range";
-import { TextField, ITextFieldProps } from "../TextField/TextField";
-import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
-import { PickerList, IDisplayItem, getObjectDisplayInfo, IDisplayInfo } from "../PickerList/PickerList";
-import { Localization } from "@Component/Localization/Localization";
-import { Icon } from "@fluentui/react";
 import { CtrlObject } from "@Model/CtrlObject";
 import { Behavior } from "@Model/Behavior";
+import { TextField, ITextFieldProps } from "@Input/TextField/TextField";
+import { PickerList, getObjectDisplayInfo, IDisplayInfo } from "@Input/PickerList/PickerList";
+import { Localization } from "@Component/Localization/Localization";
+import { Icon } from "@fluentui/react";
 import "./ObjectPicker.scss";
 
 type IObjectType = Label | Group | Range | CtrlObject;
@@ -59,6 +59,10 @@ class ObjectPicker extends Component<IObjectPickerProps & IMixinStatusProps, IOb
                     option.push(this.props.status.model.objectPool[j]);
                 }
             }
+
+            if (this.props.type.includes("C")) {
+                option.push(this.props.status.model.currentGroupLabel);
+            }
         }
         
         return option;
@@ -79,8 +83,8 @@ class ObjectPicker extends Component<IObjectPickerProps & IMixinStatusProps, IOb
         return <PickerList
             noData="Object.Picker.List.No.Data"
             target={this.pickerTarget}
-            objectList={this.getAllOption()}
-            clickObjectItems={((item) => {
+            item={this.getAllOption()}
+            click={((item) => {
                 if (item instanceof Behavior) return;
                 if (this.props.valueChange) {
                     this.props.valueChange(item);
@@ -166,4 +170,4 @@ class ObjectPicker extends Component<IObjectPickerProps & IMixinStatusProps, IOb
     }
 }
 
-export { ObjectPicker, IDisplayItem };
+export { ObjectPicker };

source/Input/Parameter/Parameter.tsx

@@ -0,0 +1,287 @@
+import { Component, Fragment, ReactNode } from "react";
+import { useSettingWithEvent, IMixinSettingProps, Language } from "@Context/Setting";
+import { AttrInput } from "@Input/AttrInput/AttrInput";
+import { ObjectID } from "@Model/Model";
+import { TogglesInput } from "@Input/TogglesInput/TogglesInput";
+import { ObjectPicker } from "@Input/ObjectPicker/ObjectPicker";
+import { AllI18nKeys, I18N } from "@Component/Localization/Localization";
+import { Message } from "@Input/Message/Message";
+import { ColorInput } from "@Input/ColorInput/ColorInput";
+import { ComboInput, IDisplayItem } from "@Input/ComboInput/ComboInput";
+import {
+    IParameter, IParameterOption, IParameterOptionItem,
+    IParameterValue, IParamValue, isObjectType
+} from "@Model/Parameter";
+import "./Parameter.scss";
+
+interface IParameterProps<P extends IParameter = {}> {
+    option: IParameterOption<P>;
+    value: IParameterValue<P>;
+    key: ObjectID;
+    change: <K extends keyof P>(key: K, val: IParamValue<P[K]>) => any;
+    i18n?: (key: string, language: Language) => string;
+    renderKey?: Array<keyof P>;
+    title?: AllI18nKeys;
+    titleOption?: Record<string, string>;
+    isFirst?: boolean;
+}
+
+@useSettingWithEvent("language")
+class Parameter<P extends IParameter> extends Component<IParameterProps<P> & IMixinSettingProps> {
+
+    private renderParameter<K extends keyof P>
+    (key: K, option: IParameterOptionItem<P[K]>, value: IParamValue<P[K]>): ReactNode {
+
+        const indexKey = `${this.props.key}-${key}`;
+
+        // 条件检测
+        if (option.condition && this.props.value[option.condition.key] !==  option.condition.value) {
+            return <Fragment key={indexKey}/>;
+        }
+
+        const type = option.type;
+        const language = this.props.setting?.language ?? "EN_US";        
+        let keyI18n: string, keyI18nOption: Record<string, string> | undefined;
+
+        // Custom I18N
+        if (this.props.i18n) {
+            keyI18n = "Panel.Info.Behavior.Details.Parameter.Key";
+            keyI18nOption = {
+                key: this.props.i18n(option.name, language)
+            };
+        }
+        
+        else {
+            keyI18n = option.name;
+        }
+
+        if (type === "number") {
+            return <AttrInput
+                key={indexKey}
+                id={indexKey}
+                keyI18n={keyI18n}
+                keyI18nOption={keyI18nOption}
+                isNumber={true}
+                step={option.numberStep}
+                maxLength={option.maxLength}
+                max={option.numberMax}
+                min={option.numberMin}
+                value={value as IParamValue<"number"> ?? 0}
+                valueChange={(val) => {
+                    this.props.change(key, parseFloat(val) as IParamValue<P[K]>);
+                }}
+            />;
+        }
+
+        else if (type === "string") {
+            return <AttrInput
+                key={indexKey}
+                id={indexKey}
+                keyI18n={keyI18n}
+                keyI18nOption={keyI18nOption}
+                maxLength={option.maxLength}
+                value={value as IParamValue<"string"> ?? ""}
+                valueChange={(val) => {
+                    this.props.change(key, val as IParamValue<P[K]>);
+                }}
+            />;
+        }
+
+        else if (type === "boolean") {
+            return <TogglesInput
+                key={indexKey}
+                keyI18n={keyI18n}
+                keyI18nOption={keyI18nOption}
+				onIconName={option.iconName}
+                red={option.iconRed}
+                value={value as IParamValue<"boolean"> ?? false}
+				valueChange={(val) => {
+					this.props.change(key, val as IParamValue<P[K]>);
+				}}
+			/>
+        }
+
+        else if (isObjectType(type)) {
+
+            type IObjectParamValue = IParamValue<"G" | "R" | "LG" | "LR">;
+            const typedValue = value as IObjectParamValue;
+
+            return <ObjectPicker
+                key={indexKey}
+                keyI18n={keyI18n}
+                keyI18nOption={keyI18nOption}
+                type={type}
+                value={typedValue.picker}
+                valueChange={(obj) => {
+                    typedValue.picker = obj as IObjectParamValue["picker"];
+                    this.props.change(key, typedValue as IParamValue<P[K]>);
+                }}
+                cleanValue={() => {
+                    typedValue.picker = undefined as IObjectParamValue["picker"];
+                    this.props.change(key, typedValue as IParamValue<P[K]>);
+                }}
+            />
+        }
+
+        else if (type === "color") {
+
+            return <ColorInput
+                key={indexKey}
+                keyI18n={keyI18n}
+                keyI18nOption={keyI18nOption}
+                normal={option.colorNormal}
+                value={value as IParamValue<"color"> ?? false}
+                valueChange={(val) => {
+					this.props.change(key, val as IParamValue<P[K]>);
+				}}
+            />
+        }
+
+        else if (type === "option") {
+
+            let allOption: IDisplayItem[] = [];
+            let focusKey: number = -1;
+
+            if (option.allOption) {
+                for (let i = 0; i < option.allOption.length; i++) {
+
+                    if (this.props.i18n) {
+                        allOption.push({
+                            i18nOption: { key: this.props.i18n(option.allOption[i].name, language) },
+                            i18n: "Panel.Info.Behavior.Details.Parameter.Key",
+                            key: option.allOption[i].key
+                        })
+                    }
+                    
+                    else {
+                        allOption.push({
+                            i18n: option.allOption[i].name,
+                            key: option.allOption[i].key
+                        })
+                    }
+
+                    if (option.allOption[i].key === value) {
+                        focusKey = i;
+                    }
+                }
+            }
+
+            return <ComboInput
+                key={indexKey}
+                keyI18n={keyI18n}
+                keyI18nOption={keyI18nOption}
+                allOption={allOption}
+                value={allOption[focusKey]}
+                valueChange={(val) => {
+                    this.props.change(key, val.key as IParamValue<P[K]>);
+                }}
+            />
+        }
+
+        else if (type === "vec") {
+
+            type IObjectParamValue = IParamValue<"vec">;
+            const typedValue = value as IObjectParamValue;
+            const i18nVal = I18N(this.props, keyI18n, keyI18nOption);
+            
+            return <Fragment key={indexKey}>
+                
+                <AttrInput
+                    key={`${indexKey}-X`}
+                    id={indexKey}
+                    keyI18n="Panel.Info.Behavior.Details.Parameter.Key.Vec.X"
+                    keyI18nOption={{ key: i18nVal }}
+                    isNumber={true}
+                    step={option.numberStep}
+                    maxLength={option.maxLength}
+                    max={option.numberMax}
+                    min={option.numberMin}
+                    value={typedValue[0] ?? 0}
+                    valueChange={(val) => {
+                        typedValue[0] = parseFloat(val);
+                        this.props.change(key, typedValue as IParamValue<P[K]>);
+                    }}
+                />
+
+                <AttrInput
+                    key={`${indexKey}-Y`}
+                    id={indexKey}
+                    keyI18n="Panel.Info.Behavior.Details.Parameter.Key.Vec.Y"
+                    keyI18nOption={{ key: i18nVal }}
+                    isNumber={true}
+                    step={option.numberStep}
+                    maxLength={option.maxLength}
+                    max={option.numberMax}
+                    min={option.numberMin}
+                    value={typedValue[1] ?? 0}
+                    valueChange={(val) => {
+                        typedValue[1] = parseFloat(val);
+                        this.props.change(key, typedValue as IParamValue<P[K]>);
+                    }}
+                />
+
+                <AttrInput
+                    key={`${indexKey}-Z`}
+                    id={indexKey}
+                    keyI18n="Panel.Info.Behavior.Details.Parameter.Key.Vec.Z"
+                    keyI18nOption={{ key: i18nVal }}
+                    isNumber={true}
+                    step={option.numberStep}
+                    maxLength={option.maxLength}
+                    max={option.numberMax}
+                    min={option.numberMin}
+                    value={typedValue[2] ?? 0}
+                    valueChange={(val) => {
+                        typedValue[2] = parseFloat(val);
+                        this.props.change(key, typedValue as IParamValue<P[K]>);
+                    }}
+                />
+
+            </Fragment>
+        }
+
+        else {
+            return <Fragment key={indexKey}/>
+        }
+    }
+
+    private renderAllParameter(key: Array<keyof P>) {
+        return key.map((key) => {
+            return this.renderParameter(
+                key,
+                this.props.option[key],
+                this.props.value[key],
+            );
+        });
+    }
+    
+    public render(): ReactNode {
+        
+        let allOptionKeys: Array<keyof P>;
+        if (this.props.renderKey) {
+            allOptionKeys = this.props.renderKey;
+        } else {
+            allOptionKeys = Object.getOwnPropertyNames(this.props.option);
+        }
+
+        return <>
+        
+            {
+                allOptionKeys.length > 0 && this.props.title ?
+                    <Message
+                        isTitle
+                        first={this.props.isFirst}
+                        i18nKey={this.props.title}
+                        options={this.props.titleOption}
+                    /> : null
+            }
+
+            {
+                this.renderAllParameter(allOptionKeys)
+            }
+        
+        </>
+    }
+}
+
+export { Parameter }

source/Input/PickerList/PickerList.tsx

@@ -17,12 +17,6 @@ interface IDisplayInfo {
     allLabel: boolean;
 };
 
-interface IDisplayItem {
-    nameKey: AllI18nKeys;
-    key: string;
-	mark?: boolean;
-}
-
 function getObjectDisplayInfo(item?: IPickerListItem): IDisplayInfo {
 
     if (!item) {
@@ -57,16 +51,25 @@ function getObjectDisplayInfo(item?: IPickerListItem): IDisplayInfo {
 	if (item instanceof Label) {
 
 		if (item.isBuildIn) {
+
             internal = true;
             allLabel = true;
             color = "transparent";
+
             if (item.id === "AllRange") {
                 icon = "ProductList";
                 name = "Build.In.Label.Name.All.Range";
-            } else if (item.id === "AllGroup") {
+            }
+			
+			else if (item.id === "AllGroup") {
                 icon = "SizeLegacy";
                 name = "Build.In.Label.Name.All.Group";
             }
+
+			else if (item.id === "CurrentGroupLabel") {
+				icon = "TriangleShape";
+                name = "Build.In.Label.Name.Current.Group";
+			}
         } 
         
         else {
@@ -98,13 +101,11 @@ function getObjectDisplayInfo(item?: IPickerListItem): IDisplayInfo {
 }
 
 interface IPickerListProps {
-    displayItems?: IDisplayItem[];
-	objectList?: IPickerListItem[];
+	item: IPickerListItem[];
 	target?: RefObject<any>;
     noData?: AllI18nKeys;
 	dismiss?: () => any;
-	clickObjectItems?: (item: IPickerListItem) => any;
-    clickDisplayItems?: (item: IDisplayItem) => any;
+	click?: (item: IPickerListItem) => any;
 }
 
 class PickerList extends Component<IPickerListProps> {
@@ -116,8 +117,8 @@ class PickerList extends Component<IPickerListProps> {
 			className="picker-list-item"
 			key={item.id}
 			onClick={() => {
-				if (this.props.clickObjectItems) {
-					this.props.clickObjectItems(item)
+				if (this.props.click) {
+					this.props.click(item)
 				}
 			}}
 		>
@@ -143,27 +144,6 @@ class PickerList extends Component<IPickerListProps> {
 		</div>;
 	}
 
-    private renderString(item: IDisplayItem) {
-        return <div
-			className="picker-list-item"
-			key={item.key}
-			onClick={() => {
-				if (this.props.clickDisplayItems) {
-					this.props.clickDisplayItems(item)
-				}
-			}}
-		>
-			<div className="list-item-icon">
-				<Icon iconName="CheckMark" style={{
-					display: item.mark ? "block" : "none"
-				}}/>
-			</div>
-			<div className="list-item-name">
-				<Localization i18nKey={item.nameKey}/>
-			</div>
-		</div>;
-    }
-
 	public render(): ReactNode {
 		return <Callout
 			onDismiss={this.props.dismiss}
@@ -171,18 +151,11 @@ class PickerList extends Component<IPickerListProps> {
 			directionalHint={DirectionalHint.topCenter}
 		>
 			<div className="picker-list-root">
-				{this.props.objectList ? this.props.objectList.map((item) => {
-					return this.renderItem(item);
-				}) : null}
-                {this.props.displayItems ? this.props.displayItems.map((item) => {
-					return this.renderString(item);
-				}) : null}
 				{
-                    !(this.props.objectList || this.props.displayItems) || 
-                    !(
-                        this.props.objectList && this.props.objectList.length > 0 || 
-                        this.props.displayItems && this.props.displayItems.length > 0
-                    ) ?
+					this.props.item.map((item) => this.renderItem(item))
+				}
+				{
+                    this.props.item.length <= 0 ?
                         <Localization
                             className="picker-list-nodata"
                             i18nKey={this.props.noData ?? "Common.No.Data"}
@@ -194,4 +167,4 @@ class PickerList extends Component<IPickerListProps> {
 	}
 }
 
-export { PickerList, IDisplayItem, IDisplayInfo, getObjectDisplayInfo }
+export { PickerList, IDisplayInfo, getObjectDisplayInfo }

source/Input/SearchBox/SearchBox.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 
 $search-box-height: 26px;
 

source/Input/SearchBox/SearchBox.tsx

@@ -1,8 +1,8 @@
+import { Component, ReactNode } from "react";
+import { Icon } from "@fluentui/react";
 import { AllI18nKeys, I18N } from "@Component/Localization/Localization";
 import { BackgroundLevel, FontLevel, Theme } from "@Component/Theme/Theme";
 import { useSettingWithEvent, IMixinSettingProps } from "@Context/Setting";
-import { Icon } from "@fluentui/react";
-import { Component, ReactNode } from "react";
 import "./SearchBox.scss";
 
 interface ISearchBoxProps {

source/Input/TextField/TextField.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 
 $line-min-height: 26px;
 

source/Input/TogglesInput/TogglesInput.scss

@@ -1,4 +1,4 @@
-@import "../Theme/Theme.scss";
+@import "../../Component/Theme/Theme.scss";
 
 $line-min-height: 26px;
 

source/Input/TogglesInput/TogglesInput.tsx

@@ -1,6 +1,6 @@
-import { Icon } from "@fluentui/react";
 import { Component, ReactNode } from "react";
-import { TextField, ITextFieldProps } from "../TextField/TextField";
+import { Icon } from "@fluentui/react";
+import { TextField, ITextFieldProps } from "@Input/TextField/TextField";
 import "./TogglesInput.scss";
 
 interface ITogglesInputProps extends ITextFieldProps {

source/Localization/EN-US.ts

@@ -25,6 +25,7 @@ const EN_US = {
     "Input.Error.Length": "The length of the input content must be less than {num}",
     "Input.Error.Length.Less": "The length of the input content must be greater than {num}",
     "Input.Error.Select": "Select object ...",
+    "Input.Error.Combo": "Select options ...",
     "Object.List.New.Group": "Group object {id}",
     "Object.List.New.Range": "Range object {id}",
     "Object.List.New.Label": "Label {id}",
@@ -56,8 +57,11 @@ const EN_US = {
     "Popup.Action.No": "Cancel",
     "Popup.Action.Objects.Confirm.Title": "Confirm Delete",
     "Popup.Action.Objects.Confirm.Delete": "Delete",
+    "Popup.Action.Objects.Confirm.Restore.Title": "Confirm Restore",
+    "Popup.Action.Objects.Confirm.Restore": "Restore",
     "Popup.Delete.Objects.Confirm": "Are you sure you want to delete this object(s)? The object is deleted and cannot be recalled.",
     "Popup.Delete.Behavior.Confirm": "Are you sure you want to delete this behavior? The behavior is deleted and cannot be recalled.",
+    "Popup.Restore.Behavior.Confirm": "Are you sure you want to reset all parameters of this behavior? This operation cannot be recalled.",
     "Popup.Setting.Title": "Preferences setting",
     "Popup.Add.Behavior.Title": "Add behavior",
     "Popup.Add.Behavior.Action.Add": "Add all select behavior",
@@ -67,6 +71,7 @@ const EN_US = {
     "Popup.Behavior.Info.Confirm": "OK, I know it",
     "Build.In.Label.Name.All.Group": "All group",
     "Build.In.Label.Name.All.Range": "All range",
+    "Build.In.Label.Name.Current.Group": "Current group",
     "Common.Search.Placeholder": "Search in here...",
     "Common.No.Data": "No Data",
     "Common.No.Unknown.Error": "Unknown error",
@@ -75,6 +80,7 @@ const EN_US = {
     "Common.Attr.Title.Individual.Generation": "Individual generation",
     "Common.Attr.Title.Behaviors": "Behaviors list",
     "Common.Attr.Title.Individual.kill": "Individual kill",
+    "Common.Attr.Title.Render.Parameter": "Render parameters",
     "Common.Attr.Key.Display.Name": "Display name",
     "Common.Attr.Key.Position.X": "Position X",
     "Common.Attr.Key.Position.Y": "Position Y",
@@ -105,6 +111,14 @@ const EN_US = {
     "Common.Attr.Key.Generation.Error.Invalid.Label": "The specified label has expired",
     "Common.Attr.Key.Kill.Random": "Random kill",
     "Common.Attr.Key.Kill.Count": "Kill count",
+    "Common.Attr.Key.Behavior.Restore": "Restore default parameters",
+    "Common.Render.Attr.Key.Display.Shape": "Display Shape",
+    "Common.Render.Attr.Key.Display.Shape.Square": "Square",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Square": "Hollow square",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Plus": "Plus",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Reduce": "Reduce",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Cross": "Cross",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Checkerboard": "Checkerboard",
     "Panel.Info.Range.Details.Attr.Error.Not.Range": "Object is not a Range",
     "Panel.Info.Range.Details.Attr.Error.Unspecified": "Unspecified range object",
     "Panel.Info.Group.Details.Attr.Error.Not.Group": "Object is not a Group",

source/Localization/ZH-CN.ts

@@ -25,7 +25,8 @@ const ZH_CN = {
     "Input.Error.Length": "输入内容长度须小于 {number}",
     "Input.Error.Length.Less": "输入内容长度须大于 {number}",
     "Input.Error.Select": "选择对象 ...",
-    "Object.List.New.Group": "组对象 {id}",
+    "Input.Error.Combo": "选择选项 ...",
+    "Object.List.New.Group": "群对象 {id}",
     "Object.List.New.Range": "范围对象 {id}",
     "Object.List.New.Label": "标签 {id}",
     "Object.List.No.Data": "模型中没有任何对象，点击按钮以创建",
@@ -56,17 +57,21 @@ const ZH_CN = {
     "Popup.Action.No": "取消",
     "Popup.Action.Objects.Confirm.Title": "删除确认",
     "Popup.Action.Objects.Confirm.Delete": "删除",
+    "Popup.Action.Objects.Confirm.Restore.Title": "重置确认",
+    "Popup.Action.Objects.Confirm.Restore": "重置",
     "Popup.Delete.Objects.Confirm": "你确定要删除这个(些)对象吗？对象被删除将无法撤回。",
     "Popup.Delete.Behavior.Confirm": "你确定要删除这个行为吗？行为被删除将无法撤回。",
+    "Popup.Restore.Behavior.Confirm": "你确定要重置此行为的全部参数吗？此操作无法撤回。",
     "Popup.Setting.Title": "首选项设置",
     "Popup.Add.Behavior.Title": "添加行为",
     "Popup.Add.Behavior.Action.Add": "添加全部选中行为",
-    "Popup.Add.Behavior.Select.Counter": "找不到名为 \"{name}\" 的行为",
-    "Popup.Add.Behavior.Select.Nodata": "Could not find behavior named \"{name}\"",
+    "Popup.Add.Behavior.Select.Counter": "已选择 {count} 个行为",
+    "Popup.Add.Behavior.Select.Nodata": "找不到名为 \"{name}\" 的行为",
     "Popup.Behavior.Info.Title": "行为详情: {behavior}",
     "Popup.Behavior.Info.Confirm": "好的, 我知道了",
     "Build.In.Label.Name.All.Group": "全部群",
     "Build.In.Label.Name.All.Range": "全部范围",
+    "Build.In.Label.Name.Current.Group": "当前群",
     "Common.Search.Placeholder": "在此处搜索...",
     "Common.No.Data": "暂无数据",
     "Common.No.Unknown.Error": "未知错误",
@@ -75,6 +80,7 @@ const ZH_CN = {
     "Common.Attr.Title.Individual.Generation": "生成个体",
     "Common.Attr.Title.Behaviors": "行为列表",
     "Common.Attr.Title.Individual.kill": "消除个体",
+    "Common.Attr.Title.Render.Parameter": "渲染参数",
     "Common.Attr.Key.Display.Name": "显示名称",
     "Common.Attr.Key.Position.X": "X 坐标",
     "Common.Attr.Key.Position.Y": "Y 坐标",
@@ -105,6 +111,14 @@ const ZH_CN = {
     "Common.Attr.Key.Generation.Error.Invalid.Label": "指定的标签已失效",
     "Common.Attr.Key.Kill.Random": "随机消除",
     "Common.Attr.Key.Kill.Count": "消除数量",
+    "Common.Attr.Key.Behavior.Restore": "还原默认参数",
+    "Common.Render.Attr.Key.Display.Shape": "显示形状",
+    "Common.Render.Attr.Key.Display.Shape.Square": "方形",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Square": "空心方形",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Plus": "加号",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Reduce": "减号",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Cross": "叉号",
+    "Common.Render.Attr.Key.Display.Shape.Hollow.Checkerboard": "棋盘",
     "Panel.Info.Range.Details.Attr.Error.Not.Range": "对象不是一个范围",
     "Panel.Info.Range.Details.Attr.Error.Unspecified": "未指定范围对象",
     "Panel.Info.Group.Details.Attr.Error.Not.Group": "对象不是一个群",

source/Model/Actuator.ts

@@ -1,5 +1,5 @@
-import { Model } from "./Model";
-import { Emitter } from "./Emitter"; 
+import { Model } from "@Model/Model";
+import { Emitter } from "@Model/Emitter";
 
 interface IActuatorEvent {
 	startChange: boolean;

source/Model/Archive.ts

@@ -1,4 +1,4 @@
-import { Emitter, EventType, EventMixin } from "./Emitter";
+import { Emitter, EventType } from "@Model/Emitter";
 
 interface IArchiveEvent {
     save: Archive;

source/Model/Behavior.ts

@@ -1,136 +1,16 @@
-import { IAnyObject } from "./Renderer";
-import { Emitter, EventType } from "./Emitter";
-import type { Individual } from "./Individual";
-import type { Group } from "./Group";
-import type { Model } from "./Model";
-import type { Range } from "./Range";
-import type { Label } from "./Label";
-
-type IObjectParamCacheType<P, Q = P> = {
-    picker: P;
-    objects: Q;
-}
-
-/**
- * 参数类型
- */
-type IMapBasicParamTypeKeyToType = {
-    "number": number;
-    "string": string;
-    "boolean": boolean;
-}
-
-type IMapObjectParamTypeKeyToType = {
-    "R": IObjectParamCacheType<Range | undefined>;
-    "G": IObjectParamCacheType<Group | undefined>;
-    "LR": IObjectParamCacheType<Label | Range | undefined, Range[]>;
-    "LG": IObjectParamCacheType<Label | Group | undefined, Group[]>;
-}
-
-type IMapVectorParamTypeKeyToType = {
-    "vec": number[];
-}
-
-/**
- * 参数类型映射
- */
-type AllMapType = IMapBasicParamTypeKeyToType & IMapObjectParamTypeKeyToType & IMapVectorParamTypeKeyToType;
-type IParamType = keyof AllMapType;
-type IObjectType = keyof IMapObjectParamTypeKeyToType;
-type IVectorType = keyof IMapVectorParamTypeKeyToType;
-type IParamValue<K extends IParamType> = AllMapType[K];
-
-/**
- * 特殊对象类型判定
- */
-const objectTypeListEnumSet = new Set<IParamType>(["R", "G", "LR", "LG"]);
-
-/**
- * 对象断言表达式
- */
-function isObjectType(key: IParamType): key is IVectorType {
-    return objectTypeListEnumSet.has(key);
-}
-
-/**
- * 向量断言表达式
- */
-function isVectorType(key: IParamType): key is IObjectType {
-    return key === "vec";
-}
-
-/**
- * 模型参数类型
- */
-interface IBehaviorParameterOptionItem<T extends IParamType = IParamType> {
-
-    /**
-     * 参数类型
-     */
-    type: T | string;
-
-    /**
-     * 参数默认值
-     */
-    defaultValue?: IParamValue<T>;
-
-    /**
-     * 数值变化回调
-     */
-    onChange?: (value: IParamValue<T>) => any;
-
-    /**
-     * 名字
-     */
-    name: string;
-
-    /**
-     * 字符长度
-     */
-    maxLength?: number;
-
-    /**
-     * 数字步长
-     */
-    numberStep?: number;
-
-    /**
-     * 最大值最小值
-     */
-    numberMax?: number;
-    numberMin?: number;
-
-    /**
-     * 图标名字
-     */
-    iconName?: string;
-}
-
-interface IBehaviorParameter {
-    [x: string]: IParamType;
-}
-
-/**
- * 参数类型列表
- */
-type IBehaviorParameterOption<P extends IBehaviorParameter> = {
-    [X in keyof P]: IBehaviorParameterOptionItem<P[X]>;
-}
-
-/**
- * 参数类型列表映射到参数对象
- */
-type IBehaviorParameterValue<P extends IBehaviorParameter> = {
-    [X in keyof P]: IParamValue<P[X]>
-}
+import { Emitter, EventType } from "@Model/Emitter";
+import type { Individual } from "@Model/Individual";
+import type { Group } from "@Model/Group";
+import type { Model } from "@Model/Model";
+import { getDefaultValue, IParameter, IParameterOption, IParameterValue } from "@Model/Parameter";
 
 /**
  * 行为构造函数类型
  */
 type IBehaviorConstructor<
-    P extends IBehaviorParameter = {},
+    P extends IParameter = {},
     E extends Record<EventType, any> = {}
-> = new (id: string, parameter: IBehaviorParameterValue<P>) => Behavior<P, E>;
+> = new (id: string, parameter: IParameterValue<P>) => Behavior<P, E>;
 
 type IAnyBehavior = Behavior<any, any>;
 type IAnyBehaviorRecorder = BehaviorRecorder<any, any>;
@@ -192,7 +72,7 @@ class BehaviorInfo<E extends Record<EventType, any> = {}> extends Emitter<E> {
 }
 
 class BehaviorRecorder<
-    P extends IBehaviorParameter = {},
+    P extends IParameter = {},
     E extends Record<EventType, any> = {}
 > extends BehaviorInfo<{}> {
 
@@ -221,62 +101,13 @@ class BehaviorRecorder<
     /**
      * 对象参数列表
      */
-    public parameterOption: IBehaviorParameterOption<P>;
-
-    /**
-     * 获取参数列表的默认值
-     */
-    public getDefaultValue(): IBehaviorParameterValue<P> {
-        let defaultObj = {} as IBehaviorParameterValue<P>;
-        for (let key in this.parameterOption) {
-            let defaultVal = this.parameterOption[key].defaultValue;
-            
-            defaultObj[key] = defaultVal as any;
-            if (defaultObj[key] === undefined) {
-
-                switch (this.parameterOption[key].type) {
-                    case "string":
-                        defaultObj[key] = "" as any;
-                        break;
-
-                    case "number":
-                        defaultObj[key] = 0 as any;
-                        break;
-
-                    case "boolean":
-                        defaultObj[key] = false as any;
-                        break;
-
-                    case "vec":
-                        defaultObj[key] = [0, 0, 0] as any;
-                        break;
-                    
-                    case "G":
-                    case "R":
-                        defaultObj[key] = {
-                            picker: undefined,
-                            objects: undefined
-                        } as any;
-                        break;
-
-                    case "LR":
-                    case "LG":
-                        defaultObj[key] = {
-                            picker: undefined,
-                            objects: []
-                        } as any;
-                        break;
-                }
-            }
-        }
-        return defaultObj;
-    }
+    public parameterOption: IParameterOption<P>;
 
     /**
      * 创建一个新的行为实例
      */
     public new(): Behavior<P, E> {
-        return new this.behavior(this.getNextId(), this.getDefaultValue());
+        return new this.behavior(this.getNextId(), getDefaultValue(this.parameterOption));
     }
 
     public constructor(behavior: IBehaviorConstructor<P, E>) {
@@ -297,7 +128,7 @@ class BehaviorRecorder<
  * 群体的某种行为
  */
 class Behavior<
-    P extends IBehaviorParameter = {},
+    P extends IParameter = {},
     E extends Record<EventType, any> = {}
 > extends BehaviorInfo<E> {
 
@@ -325,14 +156,19 @@ class Behavior<
     /**
      * 行为参数
      */
-    public parameter: IBehaviorParameterValue<P>;
+    public parameter: IParameterValue<P>;
+
+    /**
+     * 指定当前群的 Key
+     */
+    public currentGroupKey: Array<keyof P> = [];
 
     /**
      * 对象参数列表
      */
-    public parameterOption: IBehaviorParameterOption<P> = {} as any;
+    public parameterOption: IParameterOption<P> = {} as any;
 
-    public constructor(id: string, parameter: IBehaviorParameterValue<P>) {
+    public constructor(id: string, parameter: IParameterValue<P>) {
         super();
         this.id = id;
         this.parameter = parameter;
@@ -391,7 +227,7 @@ class Behavior<
      * @param model 模型
      * @param t 经过时间
      */
-    public effect(individual: Individual, group: Group, model: Model, t: number): void {};
+    public effect?: (individual: Individual, group: Group, model: Model, t: number) => void;
 
     /**
      * 作用影响于个体
@@ -400,7 +236,7 @@ class Behavior<
      * @param model 模型
      * @param t 经过时间
      */
-    public afterEffect(individual: Individual, group: Group, model: Model, t: number): void {};
+    public afterEffect?: (individual: Individual, group: Group, model: Model, t: number) => void;
 
     /**
      * 全部影响作用后
@@ -409,15 +245,13 @@ class Behavior<
      * @param model 模型
      * @param t 经过时间
      */
-    public finalEffect(individual: Individual, group: Group, model: Model, t: number): void {};
+    public finalEffect?: (individual: Individual, group: Group, model: Model, t: number) => void;
 
 }
 
 type IRenderBehavior = BehaviorInfo | Behavior;
 
 export {
-    Behavior, BehaviorRecorder, IBehaviorParameterOption, IBehaviorParameterOptionItem, IParamValue,
-    IAnyBehavior, IAnyBehaviorRecorder, BehaviorInfo, IRenderBehavior, IBehaviorParameter,
-    isObjectType, isVectorType
+    Behavior, BehaviorRecorder, IAnyBehavior, IAnyBehaviorRecorder, BehaviorInfo, IRenderBehavior
 };
 export default { Behavior };

source/Model/CtrlObject.ts

@@ -1,6 +1,6 @@
-import { LabelObject } from "./Label"
-import type { Model } from "./Model";
-import type { ObjectID } from "./Renderer";
+import { LabelObject } from "@Model/Label"
+import type { IAnyObject, Model } from "@Model/Model";
+import type { ObjectID } from "@Model/Model";
 
 /**
  * 可控对象
@@ -37,6 +37,11 @@ class CtrlObject extends LabelObject {
      */
     protected model: Model;
 
+    /**
+     * 渲染数据
+     */
+    public renderParameter: IAnyObject = {};
+
     /**
      * 构造器
      */
@@ -56,8 +61,8 @@ class CtrlObject extends LabelObject {
     /**
      * 判断是否为相同对象
      */
-    public equal(obj: CtrlObject): boolean {
-        return this === obj || this.id === obj.id;
+    public equal(obj?: CtrlObject): boolean {
+        return this === obj || this.id === obj?.id;
     }
 
     /**

source/Model/Group.ts

@@ -1,8 +1,10 @@
-import { Individual } from "./Individual";
-import { CtrlObject } from "./CtrlObject";
-import type { Behavior } from "./Behavior"; 
-import { Label } from "./Label";
-import { Range } from "./Range";
+import { Individual } from "@Model/Individual";
+import { CtrlObject } from "@Model/CtrlObject";
+import type { Behavior, IAnyBehavior } from "@Model/Behavior"; 
+import { Label } from "@Model/Label";
+import { Range } from "@Model/Range";
+import { Model, ObjectID } from "@Model/Model";
+import { getDefaultValue } from "@Model/Parameter";
 
 enum GenMod {
     Point = "p",
@@ -37,7 +39,7 @@ class Group extends CtrlObject {
     /**
      * 生成个数
      */
-    public genCount: number = 1;
+    public genCount: number = 100;
 
     /**
      * 生成错误信息
@@ -52,7 +54,7 @@ class Group extends CtrlObject {
     /**
      * 删除个数
      */
-    public killCount: number = 1;
+    public killCount: number = 100;
 
     private genInSingleRange(count: number, range: Range) {
         for (let i = 0; i < count; i++) {
@@ -270,9 +272,11 @@ class Group extends CtrlObject {
     public remove(individual: Individual[] | Individual): this {
         if (Array.isArray(individual)) {
             for (let i = 0; i < individual.length; i++) {
+                individual[i].group = undefined;
                 this.individuals.delete(individual[i]);
             }
         } else {
+            individual.group = undefined;
             this.individuals.delete(individual);
         }
         return this;
@@ -306,7 +310,7 @@ class Group extends CtrlObject {
 	/**
 	 * 行为列表
 	 */
-	public behaviors: Behavior[] = [];
+	public behaviors: IAnyBehavior[] = [];
 
 	/**
 	 * 添加行为
@@ -356,15 +360,37 @@ class Group extends CtrlObject {
 	 * @param
      */
 	public runner(t: number, effectType: "finalEffect" | "effect" | "afterEffect" ): void {
-		this.individuals.forEach((individual) => {
-			for(let j = 0; j < this.behaviors.length; j++) {
-                if (this.behaviors[j].isDeleted()) {
-                    continue;
+
+        for(let j = 0; j < this.behaviors.length; j++) {
+
+            const behavior = this.behaviors[j];
+            if (behavior.isDeleted()) {
+                continue;
+            }
+
+            const runnerFunction = behavior[effectType];
+            if (!runnerFunction) {
+                continue;
+            }
+            
+            for (let k = 0; k < behavior.currentGroupKey.length; k++) {
+
+                let parameterCache = behavior.parameter[
+                    behavior.currentGroupKey[k] as string
+                ];
+
+                if (Array.isArray(parameterCache?.objects)) {
+                    parameterCache.objects = [this];
+
                 } else {
-                    this.behaviors[j][effectType](individual, this, this.model, t);
+                    parameterCache.objects = this;
                 }
-			}
-		});
+            }
+
+            this.individuals.forEach((individual) => {
+                runnerFunction(individual, this, this.model, t);
+            });
+        }
 	}
 
     /**
@@ -380,11 +406,15 @@ class Group extends CtrlObject {
         });
         return dataBuffer;
     }
+    
+    public constructor(model: Model, id: ObjectID) {
 
-    /**
-     * 绘制大小 
-     */
-    public size: number = 60;
+        super(model, id);
+        
+        if (model.renderer) {
+            this.renderParameter = getDefaultValue(model.renderer.pointsParameterOption);
+        }
+    }
 }
 
 export default Group;

source/Model/Individual.ts

@@ -1,5 +1,5 @@
-import type { Group } from "./Group";
-import { ObjectID } from "./Renderer";
+import type { Group } from "@Model/Group";
+import { ObjectID } from "@Model/Model";
 
 /**
  * 群中的个体类型
@@ -88,7 +88,7 @@ class Individual {
 	/**
 	 * 所属群组
 	 */
-	public group: Group;
+	public group: Group | undefined;
 
 	/**
 	 * 初始化
@@ -97,11 +97,16 @@ class Individual {
 		this.group = group;
 	}
 
+    public isDie(): boolean {
+        return !!this.group;
+    }
+
     /**
      * 死亡
      */
     public die(): this {
-        this.group.remove(this);
+        this.group?.remove(this);
+        this.group = undefined;
         return this;
     }
 
@@ -110,7 +115,7 @@ class Individual {
      * @param newGroup 新群体
      */
     public transfer(newGroup: Group): this {
-        this.group.remove(this);
+        this.group?.remove(this);
         newGroup.add(this);
         this.group = newGroup;
         return this;

source/Model/Label.ts

@@ -1,5 +1,4 @@
-import type { Model } from "./Model";
-import { ObjectID } from "./Renderer";
+import type { Model, ObjectID } from "@Model/Model";
 
 /**
  * 数据标签

source/Model/Model.ts

@@ -1,11 +1,22 @@
-import { Individual } from "./Individual";
-import { Group } from "./Group";
-import { Range } from "./Range";
-import { Emitter, EventType, EventMixin } from "./Emitter";
-import { CtrlObject } from "./CtrlObject";
-import { ObjectID, AbstractRenderer } from "./Renderer";
-import { Label } from "./Label";
-import { Behavior, IAnyBehavior, IAnyBehaviorRecorder, IParamValue } from "./Behavior";
+import { Label } from "@Model/Label";
+import { Group } from "@Model/Group";
+import { Range } from "@Model/Range";
+import { IParamValue } from "@Model/Parameter";
+import { Individual } from "@Model/Individual";
+import { CtrlObject } from "@Model/CtrlObject";
+import { Emitter, EventType, EventMixin } from "@Model/Emitter";
+import { AbstractRenderer } from "@Model/Renderer";
+import { Behavior, IAnyBehavior, IAnyBehaviorRecorder } from "@Model/Behavior";
+
+/**
+ * 对象标识符
+ */
+type ObjectID = string;
+
+/**
+ * 任意类型对象
+ */
+type IAnyObject = Record<string, any>;
 
 type ModelEvent = {
     labelChange: Label[];
@@ -55,6 +66,11 @@ class Model extends Emitter<ModelEvent> {
      */
     public allGroupLabel = new Label(this, "AllGroup").setBuildInLabel();
 
+    /**
+     * 内置标签-全部群标签
+     */
+    public currentGroupLabel = new Label(this, "CurrentGroupLabel").setBuildInLabel();
+
     /**
      * 添加标签
      */
@@ -212,6 +228,7 @@ class Model extends Emitter<ModelEvent> {
     public updateBehaviorParameter() {
         for (let i = 0; i < this.behaviorPool.length; i++) {
             const behavior = this.behaviorPool[i];
+            behavior.currentGroupKey = [];
             
             for (let key in behavior.parameterOption) {
                 switch (behavior.parameterOption[key].type) {
@@ -225,11 +242,17 @@ class Model extends Emitter<ModelEvent> {
                         }
                         break;
 
+                    case "CG":
                     case "G":
-                        const dataG: IParamValue<"G"> = behavior.parameter[key];
+                        const dataG: IParamValue<"CG"> = behavior.parameter[key];
                         dataG.objects = undefined;
+
+                        if (dataG.picker instanceof Label && dataG.picker.id === this.currentGroupLabel.id) {
+                            behavior.currentGroupKey.push(key);
+                            dataG.objects = undefined;
+                        }
                         
-                        if (dataG.picker instanceof Group && !dataG.picker.isDeleted()) {
+                        else if (dataG.picker instanceof Group && !dataG.picker.isDeleted()) {
                             dataG.objects = dataG.picker;
                         }
                         break;
@@ -249,8 +272,9 @@ class Model extends Emitter<ModelEvent> {
                         }
                         break;
 
+                    case "CLG":
                     case "LG":
-                        const dataLG: IParamValue<"LG"> = behavior.parameter[key];
+                        const dataLG: IParamValue<"CLG"> = behavior.parameter[key];
                         dataLG.objects = [];
 
                         if (dataLG.picker instanceof Group && !dataLG.picker.isDeleted()) {
@@ -258,9 +282,16 @@ class Model extends Emitter<ModelEvent> {
                         }
 
                         if (dataLG.picker instanceof Label && !dataLG.picker.isDeleted()) {
-                            dataLG.objects = this.getObjectByLabel(dataLG.picker).filter((obj) => {
-                                return obj instanceof Group;
-                            }) as any;
+
+                            if (dataLG.picker.id === this.currentGroupLabel.id) {
+                                behavior.currentGroupKey.push(key);
+                                dataLG.objects = [];
+
+                            } else {
+                                dataLG.objects = this.getObjectByLabel(dataLG.picker).filter((obj) => {
+                                    return obj instanceof Group;
+                                }) as any;
+                            }
                         }
                         break;
                 }
@@ -351,17 +382,12 @@ class Model extends Emitter<ModelEvent> {
         // 渲染
         for (let i = 0; i < this.objectPool.length; i++) {
             let object = this.objectPool[i];
+            object.renderParameter.color = object.color;
             if (object.display && object instanceof Group) {
-                this.renderer.points(object.id, object.exportPositionData(), {
-                    color: object.color,
-                    size: object.size
-                } as any);
+                this.renderer.points(object.id, object.exportPositionData(), object.renderParameter);
             }
             if (object.display && object instanceof Range) {
-                this.renderer.cube(object.id, object.position, {
-                    color: object.color,
-                    radius: object.radius
-                } as any);
+                this.renderer.cube(object.id, object.position, object.radius, object.renderParameter);
             }
         }
     }
@@ -375,5 +401,6 @@ export {
     EventMixin,
     Model,
     CtrlObject,
-    ObjectID
+    ObjectID,
+    IAnyObject
 }

source/Model/Parameter.ts

@@ -0,0 +1,199 @@
+import type { Group } from "@Model/Group";
+import type { Range } from "@Model/Range";
+import type { Label } from "@Model/Label";
+
+type IObjectParamCacheType<P, Q = P> = {
+    picker: P;
+    objects: Q;
+}
+
+/**
+ * 参数类型
+ */
+type IMapBasicParamTypeKeyToType = {
+    "number": number;
+    "string": string;
+    "boolean": boolean;
+    "option": string;
+}
+
+type IMapObjectParamTypeKeyToType = {
+    "R": IObjectParamCacheType<Range | undefined>;
+    "G": IObjectParamCacheType<Group | undefined>;
+    "LR": IObjectParamCacheType<Label | Range | undefined, Range[]>;
+    "LG": IObjectParamCacheType<Label | Group | undefined, Group[]>;
+    "CG": IObjectParamCacheType<Label | Group | undefined, Group | undefined>;
+    "CLG": IObjectParamCacheType<Label | Group | undefined, Group[]>;
+}
+
+type IMapVectorParamTypeKeyToType = {
+    "vec": number[];
+    "color": number[];
+}
+
+/**
+ * 参数类型映射
+ */
+type AllMapType = IMapBasicParamTypeKeyToType & IMapObjectParamTypeKeyToType & IMapVectorParamTypeKeyToType;
+type IParamType = keyof AllMapType;
+type IObjectType = keyof IMapObjectParamTypeKeyToType;
+type IVectorType = keyof IMapVectorParamTypeKeyToType;
+type IParamValue<K extends IParamType> = AllMapType[K];
+
+/**
+ * 特殊对象类型判定
+ */
+const objectTypeListEnumSet = new Set<string>(["R", "G", "LR", "LG", "CG", "CLG"]);
+
+ /**
+  * 对象断言表达式
+  */
+function isObjectType(key: string): key is IVectorType {
+    return objectTypeListEnumSet.has(key);
+}
+ 
+ /**
+  * 向量断言表达式
+  */
+function isVectorType(key: string): key is IObjectType {
+    return key === "vec";
+}
+
+/**
+ * 模型参数类型
+ */
+interface IParameterOptionItem<T extends IParamType = IParamType> {
+
+    /**
+     * 参数类型
+     */
+    type: T | string;
+
+    /**
+     * 参数默认值
+     */
+    defaultValue?: IParamValue<T>;
+
+    /**
+     * 数值变化回调
+     */
+    onChange?: (value: IParamValue<T>) => any;
+
+    /**
+     * 名字
+     */
+    name: string;
+
+    /**
+     * 字符长度
+     */
+    maxLength?: number;
+
+    /**
+     * 数字步长
+     */
+    numberStep?: number;
+
+    /**
+     * 最大值最小值
+     */
+    numberMax?: number;
+    numberMin?: number;
+
+    /**
+     * 图标名字
+     */
+    iconName?: string;
+
+    /**
+     * 图标是否显示为红色
+     */
+    iconRed?: boolean;
+
+    /**
+     * 颜色是否进行归一化
+     */
+    colorNormal?: boolean;
+
+    /**
+     * 显示条件
+     */
+    condition?: {key: string, value: any};
+
+    /**
+     * 全部选项
+     */
+    allOption?: Array<{key: string, name: string}>;
+}
+
+interface IParameter {
+    [x: string]: IParamType;
+}
+
+/**
+ * 参数类型列表
+ */
+type IParameterOption<P extends IParameter> = {
+    [X in keyof P]: IParameterOptionItem<P[X]>;
+}
+
+/**
+ * 参数类型列表映射到参数对象
+ */
+type IParameterValue<P extends IParameter> = {
+    [X in keyof P]: IParamValue<P[X]>
+}
+
+function getDefaultValue<P extends IParameter> (option: IParameterOption<P>): IParameterValue<P> {
+    let defaultObj = {} as IParameterValue<P>;
+    for (let key in option) {
+        let defaultVal = option[key].defaultValue;
+        
+        if (defaultVal !== undefined) {
+            defaultObj[key] = defaultVal;
+        } else {
+
+            switch (option[key].type) {
+                case "string":
+                    defaultObj[key] = "" as any;
+                    break;
+
+                case "number":
+                    defaultObj[key] = 0 as any;
+                    break;
+
+                case "boolean":
+                    defaultObj[key] = false as any;
+                    break;
+
+                case "vec":
+                    defaultObj[key] = [0, 0, 0] as any;
+                    break;
+                
+                case "CG":
+                case "G":
+                case "R":
+                    defaultObj[key] = {
+                        picker: undefined,
+                        objects: undefined
+                    } as any;
+                    break;
+
+                case "CLG":
+                case "LR":
+                case "LG":
+                    defaultObj[key] = {
+                        picker: undefined,
+                        objects: []
+                    } as any;
+                    break;
+            }
+        }
+    }
+    return defaultObj;
+}
+
+export {
+    IParamType, IParamValue, isObjectType, isVectorType, getDefaultValue,
+    IParameterOptionItem, IParameter, IParameterOption, IParameterValue
+}

source/Model/Range.ts

@@ -1,4 +1,6 @@
-import { CtrlObject } from "./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 constructor(model: Model, id: ObjectID) {
+
+        super(model, id);
+        
+        if (model.renderer) {
+            this.renderParameter = getDefaultValue(model.renderer.cubeParameterOption);
+        }
+    }
+
 }
 
 export default Range;

source/Model/Renderer.ts

@@ -1,24 +1,31 @@
 import { Emitter, EventType } from "@Model/Emitter";
+import { IAnyObject, ObjectID } from "@Model/Model"; 
+import { IParameter, IParameterOption, IParameterValue } from "@Model/Parameter";
 
 /**
- * 任意类型对象
+ * 默认类型
  */
-type IAnyObject = Record<string, any>;
+type IDefaultType<T, D> = T extends undefined ? D : T;
 
 /**
  * 渲染器参数
  */
 interface IRendererParam {
 
+	/**
+	 * 渲染器参数
+	 */
+	renderer?: IParameter;
+
 	/**
 	 * 绘制点需要的参数
 	 */
-	points?: IAnyObject
+	points?: IParameter;
 
 	/**
 	 * 绘制立方体需要的参数
 	 */
-	cube?: IAnyObject
+	cube?: IParameter;
 }
 
 /**
@@ -32,22 +39,15 @@ interface ICommonParam {
 	color?: ObjectData;
 }
 
-/**
- * 对象标识符
- */
-type ObjectID = string;
+
 
 /**
  * 接收的数据类型
  */
 type ObjectData = Array<number> | Float32Array;
 
-interface IRendererConstructor<
-	M extends IAnyObject = {}
-> {
-	new (canvas: HTMLCanvasElement, param?: M): AbstractRenderer<
-		IRendererParam, IAnyObject, AbstractRendererEvent
-	>
+interface IRendererConstructor {
+	new (): AbstractRenderer<IRendererParam, AbstractRendererEvent>
 }
 
 type AbstractRendererEvent = {
@@ -63,7 +63,6 @@ type AbstractRendererEvent = {
  */
 abstract class AbstractRenderer<
 	P extends IRendererParam = {},
-	M extends IAnyObject = {},
 	E extends AbstractRendererEvent = {loop: number}
 > extends Emitter<E> {
 
@@ -72,28 +71,17 @@ abstract class AbstractRenderer<
 	/**
 	 * 渲染器参数
 	 */
-	abstract param: Partial<M>;
+	public rendererParameterOption: IParameterOption<IDefaultType<P["renderer"], {}>> = {} as any;
+	public pointsParameterOption: IParameterOption<IDefaultType<P["points"], {}>> = {} as any;
+	public cubeParameterOption: IParameterOption<IDefaultType<P["cube"], {}>> = {} as any;
 
 	/**
-	 * 类型断言
+	 * 渲染器参数
 	 */
-	get isRenderer() {
-		return true;
-	}
+	public rendererParameter: IParameterValue<IDefaultType<P["renderer"], {}>> = {} as any;
 
 	/**
-	 * 断言对象是否是渲染器
-	 */
-	public static isRenderer(render: any): render is AbstractRenderer {
-		if (render instanceof Object) {
-			return !!(render as AbstractRenderer).isRenderer;
-		} else {
-			return false;
-		}
-	};
-
-	/**
-	 * @function start 
+	 * @function clean 
 	 * 开始一次数据更新 \
 	 * 此函数将清除固定对象的绘制状态 \
 	 * 在每次数据更新前调用 \
@@ -110,7 +98,9 @@ abstract class AbstractRenderer<
 	 * @param id 使用的标识符
 	 * @param position 做标集合
 	 */
-	abstract points(id: ObjectID, position?: ObjectData, param?: Readonly<P["points"] & ICommonParam>): this;
+	abstract points(id: ObjectID, position?: ObjectData, param?: 
+		Readonly<IParameterValue<IDefaultType<P["points"], {}>>>
+	): this;
 
 	/**
 	 * @function cube 绘制立方体
@@ -120,12 +110,13 @@ abstract class AbstractRenderer<
 	 * 
 	 * 注意: 这里的半径指的是立方体重心与立方体任意一面几何中心的距离
 	 */
-	abstract cube(id: ObjectID, position?: ObjectData, param?: Readonly<P["cube"] & ICommonParam>): this;
+	abstract cube(id: ObjectID, position?: ObjectData, radius?: ObjectData, param?:
+		Readonly<IParameterValue<IDefaultType<P["cube"], {}>>>
+	): this;
 }
 
 export default AbstractRenderer;
 export { 
-    AbstractRenderer, ObjectID, IAnyObject,
-    ICommonParam, IRendererParam, 
+    AbstractRenderer, ICommonParam, IRendererParam, 
     ObjectData, IRendererConstructor 
 };

source/Page/Laboratory/Laboratory.tsx

@@ -1,7 +1,7 @@
 import { Component, ReactNode, createRef } from "react";
 import { ClassicRenderer } from "@GLRender/ClassicRenderer";
-import { Entry } from "../Entry/Entry";
 import { Model } from "@Model/Model";
+import { Entry } from "../Entry/Entry";
 import "./Laboratory.scss";
 
 class Laboratory extends Component {
@@ -21,7 +21,7 @@ class Laboratory extends Component {
             throw new Error("Laboratory: 重复引用 canvas 节点");
         }
 
-        const renderer = new ClassicRenderer({ className: "canvas" }).onLoad();
+        const renderer = new ClassicRenderer().onLoad();
         this.canvasContRef.current.appendChild(renderer.canvas.dom);
 
         let model = new Model().bindRenderer(renderer);
@@ -39,22 +39,24 @@ class Laboratory extends Component {
 
         // 测试渲染器
         if (false) {
-            renderer.points("0");
-            renderer.points("1", new Array(100 * 3).fill(0).map(() => (Math.random() - .5) * 2));
-            renderer.points("2", new Array(100 * 3).fill(0).map(() => (Math.random() - .5) * 2), {
-                size: 100,
-                color: [1, 0, 1]
-            });
-            renderer.points("3", new Array(100 * 3).fill(0).map(() => (Math.random() - .5) * 2), {
-                size: 80,
-                color: [0, 1, 1]
-            });
-            renderer.points("2");
-            renderer.cube("4");
-            renderer.cube("5", new Array(3).fill(0).map(() => (Math.random() - .5) * 2), {
-                radius: new Array(3).fill(0).map(() => Math.random() * 1.2),
-                color: [1, 1, 0]
-            })
+            // renderer.points("0");
+            // renderer.points("1", new Array(100 * 3).fill(0).map(() => (Math.random() - .5) * 2));
+            // renderer.points("2", new Array(100 * 3).fill(0).map(() => (Math.random() - .5) * 2), {
+            //     size: 100,
+            //     color: [1, 0, 1]
+            // });
+            // renderer.points("3", new Array(100 * 3).fill(0).map(() => (Math.random() - .5) * 2), {
+            //     size: 80,
+            //     color: [0, 1, 1]
+            // });
+            // renderer.points("2");
+            // renderer.cube("4");
+            // renderer.cube("5",
+            //     new Array(3).fill(0).map(() => (Math.random() - .5) * 2),
+            //     new Array(3).fill(0).map(() => Math.random() * 1.2), {
+            //         color: [1, 1, 0]
+            //     }
+            // )
         }
 
         (window as any).renderer = renderer;

source/Page/SimulatorWeb/SimulatorWeb.tsx

@@ -1,16 +1,17 @@
 import { Component, ReactNode } from "react";
 import { SettingProvider, Setting } from "@Context/Setting";
-import { HeaderBar } from "@Component/HeaderBar/HeaderBar";
 import { Theme, BackgroundLevel, FontLevel } from "@Component/Theme/Theme";
-import { Entry } from "../Entry/Entry";
 import { StatusProvider, Status } from "@Context/Status";
 import { ClassicRenderer } from "@GLRender/ClassicRenderer";
 import { initializeIcons } from '@fluentui/font-icons-mdl2';
 import { RootContainer } from "@Component/Container/RootContainer";
 import { LayoutDirection } from "@Context/Layout";
+import { AllBehaviors, getBehaviorById } from "@Behavior/Behavior";
 import { CommandBar } from "@Component/CommandBar/CommandBar";
+import { HeaderBar } from "@Component/HeaderBar/HeaderBar";
 import { Popup } from "@Component/Popup/Popup";
-import { AllBehaviors } from "@Behavior/Behavior";
+import { Entry } from "../Entry/Entry";
+import { Group } from "@Model/Group";
 import "./SimulatorWeb.scss";
 
 initializeIcons("https://img.mrkbear.com/fabric-cdn-prod_20210407.001/");
@@ -35,41 +36,123 @@ class SimulatorWeb extends Component {
         (window as any).setting = (this.setting as any);
 
         // TODO: 这里要读取存档
+        const classicRender = new ClassicRenderer().onLoad();
         this.status = new Status();
-        this.status.renderer = new ClassicRenderer({ className: "canvas" }).onLoad();
-        this.status.bindRenderer(this.status.renderer);
+        this.status.bindRenderer(classicRender);
         this.status.setting = this.setting;
 
-        // 测试代码
-        if (true) {
-            let group = this.status.newGroup();
-            let range = this.status.newRange();
-            range.color = [.1, .5, .9];
-            group.new(100);
-            group.color = [.8, .1, .6];
+        const randomPosition = (group: Group) => {
             group.individuals.forEach((individual) => {
                 individual.position[0] = (Math.random() - .5) * 2;
                 individual.position[1] = (Math.random() - .5) * 2;
                 individual.position[2] = (Math.random() - .5) * 2;
             })
+        };
+
+        // 测试代码
+        if (false) {
+            let group = this.status.newGroup();
+            let range = this.status.newRange();
+            range.color = [.1, .5, .9];
+            group.new(100);
+            group.color = [.8, .1, .6];
+            randomPosition(group);
             this.status.model.update(0);
             this.status.newLabel().name = "New Label";
             this.status.newLabel().name = "Test Label 01";
-            // let template = this.status.model.addBehavior(AllBehaviors[0]);
-            // template.name = "Template"; template.color = [150, 20, 220];
-            let dynamic = this.status.model.addBehavior(AllBehaviors[0]);
+            let template = this.status.model.addBehavior(AllBehaviors[0]);
+            template.name = "Template"; template.color = [150, 20, 220];
+            let dynamic = this.status.model.addBehavior(AllBehaviors[1]);
             dynamic.name = "Dynamic"; dynamic.color = [250, 200, 80];
-            let brownian = this.status.model.addBehavior(AllBehaviors[1]);
+            let brownian = this.status.model.addBehavior(AllBehaviors[2]);
             brownian.name = "Brownian"; brownian.color = [200, 80, 250];
-            let boundary = this.status.model.addBehavior(AllBehaviors[2]);
+            let boundary = this.status.model.addBehavior(AllBehaviors[3]);
             boundary.name = "Boundary"; boundary.color = [80, 200, 250];
-            // boundary.parameter.range.picker = this.status.model.allRangeLabel;
-            // group.addBehavior(template);
+            boundary.parameter.range.picker = this.status.model.allRangeLabel;
+            group.addBehavior(template);
             group.addBehavior(dynamic);
             group.addBehavior(brownian);
             group.addBehavior(boundary);
         }
 
+        // 鱼群模型测试
+        if (true) {
+            let fish1 = this.status.newGroup();
+            let fish2 = this.status.newGroup();
+            let shark = this.status.newGroup();
+            let range = this.status.newRange();
+
+            range.displayName = "Experimental site";
+            range.color = [.8, .1, .6];
+
+            fish1.new(100);
+            fish1.displayName = "Fish A";            
+            fish1.color = [.1, .5, .9];
+            randomPosition(fish1);
+
+            fish2.new(50);
+            fish2.displayName = "Fish B";            
+            fish2.color = [.3, .2, .9];
+            randomPosition(fish2);
+
+            shark.new(3);
+            shark.displayName = "Shark";
+            shark.color = [.8, .2, .3];
+            shark.renderParameter.size = 100;
+            shark.renderParameter.shape = "5";
+            randomPosition(shark);
+
+            this.status.model.update(0);
+            let fishLabel = this.status.newLabel();
+            fishLabel.name = "Fish";
+            fish1.addLabel(fishLabel);
+            fish2.addLabel(fishLabel);
+
+            let template = this.status.model.addBehavior(getBehaviorById("Template"));
+            template.name = "Template"; template.color = [150, 20, 220];
+
+            let dynamicFish = this.status.model.addBehavior(getBehaviorById("PhysicsDynamics"));
+            dynamicFish.name = "Dynamic Fish"; dynamicFish.color = [250, 200, 80];
+
+            let dynamicShark = this.status.model.addBehavior(getBehaviorById("PhysicsDynamics"));
+            dynamicShark.name = "Dynamic Shark"; dynamicShark.color = [250, 200, 80];
+            dynamicShark.parameter.maxAcceleration = 8.5;
+            dynamicShark.parameter.maxVelocity = 15.8;
+            dynamicShark.parameter.resistance = 3.6;
+
+            let brownian = this.status.model.addBehavior(getBehaviorById("Brownian"));
+            brownian.name = "Brownian"; brownian.color = [200, 80, 250];
+
+            let boundary = this.status.model.addBehavior(getBehaviorById("BoundaryConstraint"));
+            boundary.name = "Boundary"; boundary.color = [80, 200, 250];
+            boundary.parameter.range.picker = this.status.model.allRangeLabel;
+
+            let tracking = this.status.model.addBehavior(getBehaviorById("Tracking"));
+            tracking.name = "Tracking"; tracking.color = [80, 200, 250];
+            tracking.parameter.target.picker = fishLabel;
+
+            let attacking = this.status.model.addBehavior(getBehaviorById("ContactAttacking"));
+            attacking.name = "Contact Attacking"; attacking.color = [120, 100, 250];
+            attacking.parameter.target.picker = fishLabel;
+
+            fish1.addBehavior(dynamicFish);
+            fish1.addBehavior(brownian);
+            fish1.addBehavior(boundary);
+
+            fish2.addBehavior(dynamicFish);
+            fish2.addBehavior(brownian);
+            fish2.addBehavior(boundary);
+
+            shark.addBehavior(dynamicShark);
+            shark.addBehavior(boundary);
+            shark.addBehavior(tracking);
+            shark.addBehavior(attacking);
+
+            setTimeout(() => {
+                this.status.model.updateBehaviorParameter();
+            }, 200)
+        }
+
         (window as any).s = this;
     }
 

source/Panel/BehaviorDetails/BehaviorDetails.tsx

@@ -1,26 +1,70 @@
-import { Component, Fragment, ReactNode} from "react";
+import { Component, ReactNode} from "react";
 import { useSettingWithEvent, IMixinSettingProps } from "@Context/Setting";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
-import { Behavior, IBehaviorParameter, isObjectType, isVectorType } from "@Model/Behavior";
-import { Message } from "@Component/Message/Message";
-import { AttrInput } from "@Component/AttrInput/AttrInput";
-import { ColorInput } from "@Component/ColorInput/ColorInput";
-import { TogglesInput } from "@Component/TogglesInput/TogglesInput";
+import { getDefaultValue } from "@Model/Parameter";
+import { IAnyBehavior } from "@Model/Behavior";
+import { Message } from "@Input/Message/Message";
+import { AttrInput } from "@Input/AttrInput/AttrInput";
+import { ColorInput } from "@Input/ColorInput/ColorInput";
+import { TogglesInput } from "@Input/TogglesInput/TogglesInput";
 import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
-import { ObjectPicker } from "@Component/ObjectPicker/ObjectPicker";
+import { Parameter } from "@Input/Parameter/Parameter";
 import "./BehaviorDetails.scss";
 
 interface IBehaviorDetailsProps {}
 
+interface IBehaviorDetailsState {
+    updateId: number;
+}
+
 @useSettingWithEvent("language")
 @useStatusWithEvent("focusBehaviorChange", "behaviorAttrChange")
-class BehaviorDetails extends Component<IBehaviorDetailsProps & IMixinStatusProps & IMixinSettingProps> {
+class BehaviorDetails extends Component<IBehaviorDetailsProps & IMixinStatusProps & IMixinSettingProps, IBehaviorDetailsState> {
 
-	private renderFrom<T extends IBehaviorParameter>
-    (behavior: Behavior<T, Record<string, any>>): ReactNode {
+    public state: Readonly<IBehaviorDetailsState> = {
+        updateId: 1
+    };
 
-        const allParameterKeys = Object.getOwnPropertyNames(behavior.parameterOption);
+    private handelDeleteBehavior = (behavior: IAnyBehavior) => {
+        if (this.props.status) {
+            const status = this.props.status;
+            status.popup.showPopup(ConfirmPopup, {
+                infoI18n: "Popup.Delete.Behavior.Confirm",
+                titleI18N: "Popup.Action.Objects.Confirm.Title",
+                yesI18n: "Popup.Action.Objects.Confirm.Delete",
+                red: "yes",
+                yes: () => {
+                    status.model.deleteBehavior(behavior);
+                    status.setBehaviorObject();
+                }
+            })
+        }
+    }
 
+    private handelRestoreBehavior = (behavior: IAnyBehavior) => {
+        if (this.props.status) {
+            const status = this.props.status;
+            status.popup.showPopup(ConfirmPopup, {
+                infoI18n: "Popup.Restore.Behavior.Confirm",
+                titleI18N: "Popup.Action.Objects.Confirm.Restore.Title",
+                yesI18n: "Popup.Action.Objects.Confirm.Restore",
+                red: "yes",
+                yes: () => {
+                    status.changeBehaviorAttrib(
+                        behavior.id, "parameter",
+                        getDefaultValue(behavior.parameterOption) as any,
+                        true
+                    );
+                    this.setState({
+                        updateId: this.state.updateId + 1
+                    });
+                }
+            })
+        }
+    }
+
+	private renderFrom(behavior: IAnyBehavior): ReactNode {
+        
 		return <>
         
             <Message i18nKey="Common.Attr.Title.Basic" isTitle first/>
@@ -44,145 +88,37 @@ class BehaviorDetails extends Component<IBehaviorDetailsProps & IMixinStatusProp
 				keyI18n="Common.Attr.Key.Delete" red
 				onIconName="delete" offIconName="delete"
 				valueChange={() => {
-					if (this.props.status) {
-                        const status = this.props.status;
-                        status.popup.showPopup(ConfirmPopup, {
-                            infoI18n: "Popup.Delete.Behavior.Confirm",
-                            titleI18N: "Popup.Action.Objects.Confirm.Title",
-                            yesI18n: "Popup.Action.Objects.Confirm.Delete",
-                            red: "yes",
-                            yes: () => {
-                                status.model.deleteBehavior(behavior);
-                                status.setBehaviorObject();
-                            }
-                        })
-                    }
+					this.handelDeleteBehavior(behavior)
 				}}
 			/>
 
-            {
-                allParameterKeys.length > 0 ?
-                    <Message
-                        isTitle
-                        i18nKey="Panel.Info.Behavior.Details.Behavior.Props"
-                        options={{
-                            behavior: behavior.getTerms(behavior.behaviorName, this.props.setting?.language)
-                        }}
-                    /> : null
-            }
+            <TogglesInput
+				keyI18n="Common.Attr.Key.Behavior.Restore" red
+				onIconName="ReplyAll" offIconName="ReplyAll"
+				valueChange={() => {
+					this.handelRestoreBehavior(behavior)
+				}}
+			/>
             
-            {
-                allParameterKeys.map((key) => {
-                    return this.renderParameter(behavior, key);
-                })
-            }
+            <Parameter
+                key={`${behavior.id}-${this.state.updateId}`}
+                option={behavior.parameterOption}
+                value={behavior.parameter}
+                i18n={(name, language) => behavior.getTerms(name, language)}
+                title={"Panel.Info.Behavior.Details.Behavior.Props"}
+                titleOption={{
+                    behavior: behavior.getTerms(behavior.behaviorName, this.props.setting?.language)
+                }}
+                change={(key, value) => {
+                    this.props.status?.changeBehaviorAttrib(
+                        behavior.id, key as string, value
+                    );
+                }}
+            />
 
         </>;
 	}
 
-    private renderParameter<T extends IBehaviorParameter>
-    (behavior: Behavior<T, Record<string, any>>, key: keyof T): ReactNode {
-        const type = behavior.parameterOption[key];
-        const value = behavior.parameter[key];
-        const indexKey = `${behavior.id}-${key}`;
-
-        if (type.type === "number") {
-            return <AttrInput
-                keyI18n="Panel.Info.Behavior.Details.Parameter.Key"
-                keyI18nOption={{ key: behavior.getTerms(type.name, this.props.setting?.language) }}
-                key={indexKey} id={indexKey} isNumber={true} step={type.numberStep} maxLength={type.maxLength}
-                max={type.numberMax} min={type.numberMin}
-                value={(value as number) ?? 0}
-                valueChange={(val) => {
-                    this.props.status?.changeBehaviorAttrib(behavior.id, key as string, (val as any) / 1);
-                }}
-            />
-        }
-
-        if (type.type === "string") {
-            return <AttrInput
-                keyI18n="Panel.Info.Behavior.Details.Parameter.Key"
-                keyI18nOption={{ key: behavior.getTerms(type.name, this.props.setting?.language) }}
-                key={indexKey} id={indexKey} maxLength={type.maxLength}
-                value={(value as string) ?? ""}
-                valueChange={(val) => {
-                    this.props.status?.changeBehaviorAttrib(behavior.id, key as string, val);
-                }}
-            />
-        }
-
-        if (type.type === "boolean") {
-            return <TogglesInput
-                keyI18n="Panel.Info.Behavior.Details.Parameter.Key"
-                keyI18nOption={{ key: behavior.getTerms(type.name, this.props.setting?.language) }}
-				onIconName={type.iconName} key={indexKey} value={(value as boolean) ?? false}
-				valueChange={(val) => {
-					this.props.status?.changeBehaviorAttrib(behavior.id, key as string, val);
-				}}
-			/>
-        }
-
-        if (isObjectType(type.type as any)) {
-            return <ObjectPicker
-                keyI18n="Panel.Info.Behavior.Details.Parameter.Key"
-                keyI18nOption={{ key: behavior.getTerms(type.name, this.props.setting?.language) }}
-                type={type.type} value={(value as any).picker} key={indexKey}
-                valueChange={(obj) => {
-                    (value as any).picker = obj;
-                    this.props.status?.changeBehaviorAttrib(behavior.id, key as string, value);
-                }}
-                cleanValue={() => {
-                    (value as any).picker = undefined;
-                    this.props.status?.changeBehaviorAttrib(behavior.id, key as string, value);
-                }}
-            />
-        }
-
-        if (isVectorType(type.type as any)) {
-            return <Fragment key={indexKey}>
-                
-                <AttrInput
-                    keyI18n="Panel.Info.Behavior.Details.Parameter.Key.Vec.X"
-                    keyI18nOption={{ key: behavior.getTerms(type.name, this.props.setting?.language) }}
-                    key={`${indexKey}-X`} id={indexKey} isNumber={true} step={type.numberStep} maxLength={type.maxLength}
-                    max={type.numberMax} min={type.numberMin}
-                    value={(value as number[])[0] ?? 0}
-                    valueChange={(val) => {
-                        (value as number[])[0] = (val as any) / 1;
-                        this.props.status?.changeBehaviorAttrib(behavior.id, key as string, value);
-                    }}
-                />
-
-                <AttrInput
-                    keyI18n="Panel.Info.Behavior.Details.Parameter.Key.Vec.Y"
-                    keyI18nOption={{ key: behavior.getTerms(type.name, this.props.setting?.language) }}
-                    key={`${indexKey}-Y`} id={indexKey} isNumber={true} step={type.numberStep} maxLength={type.maxLength}
-                    max={type.numberMax} min={type.numberMin}
-                    value={(value as number[])[1] ?? 0}
-                    valueChange={(val) => {
-                        (value as number[])[1] = (val as any) / 1;
-                        this.props.status?.changeBehaviorAttrib(behavior.id, key as string, value);
-                    }}
-                />
-
-                <AttrInput
-                    keyI18n="Panel.Info.Behavior.Details.Parameter.Key.Vec.Z"
-                    keyI18nOption={{ key: behavior.getTerms(type.name, this.props.setting?.language) }}
-                    key={`${indexKey}-Z`} id={indexKey} isNumber={true} step={type.numberStep} maxLength={type.maxLength}
-                    max={type.numberMax} min={type.numberMin}
-                    value={(value as number[])[2] ?? 0}
-                    valueChange={(val) => {
-                        (value as number[])[2] = (val as any) / 1;
-                        this.props.status?.changeBehaviorAttrib(behavior.id, key as string, value);
-                    }}
-                />
-
-            </Fragment>
-        }
-
-        return <Fragment key={indexKey}/>
-    }
-
 	public render(): ReactNode {
 		if (this.props.status && this.props.status.focusBehavior) {
             return this.renderFrom(this.props.status.focusBehavior);

source/Panel/BehaviorList/BehaviorList.tsx

@@ -1,11 +1,11 @@
-import { BehaviorList as BehaviorListComponent } from "@Component/BehaviorList/BehaviorList";
 import { Component } from "react";
+import { BehaviorList as BehaviorListComponent } from "@Component/BehaviorList/BehaviorList";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
 import { useSetting, IMixinSettingProps } from "@Context/Setting";
-import { Behavior } from "@Model/Behavior";
-import { Message } from "@Component/Message/Message";
 import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
 import { BehaviorPopup } from "@Component/BehaviorPopup/BehaviorPopup";
+import { Behavior } from "@Model/Behavior";
+import { Message } from "@Input/Message/Message";
 import "./BehaviorList.scss";
 
 interface IBehaviorListProps {

source/Panel/GroupDetails/GroupDetails.tsx

@@ -1,18 +1,19 @@
 import { Component, ReactNode } from "react";
-import { AttrInput } from "@Component/AttrInput/AttrInput";
+import { AttrInput } from "@Input/AttrInput/AttrInput";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
 import { useSetting, IMixinSettingProps } from "@Context/Setting";
-import { Message } from "@Component/Message/Message";
-import { ObjectID } from "@Model/Renderer";
-import { ColorInput } from "@Component/ColorInput/ColorInput";
-import { TogglesInput } from "@Component/TogglesInput/TogglesInput";
-import { LabelPicker } from "@Component/LabelPicker/LabelPicker";
+import { ComboInput, IDisplayItem } from "@Input/ComboInput/ComboInput";
+import { Message } from "@Input/Message/Message";
+import { ObjectID } from "@Model/Model";
+import { ColorInput } from "@Input/ColorInput/ColorInput";
+import { TogglesInput } from "@Input/TogglesInput/TogglesInput";
+import { LabelPicker } from "@Input/LabelPicker/LabelPicker";
 import { Group, GenMod } from "@Model/Group";
 import { AllI18nKeys } from "@Component/Localization/Localization";
-import { ComboInput, IDisplayItem } from "@Component/ComboInput/ComboInput";
-import { ObjectPicker } from "@Component/ObjectPicker/ObjectPicker";
+import { ObjectPicker } from "@Input/ObjectPicker/ObjectPicker";
 import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
-import { BehaviorPicker } from "@Component/BehaviorPicker/BehaviorPicker";
+import { BehaviorPicker } from "@Input/BehaviorPicker/BehaviorPicker";
+import { Parameter } from "@Input/Parameter/Parameter";
 import "./GroupDetails.scss";
 
 interface IGroupDetailsProps {}
@@ -22,8 +23,8 @@ mapGenModToI18nKey.set(GenMod.Point, "Common.Attr.Key.Generation.Mod.Point");
 mapGenModToI18nKey.set(GenMod.Range, "Common.Attr.Key.Generation.Mod.Range");
 
 const allOption: IDisplayItem[] = [
-    {nameKey: "Common.Attr.Key.Generation.Mod.Point", key: GenMod.Point},
-    {nameKey: "Common.Attr.Key.Generation.Mod.Range", key: GenMod.Range}
+    {i18n: "Common.Attr.Key.Generation.Mod.Point", key: GenMod.Point},
+    {i18n: "Common.Attr.Key.Generation.Mod.Range", key: GenMod.Range}
 ];
 
 @useSetting
@@ -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
                 keyI18n="Common.Attr.Key.Label"
                 labels={group.allLabels()}
@@ -114,6 +107,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/>
 
@@ -144,7 +154,7 @@ class GroupDetails extends Component<IGroupDetailsProps & IMixinStatusProps & IM
             <ComboInput
                 keyI18n="Common.Attr.Key.Generation.Mod"
                 value={{
-                    nameKey: mapGenModToI18nKey.get(group.genMethod) ?? "Common.No.Data",
+                    i18n: mapGenModToI18nKey.get(group.genMethod) ?? "Common.No.Data",
                     key: group.genMethod
                 }}
                 allOption={allOption}

source/Panel/LabelDetails/LabelDetails.tsx

@@ -1,11 +1,11 @@
 import { Component, ReactNode } from "react";
-import { AttrInput } from "@Component/AttrInput/AttrInput";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
-import { Message } from "@Component/Message/Message";
-import { ColorInput } from "@Component/ColorInput/ColorInput";
-import { Label } from "@Model/Label";
-import { TogglesInput } from "@Component/TogglesInput/TogglesInput";
+import { TogglesInput } from "@Input/TogglesInput/TogglesInput";
 import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
+import { ColorInput } from "@Input/ColorInput/ColorInput";
+import { AttrInput } from "@Input/AttrInput/AttrInput";
+import { Message } from "@Input/Message/Message";
+import { Label } from "@Model/Label";
 import "./LabelDetails.scss";
 
 @useStatusWithEvent("focusLabelChange", "labelAttrChange", "labelChange")

source/Panel/LabelList/LabelList.tsx

@@ -1,10 +1,10 @@
-import { LabelList as LabelListComponent } from "@Component/LabelList/LabelList";
 import { Component } from "react";
+import { LabelList as LabelListComponent } from "@Component/LabelList/LabelList";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
 import { useSetting, IMixinSettingProps } from "@Context/Setting";
-import { Label } from "@Model/Label";
-import { Message } from "@Component/Message/Message";
 import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
+import { Message } from "@Input/Message/Message";
+import { Label } from "@Model/Label";
 import "./LabelList.scss";
 
 interface ILabelListProps {

source/Panel/ObjectList/ObjectCommand.tsx

@@ -1,9 +1,9 @@
-import { BackgroundLevel, FontLevel, Theme } from "@Component/Theme/Theme";
-import { useStatus, IMixinStatusProps } from "../../Context/Status";
-import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
-import { Icon } from "@fluentui/react";
 import { Component, ReactNode } from "react";
-import { ObjectID } from "@Model/Renderer";
+import { BackgroundLevel, FontLevel, Theme } from "@Component/Theme/Theme";
+import { useStatus, IMixinStatusProps } from "@Context/Status";
+import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
+import { ObjectID } from "@Model/Model";
+import { Icon } from "@fluentui/react";
 import "./ObjectList.scss";
 
 @useStatus

source/Panel/ObjectList/ObjectList.tsx

@@ -1,9 +1,9 @@
 import { Component, ReactNode } from "react";
-import { DetailsList } from "@Component/DetailsList/DetailsList";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
 import { useSetting, IMixinSettingProps } from "@Context/Setting";
 import { Localization } from "@Component/Localization/Localization";
-import { ObjectID } from "@Model/Renderer";
+import { DetailsList } from "@Component/DetailsList/DetailsList";
+import { ObjectID } from "@Model/Model";
 import { Icon } from "@fluentui/react";
 import "./ObjectList.scss";
 

source/Panel/Panel.tsx

@@ -1,15 +1,15 @@
 import { ReactNode, Component, FunctionComponent } from "react";
 import { Theme } from "@Component/Theme/Theme";
-import { Message } from "@Component/Message/Message";
-import { RenderView } from "./RenderView/RenderView";
-import { ObjectList } from "./ObjectList/ObjectList";
-import { ObjectCommand } from "./ObjectList/ObjectCommand";
-import { RangeDetails } from "./RangeDetails/RangeDetails";
-import { LabelList } from "./LabelList/LabelList";
-import { LabelDetails } from "./LabelDetails/LabelDetails";
-import { GroupDetails } from "./GroupDetails/GroupDetails";
-import { BehaviorList } from "./BehaviorList/BehaviorList";
-import { BehaviorDetails } from "./BehaviorDetails/BehaviorDetails";
+import { Message } from "@Input/Message/Message";
+import { RenderView } from "@Panel/RenderView/RenderView";
+import { ObjectList } from "@Panel/ObjectList/ObjectList";
+import { ObjectCommand } from "@Panel/ObjectList/ObjectCommand";
+import { RangeDetails } from "@Panel/RangeDetails/RangeDetails";
+import { LabelList } from "@Panel/LabelList/LabelList";
+import { LabelDetails } from "@Panel/LabelDetails/LabelDetails";
+import { GroupDetails } from "@Panel/GroupDetails/GroupDetails";
+import { BehaviorList } from "@Panel/BehaviorList/BehaviorList";
+import { BehaviorDetails } from "@Panel/BehaviorDetails/BehaviorDetails";
 
 interface IPanelInfo {
 	nameKey: string;

source/Panel/RangeDetails/RangeDetails.tsx

@@ -1,13 +1,14 @@
 import { Component, ReactNode } from "react";
-import { AttrInput } from "@Component/AttrInput/AttrInput";
-import { useStatusWithEvent, IMixinStatusProps, Status } from "@Context/Status";
-import { Message } from "@Component/Message/Message";
+import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
+import { AttrInput } from "@Input/AttrInput/AttrInput";
+import { Message } from "@Input/Message/Message";
 import { Range } from "@Model/Range";
-import { ObjectID } from "@Model/Renderer";
-import { ColorInput } from "@Component/ColorInput/ColorInput";
-import { TogglesInput } from "@Component/TogglesInput/TogglesInput";
-import { LabelPicker } from "@Component/LabelPicker/LabelPicker";
+import { ObjectID } from "@Model/Model";
+import { ColorInput } from "@Input/ColorInput/ColorInput";
+import { TogglesInput } from "@Input/TogglesInput/TogglesInput";
+import { LabelPicker } from "@Input/LabelPicker/LabelPicker";
 import { ConfirmPopup } from "@Component/ConfirmPopup/ConfirmPopup";
+import { Parameter } from "@Input/Parameter/Parameter";
 import "./RangeDetails.scss";
 
 @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/>
 
             <AttrInput

tsconfig.json

@@ -32,6 +32,9 @@
             "@Component/*": [
                 "./source/Component/*"
             ],
+            "@Input/*": [
+                "./source/Input/*"
+            ],
             "@Localization/*": [
                 "./source/Localization/*"
             ],