純粋にFlexのスキンで、レイアウトを純粋にMXMLとスタイルで保持する方法はありますか？

Question

私はFlex 4でいくつかのMVCスタイルのUIコンポーネントを実装しようとしています。各要素のビジュアルセットアップ（および後で実行時の変更）をさらに分離する必要があります。私はIDとセットのプロパティを参照することができるようにしたい、

<s:Group id="container"> 
    <s:VGroup> 
     <s:HGroup id="titleGroup"> 
      <s:Label id="titleText" /> 
      <s:Button id="closeButton" /> 
     </s:HGroup> 
     <s:HGroup id="contentGroup"> 
      <s:VGroup id="interactionGroup"> 
       <s:VGroup id="messageGroup" /> 
       <s:HGroup id="actionGroup" /> 
      </s:VGroup> 
     </s:HGroup> 
    </s:VGroup> 
</s:Group> 

とスキンファイルに：主に、私はスキンを使用しますMXMLファイルで、このようなようなデータの全体的なレイアウトを維持したいです（「コンテナ」グループの幅や高さなど）、それらの中にグラフィック要素を含めることができます（「コンテナ」グループ内の塗りつぶしされた矩形など）。私はこれを宣言的にしたいのですが、プログラムではなく、そうでなければMXMLを最初に使うのはなぜですか？これは、HTML/CSSが分割される方法です.HTMLには、データが他のデータとの相対的なものであり、CSSにはすべてのプロパティとビジュアルスタイルが含まれています。

それが今であるので、私の肌は次のようになります。

<s:Group id="container" verticalCenter="0" horizontalCenter="0"> 
    <s:Rect id="background" width="100%" height="100%" radiusX="10" radiusY="10"> 
     <s:filters> 
      <s:DropShadowFilter blurX="20" blurY="20" alpha="0.32" distance="5" angle="90" /> 
     </s:filters> 
     <s:fill> 
      <s:SolidColor color="#ffffff" /> 
     </s:fill> 
    </s:Rect> 

    <s:VGroup width="100%" height="100%" gap="3" paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10"> 
     <s:HGroup id="titleGroup" width="100%" verticalAlign="middle"> 
      <s:Label id="titleText" width="100%" /> 
      <s:Button id="closeButton" /> 
     </s:HGroup> 
     <s:HGroup id="contentGroup" width="100%"> 
      <s:VGroup id="interactionGroup" width="100%"> 
       <s:VGroup id="messageGroup" width="100%" /> 
       <s:HGroup id="actionGroup" width="100%" /> 
      </s:VGroup> 
     </s:HGroup> 
    </s:VGroup> 
</s:Group> 

そして、このスキンを使用して、実際のコンポーネントがSkinPart宣言以外の何ものでもありません：あなたが見ることができるように

<fx:Script> 
    <![CDATA[ 
     import spark.components.Label; 
     import spark.components.Button; 
     import spark.components.Group; 

     [SkinPart(required="true")] 
     public var titleText:Label; 

     [SkinPart(required="true")] 
     public var closeButton:Button 

     [SkinPart(required="true")] 
     public var messageGroup:Group; 

     [SkinPart(required="true")] 
     public var actionGroup:Group; 
    ]]> 
</fx:Script> 

は、スキンにはコンポーネントに関するすべての情報が含まれているため、スタイルとコンテンツを分ける感覚に違反します。 using要素には、プログラムによる変更の場合はSkinへのインタフェースを除いて何もありません。現在のソリューションでは、スキンを使用しない場合よりも利点はありませんが、スキンを簡単に切り替える処理は例外です。

私がFlex 4で提案したことを行う方法はありますか？

Answer 1

答えは、Flexがこのように動作しないということです。レイアウトとビジュアルスタイルは不可分の関係にあるように見えます。この質問を終わらせる。