與flex 4.6中的子視圖的父視圖類似嗎？

Question

有沒有什麼辦法在flex中用子視圖系統創建父視圖？例如，我需要創建一個計算不同產品保險費率的應用程序。所有產品需要具有相同的性別，年齡和尼古丁用量。我想要做的是有一個「父視圖」（實際上不會顯示），它包含所有這些基本字段，然後創建子視圖，自動顯示父視圖的組件和佈局，削減重複的代碼。子視圖將具有產品獨有的附加組件（某些還需要接收多個子項等），並以不同方式計算費率。

編輯：比方說，我有2個不同的產品。 ProdA和ProdB

這是ProdA

視圖

<?xml version="1.0" encoding="utf-8"?> 
<components:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" xmlns:components="spark.components.*" title="ProdA" 
      xmlns:mx="library://ns.adobe.com/flex/mx"> 
<fx:Declarations> 
    <!-- Place non-visual elements (e.g., services, value objects) here --> 
</fx:Declarations> 

<fx:Script> 
    <![CDATA[ 

     import ASClasses.LL; 

     public function makeLL(age:String, gen:String, nic:String):void{ 
      var intAge:int=int(age); 
      var newLL:LL=new LL(intAge, gen, nic); 
      dest.text=String(newLL.computeRate()); 
     } 

    ]]> 
</fx:Script> 

<s:VGroup width="100%" height="100%" verticalAlign="middle" horizontalAlign="center"> 

     <s:Label text="Age:"/> 
     <s:TextInput id="age" restrict="0-9" maxChars="2"/> 

     <s:ComboBox id="GenderBox" width="140" prompt="Gender" > 
      <s:dataProvider> 
       <mx:ArrayList> 
        <fx:String>Male</fx:String> 
        <fx:String>Female</fx:String> 
       </mx:ArrayList> 
      </s:dataProvider> 
     </s:ComboBox> 

     <s:Label text="The selected gender is: {GenderBox.selectedItem}"/> 

     <s:ComboBox id="NicotineBox" width="140" prompt="Nicotine Usage"> 
      <s:dataProvider> 
       <mx:ArrayList> 
        <fx:String>Smoker</fx:String> 
        <fx:String>Non-Smoker</fx:String> 
       </mx:ArrayList> 
      </s:dataProvider> 
     </s:ComboBox> 

     <s:Label text="The selected Nicotine is: {NicotineBox.selectedItem}"/> 

     <s:Button label="Get Rate" click="makeLL(age.text, GenderBox.selectedItem, NicotineBox.selectedItem)" /> 
     <s:TextInput id="dest" />  
    <s:Button label="Back" click="navigator.popView()" styleName="back" /> 
</s:VGroup> 

這是ProdB

<?xml version="1.0" encoding="utf-8"?> 
<components:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" xmlns:components="spark.components.*" title="ProdB" 
      xmlns:mx="library://ns.adobe.com/flex/mx"> 
<fx:Declarations> 
    <!-- Place non-visual elements (e.g., services, value objects) here --> 
</fx:Declarations> 

<fx:Script> 
    <![CDATA[ 
     import ASClasses.OP; 

     public function makePerson(age:String, gen:String, nic:String):void{ 
      var intAge:int=int(age); 
      var newOP:OP=new OP(intAge, gen, nic); 
      dest.text=String(newOP.computeRate()); 
     } 

    ]]> 
</fx:Script> 

<s:VGroup width="100%" height="100%" verticalAlign="middle" horizontalAlign="center" > 

    <s:Label text="Age:"/> 
    <s:TextInput id="age" restrict="0-9" maxChars="2"/> 

    <s:ComboBox id="GenderBox" width="140" prompt="Gender"> 
     <s:dataProvider> 
      <mx:ArrayList> 
       <fx:String>Male</fx:String> 
       <fx:String>Female</fx:String> 
      </mx:ArrayList> 
     </s:dataProvider> 
    </s:ComboBox> 

    <s:Label text="The selected gender is: {GenderBox.selectedItem}"/> 

    <s:ComboBox id="NicotineBox" width="140" prompt="Nicotine Usage"> 
     <s:dataProvider> 
      <mx:ArrayList> 
       <fx:String>Smoker</fx:String> 
       <fx:String>Non-Smoker</fx:String> 
      </mx:ArrayList> 
     </s:dataProvider> 
    </s:ComboBox> 

    <s:Label text="The selected Nicotine is: {NicotineBox.selectedItem}"/> 

    <s:Button label="Get Rate" click="makePerson(age.text, GenderBox.selectedItem, NicotineBox.selectedItem)" /> 
    <s:TextInput id="dest" />  
    <s:Button label="Back" click="navigator.popView()" styleName="back" /> 
</s:VGroup> 

視圖幾乎所有的碼是除了同一有一些差異。我想有一個包含所有重複代碼的視圖（產品），然後讓ProdA和ProdB擴展此產品。因此產品視圖中的所有內容都顯示在ProdA和ProdB中

Answer 1

使用依賴注入（公開屬性，然後您可以在視圖中綁定到該屬性），這使您無需像上面顯示的那樣定義內聯的整個內容。它會是這個樣子

[Bindable] 
public var dataProvider:ArrayList 
//..other public vars 
<s:ComboBox id="combo" width="140" prompt="{promptPublicVar}" > 
      <s:dataProvider>{dataProviderPublicVar}</s:dataProvider> 
      <s:change>publicVarContainingSelection=combo.selectedItem</s:change> 
</s:ComboBox> 

<s:Label text="{label}: {publicVarContainingSelection}"/> 

你會使用它像

<myNS:MyView> 
    <myNS:prompt>Gender</myNS:prompt> 
    <myNS:dataProvider><mx:ArrayList>...</mx:ArrayList></myNS:dataProvider> 
    <myNS:label>The selected Gender is: </myNS:label> 
</myNS:MyView> 

===========不打算寫任何代碼，試圖猜測你想要什麼，所以============

這裏有一些模式可能對您有用：

• Presentation Model
• Abstract Classes
• Template Components

注意，第三連桿還提到碼後面，其可以用作一種類型的抽象類。您也可以考慮使用composition over inheritance。例如，您的視圖不應該知道或關心如何計算費率信息，但可以將費率計算器數據組件傳遞給它。它最重要的是它爲自己創造的 - 這是你難以達到可重用設計的原因之一。