是什么导致这张卡改变尺寸？ [视频&代码]

Question

我正在用 Starling (Action Script 3) 编写棋盘游戏。我正在使用的 Starling 版本有一个名为 Sprite3D 的 class，它使我可以方便、轻松地编写本游戏中使用的纸牌翻转的代码。我很苦恼我的卡片在翻转时改变了尺寸，我找不到改变的来源。

感谢所有帮助。

问题可以在this youtube video上查看。

可以在 github 的 this github page 上查看完整代码。

我会在这里继续详细介绍...以下所有信息都包含在视频中。

卡片class不包含视觉信息。它是一个控制器 class。它确实有两个精灵。一个精灵填充正面，另一个精灵填充背面。卡片 class 还应用了蒙版和尺寸属性，以便面的大小和形状相同。

卡片class也保存着动画代码。为卡片设置动画的代码与在 Starling 博客上找到的视频中使用的代码非常相似，该视频展示了如何使用 Stage3D 快速轻松地在 2D 记忆游戏中实现。卡片 class 通过使用补间将卡片的 rotationY 属性从 0 更改为 PI 以及在触摸事件中从 PI 更改为 0 来动画旋转。翻转过程中出现错误，所以我将翻转代码包含在这里：

public function flip() : void {
    _state = !(this._state);
    if( this.animations ){
        var tween : starling.animation.Tween = new Tween( this, 2, starling.animation.Transitions.EASE_OUT_BOUNCE );
        var card : Card = this;
        var didFlip : Boolean = false;
        tween.animate("rotationY", this._state == Card.FACE_UP ? Math.PI : 0 );
        tween.onUpdate = updateVisibility;
        Starling.juggler.add( tween );
    }
}
private function updateVisibility():void
{
    var sHelper:Vector3D = new Vector3D();
    var card : Card = this;
    stage.getCameraPosition( card, sHelper );
    if( sHelper ){
        this._front_face.visible = sHelper.z < 0;
        this._back_face.visible = sHelper.z >= 0;
    }
}

FrontFace 和 BackFace classes 都派生自 class CardFace。 CardFace class 以卡片作为参考，并设置与卡片掩码的大小和形状相等的掩码。这可能是多余的，因为卡片的掩码应该屏蔽所有 children DisplayObjects，但我们还是这样做了。

BackFace 有文本、徽标、纹理和颜色。

FrontFace 什么都不做。它具有特定行为class，并将数据object转换为显示布局。

在这种情况下，我们使用 ProfileFrontFace 子classing FrontFace。 ProfileFrontFace 将卡片 object 和个人资料数据 object 作为构造函数参数。卡片 object 通过 super() 调用传递给 CardFace，并保存配置文件 object 供以后使用。

当 ProfileFrontFace 添加到舞台时，class 从个人资料数据中提取标题、收入和支出 object。它为每个项目创建文本字段。它还计算现金流量并为此值创建一个文本字段。背景是使用 PNG 纹理创建的，它是一个简单的白色正方形，在卡片尺寸的整个表面上拉伸。在这个白色方块上，我们应用颜色纹理。创建后，背景图像不会改变。代码出现如下：

//we remove the event listener so this function code is only executed once
this.removeEventListener( Event.ADDED_TO_STAGE, onAddedToStage );
var width : int = this.cardWidth; /* 400 */
var height : int = this.cardHeight; /* 300 */
var bg : Image = new Image( Game.assets.getTexture("blank") );
/* start the background in the top left */
bg.x = 0;
bg.y = 0;
/* have the background fill the card dimension space */
bg.width = width;
bg.height = height;
/* apply a color so that the background is not pure white */
bg.color = ColorScheme.OPAL;
/* add the background to the stage */
this.addChild( bg );

在函数的其余部分，我们创建文本并显示它。为简单起见，我不在此处包含该代码。在测试中，我删除了该代码，发现它对翻转到正面时改变卡片尺寸的特殊行为没有影响。

有没有人见过Sprite3D上的蒙版不能作为蒙版执行的情况？

有没有人见过遮罩无法在常规 Sprite 上执行的情况object？

当使用 Tween 更改 object 上 "rotationY" 的值时，Tween.animate() 方法可能会导致奇怪的行为？

任何和所有答案都会有所帮助。谢谢！

Answer 1

已修复！！！！！！我找到了！

我发现问题不是前脸。我对卡片本身应用了一个遮罩，它是 Sprite3D 对象。那个面具引起了问题。当我删除它时，BackFace（一个 Sprite 对象）扩展到与正面相同的大小，现在当我设置卡片尺寸时，两个面具有相同的大小。

我已将卡片尺寸更新为 400x250 以匹配原始背面布局，现在一切正常。

提示：尽可能在 Sprite 对象而不是 Sprite3D 对象上设置遮罩。这样可以保持对 2D 对象的 2D 操作。

是什么导致这张卡改变尺寸？ [视频&代码]

What is causing this card to change dimensions? [Video & Code]

sprite

actionscript-3

starling-framework