跑通ts调试
This commit is contained in:
@@ -0,0 +1,38 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.Load = void 0;
|
||||
const React = require("react");
|
||||
const react_umg_1 = require("react-umg");
|
||||
const ui_components_1 = require("./ui-components");
|
||||
let SlotOfVerticalBox = {
|
||||
LayoutData: {
|
||||
Offsets: {
|
||||
Left: 120,
|
||||
Top: 120,
|
||||
Right: 480,
|
||||
Bottom: 80
|
||||
}
|
||||
}
|
||||
};
|
||||
class Hello extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
names: props.names,
|
||||
buttonTextureIndex: 0,
|
||||
};
|
||||
}
|
||||
render() {
|
||||
return (React.createElement(react_umg_1.CanvasPanel, null,
|
||||
React.createElement(react_umg_1.VerticalBox, { Slot: SlotOfVerticalBox },
|
||||
React.createElement(react_umg_1.HorizontalBox, null,
|
||||
React.createElement(react_umg_1.Button, { OnHovered: () => this.setState({ buttonTextureIndex: 1 }), OnUnhovered: () => this.setState({ buttonTextureIndex: 0 }) }, this.state.buttonTextureIndex == 0 ? 'normal' : 'hovered')),
|
||||
this.state.names.map((name, idx) => React.createElement(ui_components_1.StatusBar, { name: name, key: idx })))));
|
||||
}
|
||||
}
|
||||
function Load() {
|
||||
return react_umg_1.ReactUMG.render(React.createElement(Hello, { names: ["Health:", "Energy:"] }));
|
||||
}
|
||||
exports.Load = Load;
|
||||
;
|
||||
//# sourceMappingURL=index.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../TypeScript/ui/index.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,yCAAyH;AACzH,mDAAyC;AAUzC,IAAI,iBAAiB,GAAoB;IACrC,UAAU,EAAE;QACR,OAAO,EAAE;YACL,IAAI,EAAE,GAAG;YACT,GAAG,EAAE,GAAG;YACR,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,EAAE;SACb;KACJ;CACJ,CAAA;AAED,MAAM,KAAM,SAAQ,KAAK,CAAC,SAAuB;IAC7C,YAAY,KAAY;QACtB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACX,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,kBAAkB,EAAG,CAAC;SACvB,CAAC;IACJ,CAAC;IACD,MAAM;QACF,OAAO,CACH,oBAAC,uBAAW;YACR,oBAAC,uBAAW,IAAC,IAAI,EAAE,iBAAiB;gBAChC,oBAAC,yBAAa;oBACd,oBAAC,kBAAM,IAAC,SAAS,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,kBAAkB,EAAE,CAAC,EAAC,CAAC,EAAE,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,kBAAkB,EAAE,CAAC,EAAC,CAAC,IACrH,IAAI,CAAC,KAAK,CAAC,kBAAkB,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CACrD,CACO;gBACf,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,oBAAC,yBAAS,IAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC,CAC9D,CACJ,CACjB,CAAC;IACN,CAAC;CACJ;AAED,SAAgB,IAAI;IAChB,OAAO,oBAAQ,CAAC,MAAM,CAClB,oBAAC,KAAK,IAAC,KAAK,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,GAAG,CAC1C,CAAC;AACN,CAAC;AAJD,oBAIC;AAAA,CAAC"}
|
||||
@@ -0,0 +1,35 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.StatusBar = void 0;
|
||||
const React = require("react");
|
||||
const react_umg_1 = require("react-umg");
|
||||
let SlotOfProgressBar = {
|
||||
Size: {
|
||||
SizeRule: 1
|
||||
}
|
||||
};
|
||||
class StatusBar extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.onIncrement = () => this.setState({ percent: this.state.percent + 0.01 });
|
||||
this.onDecrement = () => this.setState({ percent: this.state.percent - 0.01 });
|
||||
if ((props.initialPercent || 0) < 0) {
|
||||
throw new Error('initialPercent < 0');
|
||||
}
|
||||
this.state = {
|
||||
percent: props.initialPercent || 0.5
|
||||
};
|
||||
}
|
||||
get color() {
|
||||
return { R: 1 - this.state.percent, G: 0, B: this.state.percent };
|
||||
}
|
||||
render() {
|
||||
return (React.createElement(react_umg_1.HorizontalBox, null,
|
||||
React.createElement(react_umg_1.TextBlock, { Text: `${this.props.name}(${this.state.percent.toFixed(2)})` }),
|
||||
React.createElement(react_umg_1.ProgressBar, { Percent: this.state.percent, Slot: SlotOfProgressBar, FillColorAndOpacity: this.color }),
|
||||
React.createElement(react_umg_1.Button, { OnClicked: this.onIncrement }, "+"),
|
||||
React.createElement(react_umg_1.Button, { OnClicked: this.onDecrement }, "-")));
|
||||
}
|
||||
}
|
||||
exports.StatusBar = StatusBar;
|
||||
//# sourceMappingURL=ui-components.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"ui-components.js","sourceRoot":"","sources":["../../../TypeScript/ui/ui-components.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,yCAA6F;AAY7F,IAAI,iBAAiB,GAAsB;IACvC,IAAI,EAAE;QACF,QAAQ,EAAE,CAAC;KACd;CACJ,CAAA;AAED,MAAa,SAAU,SAAQ,KAAK,CAAC,SAAuB;IACxD,YAAY,KAAY;QACtB,KAAK,CAAC,KAAK,CAAC,CAAC;QAef,gBAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,EAAC,CAAC,CAAC;QACxE,gBAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,EAAC,CAAC,CAAC;QAdtE,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;YACpC,MAAM,IAAI,KAAK,CAAC,oBAAoB,CAAC,CAAC;QACxC,CAAC;QAED,IAAI,CAAC,KAAK,GAAG;YACX,OAAO,EAAE,KAAK,CAAC,cAAc,IAAI,GAAG;SACrC,CAAC;IACJ,CAAC;IAED,IAAI,KAAK;QACL,OAAO,EAAC,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,EAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAC,CAAC;IACrE,CAAC;IAKD,MAAM;QACF,OAAO,CACH,oBAAC,yBAAa;YACV,oBAAC,qBAAS,IAAC,IAAI,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,GAAG;YAC1E,oBAAC,uBAAW,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,IAAI,CAAC,KAAK,GAAG;YACrG,oBAAC,kBAAM,IAAC,SAAS,EAAE,IAAI,CAAC,WAAW,QAAa;YAChD,oBAAC,kBAAM,IAAC,SAAS,EAAE,IAAI,CAAC,WAAW,QAAa,CACpC,CACnB,CAAC;IACN,CAAC;CACJ;AA9BD,8BA8BC"}
|
||||
Reference in New Issue
Block a user