这是什么导致了该卡片尺寸的变化？【视频和代码】。

Question

我正在使用Starling（Action Script 3）编写一个桌游。我使用的Starling版本有一个名为Sprite3D的类，它使我可以方便地编写翻转卡牌的代码。但当我翻转卡片时，卡片的尺寸发生了变化，我无法找到问题的源头。

感谢您提供任何帮助。

您可以在这个YouTube视频中查看问题。

完整的代码可在GitHub上的此页面上查看。

接下来我将提供更详细的信息...以下所有信息均在视频中介绍。

Card类不包含任何视觉信息，它是一个控制器类。它有两个精灵。一个精灵填充正面，另一个精灵填充背面。Card类还应用了一个遮罩和尺寸属性，以确保正反面大小和形状相同。

Card类还包含动画代码。该代码与Starling博客中的视频非常相似，该视频展示了如何快速轻松地在2D游戏Memory中使用Stage3D。 Card类通过使用缓动来更改卡的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类都是从CardFace类派生而来的。CardFace类接受一张卡牌作为引用，并设置一个与卡牌遮罩大小和形状相等的遮罩。这可能是多余的，因为卡牌的遮罩应该遮盖所有子DisplayObject，但我们仍然这样做。

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

FrontFace不执行任何操作。它被子类化为具有特定行为的类，并将数据对象转换为显示布局。

在这种情况下，我们使用ProfileFrontFace将FrontFace进行子类化。ProfileFrontFace接受卡片对象和个人资料数据对象作为构造函数参数。通过super()调用将卡片对象传递给CardFace，并保存个人资料对象以供以后使用。

当ProfileFrontFace添加到舞台上时，该类会从个人资料数据对象中提取标题、收入和支出。它为每个项目创建文本字段。它还计算现金流并创建此值的文本字段。使用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对象上无法正常工作的情况吗？

Tween.animate()方法可能会导致什么奇怪的行为，当Tween用于更改对象的“rotationY”值时？

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

- Jared Clemence

Answer 1

已修复！！！我找到问题所在了！

我发现问题并不在正面。我给卡片本身（即Sprite3D对象）应用了一个遮罩，这个遮罩导致了问题。当我将其删除后，背面（一个Sprite对象）扩展到与正面相同的大小，现在当我设置卡片尺寸时，两个面都具有相等的尺寸。

我已将卡片尺寸更新为400x250，以匹配原始的背面布局，现在一切都运作良好。

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

- Jared Clemence