AlphaMaskFilter-- Как разделить картинку на четыре части, чтобы добавить маску - PullRequest
0 голосов
/ 08 октября 2018

Разделите изображение на 4 частичные маски, но ширина не может быть отображена после 1/2 this.goodObjects - это массив изображений для отображения TimelineMax из библиотеки анимации зеленого носка

 let len = this.goodObjects.length
 let n = 4
 this.goodObjects.forEach((object, i) => {
  object.alpha = 0
  if (i !== len - 1) {
    let bound = this.goodObjects[i + 1].getBounds()
    let w = bound.width
    let h = bound.height
    for (let j = 0; j < n; j++) {
      let imgTween = new TimelineMax({ repeat: 1, repeatDelay: 1 })
      const tween = new TweenLine()
      let o = _.cloneDeep(this.goodObjects[i + 1])
      o.cache((w * j) / n, 0, w / n, h)
      o.filters = [
        new createjs.AlphaMaskFilter(o.cacheCanvas),
      ]
      let v = { w: (w * j) / n }
      imgTween.add(tween.to(v, 0.5, {
        w: (w * (j + 1)) / n,
        ease: Power0.easeNone,
        onUpdate: () => {
          object.alpha = 1
          o.cache((w * j) / n, 0, v.w, h)
          // o.updateCache()
          this.stage.addChild(o)
        },
      }))
    }
  }
})
...