取消狀態轉換並直接轉到另一個視圖

我有一個3狀態的皮膚。未來我可能會有更多的州。但它是一個正常狀態的工具欄，然後是一次只能顯示一個展開視圖的展開視圖。取消狀態轉換並直接轉到另一個視圖

當我有兩種狀態時，我可以使用下面的轉換代碼輕鬆地在兩者之間切換。但是現在我有三個州，次要州沒有關閉。如果我處於第二狀態，我想先關閉它。

這裏是從皮膚類我的代碼：

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"> 

    <fx:Script> 
     <![CDATA[ 
      protected function imageViewButton_clickHandler(event:MouseEvent):void 
      { 

       if (currentState==NORMAL_VIEW) { 
        currentState = IMAGE_VIEW; 
       } 
       else { 
        currentState = NORMAL_VIEW; 
       } 
      } 

      protected function linkViewButton_clickHandler(event:MouseEvent):void 
      { 
       if (currentState==NORMAL_VIEW) { 
        currentState = LINK_VIEW; 
       } 
       else { 
        currentState = NORMAL_VIEW; 
       } 
      } 

      public static var NORMAL_VIEW:String = "normal"; 
      public static var LINK_VIEW:String = "linkView"; 
      public static var IMAGE_VIEW:String = "imageView"; 
     ]]> 
    </fx:Script> 


    <s:transitions> 
     <s:Transition fromState="normal" toState="*"> 
      <s:Sequence duration="250"> 
       <s:Resize target="{this}"/> 
       <s:AddAction target="{linkViewButton}"/> 
       <s:Fade target="{linkViewButton}"/> 
      </s:Sequence> 
     </s:Transition> 

     <s:Transition fromState="linkView" toState="*"> 
      <s:Sequence duration="250"> 
       <s:Fade target="{linkViewButton}"/> 
       <s:Resize target="{this}"/> 
      </s:Sequence> 
     </s:Transition> 

     <s:Transition fromState="imageView" toState="*"> 
      <s:Sequence duration="250"> 
       <s:Fade target="{imageViewButton}"/> 
       <s:Resize target="{this}"/> 
      </s:Sequence> 
     </s:Transition> 
    </s:transitions> 

    <s:states> 
     <s:State name="normal"/> 
     <s:State name="linkView"/> 
     <s:State name="imageView"/> 
    </s:states> 


    <s:VGroup width="100%"> 
     <s:HGroup width="100%" >  
      <s:Button label="Button 1" /> 
      <s:Line height="100%"> 
       <s:stroke> 
        <s:SolidColorStroke color="#B3C2B8"/> 
       </s:stroke> 
      </s:Line> 
      <s:ToggleButton id="gotoLinkView" label="Link Details" click="linkViewButton_clickHandler(event)"/> 
      <s:Line height="100%"> 
       <s:stroke> 
        <s:SolidColorStroke color="#B3C2B8"/> 
       </s:stroke> 
      </s:Line> 
      <s:ToggleButton id="gotoImageView" label="Image Details" click="imageViewButton_clickHandler(event)"/> 
      <s:Line height="100%"> 
       <s:stroke> 
        <s:SolidColorStroke color="#B3C2B8"/> 
       </s:stroke> 
      </s:Line> 
     </s:HGroup> 

     <s:Button id="linkViewButton" label="Link View" 
        includeIn="linkView" 
        itemCreationPolicy="immediate" width="100%"/> 

     <s:Button id="imageViewButton" label="Image View" 
        includeIn="imageView" 
        itemCreationPolicy="immediate" 
        width="100%"/> 
    </s:VGroup> 
</s:WindowedApplication>

來源

2016-10-26 1.21 gigawatts

下面是多個狀態之間轉換的完整示例，您可以在這些狀態中打開狀態，並且希望保留轉換動畫或在轉換到另一個打開狀態之前將它們從打開狀態中取消。感謝@Vesper對於邏輯錯誤的理解。

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" 
         applicationComplete="windowedapplication1_applicationCompleteHandler(event)" 
         stateChangeComplete="windowedapplication1_stateChangeCompleteHandler(event)"> 

    <fx:Script> 
     <![CDATA[ 
      import mx.events.FlexEvent; 

      public static var NORMAL_VIEW:String = "normal"; 
      public static var LINK_VIEW:String = "linkView"; 
      public static var IMAGE_VIEW:String = "imageView"; 

      public var deferredState:String; 
      public var deferredToggle:Object; 

      protected function linkViewButton_clickHandler(event:MouseEvent):void 
      { 
       if (currentState!=LINK_VIEW) { 
        if (currentState != NORMAL_VIEW) { 
         deferredState = LINK_VIEW; 
         currentState = NORMAL_VIEW; 
         deferredToggle = event.currentTarget; 
         deselectToggles(deferredToggle); 
         return; 
        } 

        currentState = LINK_VIEW; 
       } 
       else { 
        currentState = NORMAL_VIEW; 
       } 
      } 

      protected function imageViewButton_clickHandler(event:MouseEvent):void 
      { 

       if (currentState!=IMAGE_VIEW) { 
        if (currentState != NORMAL_VIEW) { 
         deferredState = IMAGE_VIEW; 
         currentState = NORMAL_VIEW; 
         deferredToggle = event.currentTarget; 
         deselectToggles(deferredToggle); 
         return; 
        } 

        currentState = IMAGE_VIEW; 
       } 
       else { 
        currentState = NORMAL_VIEW; 
       } 
      } 

      protected function windowedapplication1_stateChangeCompleteHandler(event:FlexEvent):void 
      { 
       //trace("State change complete"); 

       if (currentState==NORMAL_VIEW) { 
        //trace("Normal state"); 
       } 

       if (deferredState!=null) { 
        currentState = deferredState; 
        deferredState = null; 
        deferredToggle = null; 
       } 
      } 

      public function deselectToggles(selectedToggle:Object=null):void { 
       var toggle:ToggleButton; 

       for (var i:int = 0; i < toggles.length; i++) 
       { 
        toggle = toggles[i] as ToggleButton; 

        if (toggle!=selectedToggle) { 
         toggle.selected = false; 
        } 
       } 

      } 

      protected function windowedapplication1_applicationCompleteHandler(event:FlexEvent):void 
      { 
       toggles.push(gotoLinkView, gotoImageView); 
      } 

      public var toggles:Array = []; 
     ]]> 
    </fx:Script> 


    <s:transitions> 
     <s:Transition fromState="normal" toState="linkView" interruptionBehavior="stop" autoReverse="true"> 
      <s:Sequence duration="250" 
         effectStart="trace('normal to link view')" 
         > 
       <s:Resize target="{borderContainer}"/> 
       <s:AddAction target="{linkViewButton}"/> 
       <s:Fade target="{linkViewButton}"/> 
      </s:Sequence> 
     </s:Transition> 

     <s:Transition fromState="normal" toState="imageView" interruptionBehavior="stop" autoReverse="true"> 
      <s:Sequence duration="250" 
         effectStart="trace('normal to image view')" 
         > 
       <s:Resize target="{borderContainer}"/> 
       <s:AddAction target="{imageViewButton}"/> 
       <s:Fade target="{imageViewButton}"/> 
      </s:Sequence> 
     </s:Transition> 

    </s:transitions> 

    <s:states> 
     <s:State name="normal"/> 
     <s:State name="linkView"/> 
     <s:State name="imageView"/> 
    </s:states> 


    <s:BorderContainer width="100%" id="borderContainer"> 
     <s:layout> 
      <s:VerticalLayout/> 
     </s:layout> 
     <s:HGroup width="100%" >  
      <s:Button label="Button 1" /> 
      <s:Line height="100%"> 
       <s:stroke> 
        <s:SolidColorStroke color="#B3C2B8"/> 
       </s:stroke> 
      </s:Line> 
      <s:ToggleButton id="gotoLinkView" label="Link Details" click="linkViewButton_clickHandler(event)"/> 
      <s:Line height="100%"> 
       <s:stroke> 
        <s:SolidColorStroke color="#B3C2B8"/> 
       </s:stroke> 
      </s:Line> 
      <s:ToggleButton id="gotoImageView" label="Image Details" click="imageViewButton_clickHandler(event)"/> 
      <s:Line height="100%"> 
       <s:stroke> 
        <s:SolidColorStroke color="#B3C2B8"/> 
       </s:stroke> 
      </s:Line> 
     </s:HGroup> 

     <s:Button id="linkViewButton" 
        label="Link View" 
        height="100" 
        includeIn="linkView" 
        itemCreationPolicy="immediate" width="100%"/> 

     <s:Button id="imageViewButton" 
        height="100" 
        label="Image View" 
        includeIn="imageView" 
        itemCreationPolicy="immediate" 
        width="100%"/> 
    </s:BorderContainer> 
</s:WindowedApplication>

來源

2016-10-30 23:44:31

檢測到一個簡單的邏輯錯誤。你的代碼應該知道所有的按鈕（如果按下/釋放時它們的狀態是有效的），或者使每個按鈕只知道它自己的狀態並且不受其他代碼的影響。用你的方法，我說你應該做第二個變體。

 protected function imageViewButton_clickHandler(event:MouseEvent):void 
     { 

      if (currentState!=IMAGE_VIEW) { 
       currentState = IMAGE_VIEW; 
      } 
      else { 
       currentState = NORMAL_VIEW; 
      } 
     } 

     protected function linkViewButton_clickHandler(event:MouseEvent):void 
     { 
      if (currentState!=LINK_VIEW) { 
       currentState = LINK_VIEW; 
      } 
      else { 
       currentState = NORMAL_VIEW; 
      } 
     }

你不應該假設你的「皮膚」是NORMAL_VIEW狀態，而是檢查每個按鈕的期望狀態，切換到如果不是有必要，並更改爲預定義的正常狀態（可以是每個按鈕不同，如果你已經處於理想的狀態，你應該需要，但最好保持正常）。

來源

2016-10-26 01:36:11 Vesper

取消狀態轉換並直接轉到另一個視圖

回答

相關問題