AS3，AIR，像MadComponents一樣的Starling滑動面板

Question

我正在開發一個使用AS3/Air的應用程序，用於移動設備。我使用Feathers UI和Starling，但我想創建一個MadComponents附帶的面板幻燈片（菜單，信息面板等）。我正在考慮創建一個持有「面板」的類，將它導入到我的屏幕上並使用Greensock進行補間。

我的問題是：

1. 請問這是利用椋鳥和羽毛的最佳方式？
2. 我可以在Starling考慮使用MadComponents時使用Flash顯示器而不是Starling嗎？
3. 其他建議如何才能達到相同的結果？

基本上我只是想要一個按鈕，用戶點擊按鈕和屏幕補間左/右和'打開'信息面板。再次按下按鈕並關閉它。

非常感謝

Answer 1

如果我明白你所描述正確的是什麼，然後它聽起來像羽毛的ScreenNavigator類正是你所需要的東西嗎？

見ScreenNavigator API

而且羽毛組件瀏覽器使用的SlideNavigator在你所描述的相同方式的Demo。

Answer 2

它看起來像喬什Tynjala正在添加此功能羽毛：https://github.com/joshtynjala/feathers/issues/527

在此期間，我想同樣的事情，所以我就颳起這件事，我很高興與大家分享它（警告：尚未得到廣泛的測試）：

package com.hiddenachievement.space.components 
{ 
    import feathers.core.FeathersControl; 

    import starling.animation.Transitions; 
    import starling.animation.Tween; 
    import starling.core.Starling; 
    import starling.display.Sprite; 

    /** 
    * Creates a control that emerges from one side of the stage, while moving the main view to show it. 
    */ 

    public class EdgeSlideControl extends FeathersControl 
    { 
     private var _mainView:Sprite; 
     private var _open:Boolean; 
     protected var _tween:Tween; 
     protected var _side:int; 
     protected var _callback:Function; 
     protected var _uncover:Boolean; 

     static public const NORTH:int = 0; 
     static public const SOUTH:int = 1; 
     static public const EAST:int = 2; 
     static public const WEST:int = 3; 


     /** 
     * Creates an EdgeSlideControl. 
     * 
     * @param mainView The main view (possibly a ScreenNavigator) that will move to show the menu. 
     * @param side The side that the control will emerge from. 
     * @param uncover When true, the main view will slide away to uncover the control. When false, the control will slide in from the side, as the main view slides out of the way. 
     * 
     */ 
     public function EdgeSlideControl(mainView:Sprite, side:int, uncover:Boolean = true) 
     { 
      super(); 
      _mainView = mainView; 
      _side = side; 
      _uncover = uncover; 
     } 

     /** 
     * Implements the standard FeathersControl's initialize. 
     */ 
     override protected function initialize():void 
     { 
      _open = false; 
      visible = false; 
     } 

     /** 
     * Begin the animation to display the control. 
     */ 
     public function show(callback:Function=null):void 
     { 
      _callback = callback; 
      _tween = new Tween(_mainView, 0.2, Transitions.LINEAR); 
      _tween.onUpdate = updateSlide; 
      _tween.onComplete = slideComplete; 

      switch(_side) 
      { 
       case NORTH: 
        _tween.animate("y", height); 
        break; 
       case SOUTH: 
        _tween.animate("y", -width); 
        break; 
       case EAST: 
        _tween.animate("x", -height); 
        break; 
       case WEST: 
        _tween.animate("x", width); 
        break; 
      } 

      Starling.juggler.add(_tween); 
      _open = true; 
      visible = true; 
     } 

     /** 
     * Begin the animation to hide the control. 
     */  
     public function hide(callback:Function=null):void 
     { 
      _callback = callback; 
      _tween = new Tween(_mainView, 0.2, Transitions.LINEAR); 
      _tween.onUpdate = updateSlide; 
      _tween.onComplete = slideComplete; 

      switch(_side) 
      { 
       case NORTH: 
       case SOUTH: 
        _tween.animate("y", 0); 
        break; 
       case EAST: 
       case WEST: 
        _tween.animate("x", 0); 
        break; 
      } 

      Starling.juggler.add(_tween); 
      _open = false; 
     } 


     /** 
     * If the control is moving (not in "uncover" mode), move the control into place, next to the main view. 
     */   
     public function updateSlide():void 
     { 
      if (!_uncover) 
      { 
       switch(_side) 
       { 
        case NORTH: 
         y = _mainView.y - height; 
         break; 
        case SOUTH: 
         y = _mainView.height - _mainView.y; 
         break; 
        case EAST: 
         x = _mainView.width - _mainView.x; 
         break; 
        case WEST: 
         x = _mainView.x - width; 
         break; 
       } 
      } 
     } 


     /** 
     * Perform any actions needed after the transition is done animating. 
     */ 
     public function slideComplete():void 
     { 
      if (_callback != null) 
      { 
       _callback();  
      } 

      visible = _open; 
     } 

     public function get isOpen():Boolean 
     { 
      return _open; 
     } 

    } 
} 

您可能需要一個明確的尺寸增加了分量，在滑動的方向，如果它的未來爲零。否則，使用應該非常簡單。讓我知道你是否需要關於如何使用它的更多指導。