CocosPlugin/cocos-animator
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix:界面拉伸适配. add:支持cocos animation,spine,dragonbones等文件导入.

Browse Source
This commit is contained in:
YipLee
2021-01-22 00:02:49 +08:00
parent c4f716c8e9
commit c232a91a41
23 changed files with 2590 additions and 2028 deletions
Download Patch File Download Diff File Expand all files Collapse all files

454
animator-editor/assets/script/editor/fsm/FsmCtr.ts
View File

@@ -1,4 +1,5 @@
import Events, { EventName, preloadEvent } from "../../common/util/Events";
import Tool from "../../common/util/Tool";
import { ANIMATOR_VERSION } from "../../constant/BaseConst";
import Condition from "../data/Condition";
import State from "../data/State";
@@ -58,210 +59,6 @@ export default class FsmCtr extends cc.Component {
}
}
//#region import and export
private importTransitions(transitionsData: any[], state: State, stateMap: Map<string, State>, paramMap: Map<string, ParamItem>) {
transitionsData.forEach((e) => {
let toState: State = stateMap.get(e.toState);
let transition: Transition = state.addTransition(toState);
transition.hasExitTime = e.hasExitTime;
e.conditions.forEach((cData) => {
let paramItem = paramMap.get(cData.param);
let condition: Condition = transition.addCondition(paramItem);
condition.value = cData.value;
condition.logic = cData.logic;
});
});
}
private importSubState(upData: any, upMachine: StateMachine, stateDataMap: Map<string, any>, stateMap: Map<string, State>, paramMap: Map<string, ParamItem>) {
upData.subStates.forEach((name: string) => {
let state = new State(upMachine, false);
stateMap.set(name, state);
let data = stateDataMap.get(name);
state.setPosition(data.position[0], data.position[1]);
state.name = data.state;
state.motion = data.motion;
state.speed = data.speed;
state.multiplierParam = paramMap.get(data.multiplier) || null;
state.loop = data.loop;
upMachine.add(state);
});
}
private importSubMachine(upData: any, upMachine: StateMachine, subMachineDataMap: Map<string, any>, subMachineMap: Map<string, StateMachine>, stateDataMap: Map<string, any>, stateMap: Map<string, State>, paramMap: Map<string, ParamItem>) {
upData.subStateMachines.forEach((name: string) => {
let stateMachine = new StateMachine(upMachine);
subMachineMap.set(name, stateMachine);
let data = subMachineDataMap.get(name);
stateMachine.setLayerPos(data.layerPos[0], data.layerPos[1]);
stateMachine.setLayerScale(data.layerScale);
stateMachine.setAnyStatePos(data.anyStatePos[0], data.anyStatePos[1]);
stateMachine.name = data.name;
stateMachine.setPosition(data.position[0], data.position[1]);
stateMachine.setUpStateMachinePos(data.upStateMachinePos[0], data.upStateMachinePos[1]);
upMachine.add(stateMachine);
this.importSubState(data, stateMachine, stateDataMap, stateMap, paramMap);
this.importSubMachine(data, stateMachine, subMachineDataMap, subMachineMap, stateDataMap, stateMap, paramMap);
});
}
private exportAllSubMachine(arr: any[], stateMachine: StateMachine) {
stateMachine.subStateMachines.forEach((sub) => {
let data = {
layerPos: [sub.layerPos.x, sub.layerPos.y],
layerScale: sub.layerScale,
anyStatePos: [sub.anyStatePos.x, sub.anyStatePos.y],
name: sub.name,
position: [sub.position.x, sub.position.y],
upStateMachine: sub.upStateMachine.name,
upStateMachinePos: [sub.upStateMachinePos.x, sub.upStateMachinePos.y],
subStates: [],
subStateMachines: [],
}
sub.subStates.forEach((e) => {
data.subStates.push(e.name);
});
sub.subStateMachines.forEach((e) => {
data.subStateMachines.push(e.name);
});
arr.push(data);
this.exportAllSubMachine(arr, sub);
});
}
private exportAllState(arr: any[], stateMachine: StateMachine, isRuntimeData: boolean = false) {
stateMachine.subStates.forEach((e) => {
let data = null;
if (isRuntimeData) {
data = {
state: e.name,
motion: e.motion,
speed: e.speed,
multiplier: e.getMultiplierName(),
loop: e.loop,
transitions: e.getAllTransitionData()
}
} else {
data = {
position: [e.position.x, e.position.y],
upStateMachine: e.upStateMachine.name,
state: e.name,
motion: e.motion,
speed: e.speed,
multiplier: e.getMultiplierName(),
loop: e.loop,
transitions: e.getAllTransitionData()
}
}
arr.push(data);
});
stateMachine.subStateMachines.forEach((sub) => {
this.exportAllState(arr, sub);
});
}
/**
* 导入工程数据
*/
public importProject(data: any) {
let paramMap: Map<string, ParamItem> = Editor.Inst.ParamCtr.getParamMap();
let mainStateMachineData = data.mainStateMachine;
let subStateMachinesData = data.subStateMachines;
let defaultStateData: string = data.defaultState;
let anyStateData = data.anyState;
let statesData = data.states;
let stateDataMap: Map<string, any> = new Map();
statesData.forEach((e: any) => { stateDataMap.set(e.state, e); });
let stateMap: Map<string, State> = new Map();
let subMachineDataMap: Map<string, any> = new Map();
subStateMachinesData.forEach((e: any) => { subMachineDataMap.set(e.name, e) });
let subMachineMap: Map<string, StateMachine> = new Map();
let main = this.MachineLayer.mainStateMachine;
main.setLayerPos(mainStateMachineData.layerPos[0], mainStateMachineData.layerPos[1]);
main.setLayerScale(mainStateMachineData.layerScale);
main.setAnyStatePos(mainStateMachineData.anyStatePos[0], mainStateMachineData.anyStatePos[1]);
this.importSubState(mainStateMachineData, main, stateDataMap, stateMap, paramMap);
this.importSubMachine(mainStateMachineData, main, subMachineDataMap, subMachineMap, stateDataMap, stateMap, paramMap);
if (stateMap.has(defaultStateData))
this.MachineLayer.defaultState = stateMap.get(defaultStateData);
this.importTransitions(anyStateData.transitions, this.MachineLayer.anyState.state, stateMap, paramMap);
statesData.forEach((e: any) => {
let state: State = stateMap.get(e.state);
if (!state) {
cc.error('error');
}
this.importTransitions(e.transitions, state, stateMap, paramMap);
});
this.MachineLayer.setCurStateMachine();
}
/**
* 导出工程数据
*/
public exportProject() {
let main = this.MachineLayer.mainStateMachine;
let animator = ANIMATOR_VERSION;
let mainStateMachine = {
layerPos: [main.layerPos.x, main.layerPos.y],
layerScale: main.layerScale,
anyStatePos: [main.anyStatePos.x, main.anyStatePos.y],
subStates: [],
subStateMachines: [],
};
main.subStates.forEach((e) => {
mainStateMachine.subStates.push(e.name);
});
main.subStateMachines.forEach((e) => {
mainStateMachine.subStateMachines.push(e.name);
});
let subStateMachines = [];
this.exportAllSubMachine(subStateMachines, main);
let defaultState: string = this.MachineLayer.defaultState ? this.MachineLayer.defaultState.name : '';
let anyState = {
transitions: this.MachineLayer.anyState.state.getAllTransitionData()
};
let states = [];
this.exportAllState(states, main);
return {
animator: animator,
mainStateMachine: mainStateMachine,
subStateMachines: subStateMachines,
defaultState: defaultState,
anyState: anyState,
states: states
};
}
/**
* 导出runtime数据
*/
public exportRuntimeData() {
let main = this.MachineLayer.mainStateMachine;
let defaultState: string = this.MachineLayer.defaultState ? this.MachineLayer.defaultState.name : '';
let anyState = {
transitions: this.MachineLayer.anyState.state.getAllTransitionData()
};
let states = [];
this.exportAllState(states, main, true);
return {
defaultState: defaultState,
anyState: anyState,
states: states
};
}
//#endregion
/**
* 按下鼠标左键的处理
*/
@@ -604,4 +401,253 @@ export default class FsmCtr extends cc.Component {
this.setCurStateMachine(stateMachine);
}
//#endregion
//#region import and export
private importTransitions(transitionsData: any[], state: State, stateMap: Map<string, State>, paramMap: Map<string, ParamItem>) {
transitionsData.forEach((e) => {
let toState: State = stateMap.get(e.toState);
let transition: Transition = state.addTransition(toState);
transition.hasExitTime = e.hasExitTime;
e.conditions.forEach((cData) => {
let paramItem = paramMap.get(cData.param);
let condition: Condition = transition.addCondition(paramItem);
condition.value = cData.value;
condition.logic = cData.logic;
});
});
}
private importSubState(upData: any, upMachine: StateMachine, stateDataMap: Map<string, any>, stateMap: Map<string, State>, paramMap: Map<string, ParamItem>) {
upData.subStates.forEach((name: string) => {
let state = new State(upMachine, false);
stateMap.set(name, state);
let data = stateDataMap.get(name);
state.setPosition(data.position[0], data.position[1]);
state.name = data.state;
state.motion = data.motion;
state.speed = data.speed;
state.multiplierParam = paramMap.get(data.multiplier) || null;
state.loop = data.loop;
upMachine.add(state);
});
}
private importSubMachine(upData: any, upMachine: StateMachine, subMachineDataMap: Map<string, any>, subMachineMap: Map<string, StateMachine>, stateDataMap: Map<string, any>, stateMap: Map<string, State>, paramMap: Map<string, ParamItem>) {
upData.subStateMachines.forEach((name: string) => {
let stateMachine = new StateMachine(upMachine);
subMachineMap.set(name, stateMachine);
let data = subMachineDataMap.get(name);
stateMachine.setLayerPos(data.layerPos[0], data.layerPos[1]);
stateMachine.setLayerScale(data.layerScale);
stateMachine.setAnyStatePos(data.anyStatePos[0], data.anyStatePos[1]);
stateMachine.name = data.name;
stateMachine.setPosition(data.position[0], data.position[1]);
stateMachine.setUpStateMachinePos(data.upStateMachinePos[0], data.upStateMachinePos[1]);
upMachine.add(stateMachine);
this.importSubState(data, stateMachine, stateDataMap, stateMap, paramMap);
this.importSubMachine(data, stateMachine, subMachineDataMap, subMachineMap, stateDataMap, stateMap, paramMap);
});
}
private exportAllSubMachine(arr: any[], stateMachine: StateMachine) {
stateMachine.subStateMachines.forEach((sub) => {
let data = {
layerPos: [sub.layerPos.x, sub.layerPos.y],
layerScale: sub.layerScale,
anyStatePos: [sub.anyStatePos.x, sub.anyStatePos.y],
name: sub.name,
position: [sub.position.x, sub.position.y],
upStateMachine: sub.upStateMachine.name,
upStateMachinePos: [sub.upStateMachinePos.x, sub.upStateMachinePos.y],
subStates: [],
subStateMachines: [],
}
sub.subStates.forEach((e) => {
data.subStates.push(e.name);
});
sub.subStateMachines.forEach((e) => {
data.subStateMachines.push(e.name);
});
arr.push(data);
this.exportAllSubMachine(arr, sub);
});
}
private exportAllState(arr: any[], stateMachine: StateMachine, isRuntimeData: boolean = false) {
stateMachine.subStates.forEach((e) => {
let data = null;
if (isRuntimeData) {
data = {
state: e.name,
motion: e.motion,
speed: e.speed,
multiplier: e.getMultiplierName(),
loop: e.loop,
transitions: e.getAllTransitionData()
}
} else {
data = {
position: [e.position.x, e.position.y],
upStateMachine: e.upStateMachine.name,
state: e.name,
motion: e.motion,
speed: e.speed,
multiplier: e.getMultiplierName(),
loop: e.loop,
transitions: e.getAllTransitionData()
}
}
arr.push(data);
});
stateMachine.subStateMachines.forEach((sub) => {
this.exportAllState(arr, sub);
});
}
/**
* 导入工程数据
*/
public importProject(data: any) {
let paramMap: Map<string, ParamItem> = Editor.Inst.Parameters.getParamMap();
let mainStateMachineData = data.mainStateMachine;
let subStateMachinesData = data.subStateMachines;
let defaultStateData: string = data.defaultState;
let anyStateData = data.anyState;
let statesData = data.states;
let stateDataMap: Map<string, any> = new Map();
statesData.forEach((e: any) => { stateDataMap.set(e.state, e); });
let stateMap: Map<string, State> = new Map();
let subMachineDataMap: Map<string, any> = new Map();
subStateMachinesData.forEach((e: any) => { subMachineDataMap.set(e.name, e) });
let subMachineMap: Map<string, StateMachine> = new Map();
let main = this.MachineLayer.mainStateMachine;
main.setLayerPos(mainStateMachineData.layerPos[0], mainStateMachineData.layerPos[1]);
main.setLayerScale(mainStateMachineData.layerScale);
main.setAnyStatePos(mainStateMachineData.anyStatePos[0], mainStateMachineData.anyStatePos[1]);
this.importSubState(mainStateMachineData, main, stateDataMap, stateMap, paramMap);
this.importSubMachine(mainStateMachineData, main, subMachineDataMap, subMachineMap, stateDataMap, stateMap, paramMap);
if (stateMap.has(defaultStateData))
this.MachineLayer.defaultState = stateMap.get(defaultStateData);
this.importTransitions(anyStateData.transitions, this.MachineLayer.anyState.state, stateMap, paramMap);
statesData.forEach((e: any) => {
let state: State = stateMap.get(e.state);
if (!state) {
cc.error('error');
}
this.importTransitions(e.transitions, state, stateMap, paramMap);
});
this.MachineLayer.setCurStateMachine();
}
/**
* 导入cocos animation文件
*/
public importAnim(animData: any) {
let x = Tool.randFloat(-this.MachineLayer.node.x - 100, -this.MachineLayer.node.x + 100);
let y = Tool.randFloat(-this.MachineLayer.node.y - 100, -this.MachineLayer.node.y + 100);
let unitState = this.MachineLayer.createState(cc.v2(x, y));
let state: State = unitState.state;
state.name = animData._name;
state.motion = animData._name;
state.speed = animData.speed;
state.loop = animData.wrapMode === cc.WrapMode.Loop;
}
/**
* 导入spine json文件
*/
public improtSpine(spineData: any) {
for (let name in spineData.animations) {
let x = Tool.randFloat(-this.MachineLayer.node.x - 100, -this.MachineLayer.node.x + 100);
let y = Tool.randFloat(-this.MachineLayer.node.y - 100, -this.MachineLayer.node.y + 100);
let unitState = this.MachineLayer.createState(cc.v2(x, y));
let state: State = unitState.state;
state.name = name;
state.motion = name;
}
}
/**
* 导入dragonbones json文件
*/
public importDragonBones(data: any) {
data.armature.forEach((e) => {
e.animation.forEach((anim) => {
let x = Tool.randFloat(-this.MachineLayer.node.x - 100, -this.MachineLayer.node.x + 100);
let y = Tool.randFloat(-this.MachineLayer.node.y - 100, -this.MachineLayer.node.y + 100);
let unitState = this.MachineLayer.createState(cc.v2(x, y));
let state: State = unitState.state;
state.name = anim.name;
state.motion = anim.name;
state.loop = anim.playTimes === 0;
});
});
}
/**
* 导出工程数据
*/
public exportProject() {
let main = this.MachineLayer.mainStateMachine;
let animator = ANIMATOR_VERSION;
let mainStateMachine = {
layerPos: [main.layerPos.x, main.layerPos.y],
layerScale: main.layerScale,
anyStatePos: [main.anyStatePos.x, main.anyStatePos.y],
subStates: [],
subStateMachines: [],
};
main.subStates.forEach((e) => {
mainStateMachine.subStates.push(e.name);
});
main.subStateMachines.forEach((e) => {
mainStateMachine.subStateMachines.push(e.name);
});
let subStateMachines = [];
this.exportAllSubMachine(subStateMachines, main);
let defaultState: string = this.MachineLayer.defaultState ? this.MachineLayer.defaultState.name : '';
let anyState = {
transitions: this.MachineLayer.anyState.state.getAllTransitionData()
};
let states = [];
this.exportAllState(states, main);
return {
animator: animator,
mainStateMachine: mainStateMachine,
subStateMachines: subStateMachines,
defaultState: defaultState,
anyState: anyState,
states: states
};
}
/**
* 导出runtime数据
*/
public exportRuntimeData() {
let main = this.MachineLayer.mainStateMachine;
let defaultState: string = this.MachineLayer.defaultState ? this.MachineLayer.defaultState.name : '';
let anyState = {
transitions: this.MachineLayer.anyState.state.getAllTransitionData()
};
let states = [];
this.exportAllState(states, main, true);
return {
defaultState: defaultState,
anyState: anyState,
states: states
};
}
//#endregion
}

13
animator-editor/assets/script/editor/fsm/MachineLayer.ts
View File

@@ -12,6 +12,9 @@ import UnitStateMachine from "./UnitStateMachine";
const { ccclass, property } = cc._decorator;
/** 状态机视图界面边长 */
const LEN = 9000;
@ccclass
export default class MachineLayer extends cc.Component {
@property(cc.Node) Grid: cc.Node = null;
@@ -36,11 +39,11 @@ export default class MachineLayer extends cc.Component {
private _upUnit: UnitStateMachine = null;
protected onLoad() {
this.node.setContentSize(6750, 6750);
this.Grid.setContentSize(6750, 6750);
this.node.setContentSize(LEN, LEN);
this.Grid.setContentSize(LEN, LEN);
this._mainStateMachine = new StateMachine(null);
this._curStateMachine = this._mainStateMachine;
this._anyState = this.createState(cc.v2(-360, 300), true);
this._anyState = this.createState(cc.v2(-300, 300), true);
this._curStateMachine.setAnyStatePos(this._anyState.node.position);
this.NavBar.refreshBar([this._mainStateMachine]);
@@ -121,7 +124,7 @@ export default class MachineLayer extends cc.Component {
node.destroy();
}
// 生成状态机、状态、连线节点
// 生成状态、状态机节点
let stateMap: Map<State, UnitState> = new Map();
let machineMap: Map<StateMachine, UnitStateMachine> = new Map();
this._upUnit && machineMap.set(stateMachine.upStateMachine, this._upUnit);
@@ -154,7 +157,7 @@ export default class MachineLayer extends cc.Component {
}
machineMap.set(e, unitStateMachine);
});
// 生成连线节点
let stateKeys = stateMap.keys();
for (let i = 0; i < stateMap.size; i++) {
let state: State = stateKeys.next().value;

5
animator-editor/assets/script/editor/fsm/NavBar.ts
View File

@@ -18,6 +18,7 @@ export default class NavBar extends cc.Component {
protected onLoad() {
this._widget = this.getComponent(cc.Widget);
this._contentWidget = this.Content.getComponent(cc.Widget);
this.onEventResize();
Events.targetOn(this);
}
@@ -43,8 +44,8 @@ export default class NavBar extends cc.Component {
}
@preloadEvent(EventName.RESIZE)
private onEventResize(node: cc.Node) {
this._widget.left = Editor.Inst.ParamCtr.node.width;
private onEventResize(node?: cc.Node) {
this._widget.left = Editor.Inst.Parameters.node.width;
this._widget.right = Editor.Inst.Inspector.node.width;
this._widget.updateAlignment();
this._contentWidget.updateAlignment();