12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485 |
- 'use strict';
- var _index = require('../index.js');
- var _index2 = _interopRequireDefault(_index);
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
- Component({
- properties: {
- width: {
- type: Number,
- value: 100
- },
- height: {
- type: Number,
- value: 100
- },
- path: {
- type: String,
- observer: function observer() {
- this.init();
- }
- },
- animationData: {
- type: Object,
- observer: function observer() {
- this.init();
- }
- },
- loop: {
- type: Boolean,
- value: true
- },
- autoplay: {
- type: Boolean,
- value: true
- }
- },
- ready: function ready() {
- this.init();
- },
- methods: {
- init: function init(animationData) {
- var width = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.properties.width;
- var height = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : this.properties.height;
- var data = animationData || this.properties.animationData;
- var dataPath = this.properties.path;
- if (!data && !dataPath) {
- return;
- }
- this.destory();
- var canvasContext = _index.api.createCanvasContext('lottie-canvas', this);
- canvasContext.canvas = {
- width: width,
- height: height
- };
- this.lottie = _index2.default.loadAnimation({
- renderer: 'canvas', // 只支持canvas
- loop: this.data.loop,
- autoplay: this.data.autoplay,
- animationData: data,
- path: dataPath,
- rendererSettings: {
- context: canvasContext,
- clearCanvas: true
- }
- });
- },
- destory: function destory() {
- if (this.lottie) {
- this.lottie.destroy();
- this.lottie = null;
- }
- }
- },
- detached: function detached() {
- this.destory();
- }
- });
|