@turbox3d/graphic-component-pixi
Version:
Graphic component library based on pixi
105 lines • 4.14 kB
JavaScript
import _readOnlyError from "@babel/runtime/helpers/esm/readOnlyError";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/esm/inherits";
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
import * as PIXI from 'pixi.js';
import { Mesh2D } from '@turbox3d/renderer-pixi';
/** UI组件-文字 */
var Text2d = /*#__PURE__*/function (_Mesh2D) {
function Text2d() {
var _this;
_classCallCheck(this, Text2d);
_this = _callSuper(this, Text2d, arguments);
_this.view = new PIXI.Text('');
_this.reactivePipeLine = [_this.updateGeometry, _this.updateMaterial, _this.updatePosition, _this.updateRotation, _this.updateScale];
return _this;
}
_inherits(Text2d, _Mesh2D);
return _createClass(Text2d, [{
key: "updateGeometry",
value: function updateGeometry() {
var _this$props = this.props,
text = _this$props.text,
style = _this$props.style,
width = _this$props.width,
height = _this$props.height;
this.view.text = text;
this.view.style = style ? new PIXI.TextStyle(style) : new PIXI.TextStyle({
fontSize: 16,
fontFamily: 'Arial'
});
if (width) {
this.view.width = width;
}
if (height) {
this.view.height = height;
}
}
}, {
key: "updateMaterial",
value: function updateMaterial() {
var _this$props$zIndex = this.props.zIndex,
zIndex = _this$props$zIndex === void 0 ? 0 : _this$props$zIndex;
this.view.zIndex = zIndex;
}
}, {
key: "updatePosition",
value: function updatePosition() {
var _this$props2 = this.props,
_this$props2$x = _this$props2.x,
x = _this$props2$x === void 0 ? 0 : _this$props2$x,
_this$props2$y = _this$props2.y,
y = _this$props2$y === void 0 ? 0 : _this$props2$y,
_this$props2$central = _this$props2.central,
central = _this$props2$central === void 0 ? false : _this$props2$central;
var _ref = central ? [x - this.view.width / 2, y - this.view.height / 2] : [x, y],
_ref2 = _slicedToArray(_ref, 2),
posX = _ref2[0],
posY = _ref2[1];
this.view.position.x = posX;
this.view.position.y = posY;
}
}, {
key: "updateRotation",
value: function updateRotation() {
var _a;
this.view.rotation = (_a = this.props.rotation) !== null && _a !== void 0 ? _a : 0;
}
}, {
key: "updateScale",
value: function updateScale() {
var _a, _b, _c, _d;
this.view.scale.set((_b = (_a = this.props.scale) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : 1, (_d = (_c = this.props.scale) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : 1);
}
}, {
key: "getBounds",
value: function getBounds() {
var getBounds = this.props.getBounds;
if (getBounds) {
var _this$view$getLocalBo = this.view.getLocalBounds(),
width = _this$view$getLocalBo.width,
height = _this$view$getLocalBo.height;
getBounds({
x: width,
y: height
});
}
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
this.getBounds();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
this.getBounds();
}
}]);
}(Mesh2D);
export { Text2d as default };