Material 在 Actionscript 3.0 中设计 UI(高级动画)?

Material Design UI (advanced animation) in Actionscript 3.0?

在 android 的动画上实现这个 heavy 的最佳方法是什么? (投影、缓动等)

我找到了一种获得这种效果的简单方法;通过在 'AppContainer' class 的时间轴中使用补间动画为我的 UI 设置动画,然后按如下方式设置我的文档 class:

package  {

    import flash.display.MovieClip;
    import flash.display.Stage;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;

    public class Groot extends MovieClip {

        public var appContainer = new AppContainer;


    public function Groot() {

            stage.scaleMode = StageScaleMode.SHOW_ALL;
            stage.align = StageAlign.TOP_LEFT;          
            appContainer.width = stage.stageWidth;
            appContainer.height = stage.stageHeight;
            addChild(appContainer);         
        }

}
}

从那里开始,它只是事件侦听器和 gotoAndPlay/Stop() 的问题;命令。但是,如果我不想在 'wrong' 纵横比上添加边框,我将不得不使用:

StageScaleMode.EXACT_FIT

以及相对对象定位。 (除了需要的所有复杂动画之外,这本身并不是一个大问题)。这种排除了任何时间线的工作,这就是我无能为力的地方。

现在,我 能够设置一个 class 来使用这样的方法相当容易地处理相对定位:

package  {

    import flash.display.MovieClip;
    import flash.display.Stage;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;

    public class Groot extends MovieClip {

        var pos = new PositionHandler();
        var appContainer = new AppContainer;

    public function Groot() {

            stage.scaleMode = StageScaleMode.SHOW_ALL;
            stage.align = StageAlign.TOP_LEFT;          
            pos.startPos(appContainer)
            addChild(appContainer);         
        }

}
}

用一个class来处理各种相对位置函数:

package  {
    import flash.display.MovieClip;
    import flash.display.Stage;
    import flash.display.StageAlign;

    public class PositionHandler {

        public function PositionHandler() {
            // constructor code
        }
        public function startPos(obj:MovieClip):void {
            obj.width = stage.stageWidth;
            obj.height = stage.stageHeight;
        }

    }

}

如果我想静态定位 UI 组件,但要动态设置它们的动画,从一个相对位置移动到另一个相对位置,这一切都很好吗?从一个自定义class 不少?我不知道...(更不用说动画投影/潜在的形状变化/颜色擦拭等)任何帮助将不胜感激!

谢谢!

Flash 并不真正支持 'relative' 开箱即用的大小调整和定位。但是没有理由不能扩展它来为您提供这种行为。

虽然这有点困难,因为它基本上归结为编写布局框架。但是你可以做一些更脏的事情。

起点可以是扩展 Sprite,然后覆盖它 width/height getters/setters。您可以定义自己的逻辑来响应您认为 'width' 和 'height' 的意思,而不是让 Flash 为您缩放 Sprite。

那么你可以提供 'proportionalWidth' 和 'proportionalHeight' getters/setters.

functionCalledFrameAfterAnyLayoutValuesChanged()
{
    if ( proportionalWidth is defined )
        widthToLayoutTo = proportionalWidth  * parent.width;
    else
        widthToLayoutTo = width;

    if ( proportionalHeight is defined )
        heightToLayoutTo = proportionalHeight * parent.height;
    else
        heightToLayoutTo = height;

    // Perform whatever logic you need to make your Sprite scaled to widthToLayoutTo / heightToLayoutTo 
    ...
}

可以用 'proportionalX' 和 'proportionalY' 做类似的事情来获得相对定位。

您可以构建一个组件包来扩展这个 class,覆盖每个组件的定制内容。

然后您可以自由地以任何您喜欢的方式补间这些 'relative' 属性。我建议使用像 GTween 这样的库。 http://www.gskinner.com/libraries/gtween/