1

考虑 和 的两个Collection Grid片段Layer with Click Animation。下面只会给最后一个网格项（3:3位置的图层）添加一个动画监听器：

rows = 3
cols = 3

gutter = 16
width  = 96
height = 96

for rowIndex in [0..rows-1]
    for colIndex in [0..cols-1]

        cellLayer = new Layer
            width:  width
            height: height
            x: colIndex * (width + gutter)
            y: rowIndex * (height + gutter)

        Utils.labelLayer cellLayer, "#{rowIndex}:#{colIndex}"

        cellLayer.on Events.Click, ->
            cellLayer.animate
                properties:
                    scale: 1.4
                curve: "spring"

如何在for循环中单独命名图层以应用动画？

类似的东西cellLayer[rowIndex][colIndex] = new Layer是理想的，但不起作用。

4

2 回答 2

1

tl;博士

它可以简单地使用do这样的关键字来解决：

do (cellLayer) -> 
  cellLayer.on Events.Click, ->
    cellLayer.animate
      properties: scale: 1.4
      curve: "spring"

当使用 JavaScript 循环生成函数时，通常会插入一个闭包包装器，以确保循环变量是封闭的，并且所有生成的函数不只是共享最终值。CoffeeScript 提供了“do”关键字，它立即调用传递的函数，转发任何参数。

从技术上讲，您必须使每个范围cellLayer都cellLayer处于循环范围内。在 CoffeeScript 中，提供了一个语法糖do关键字。只需do输入代码，然后使用 IIFE 自动生成范围。如果您对 JavaScript 有所了解，转译代码可以帮助您。

于 2014-08-29T08:30:22.263 回答
1

另请注意，我将单击的图层作为第二个参数添加到您的处理程序：

 cellLayer.on Events.Click, (event, clickedLayer) ->
        clickedLayer.animate
            properties:
                scale: 1.4
            curve: "spring"
于 2014-08-29T11:02:37.263 回答