Question

我尝试在Air应用程序上使用网格布局。即使允许组件使用相同的colspan，左右屏幕的宽度也不相同。

看文字区域宽度，非常奇怪不是吗？

<s:NavigatorContent label = "Famille" width = "{mainGroup.width}" height = "{mainGroup.height}">
                <s:VGroup  height="100%" width="{mainGroup.width}" paddingLeft="5" paddingRight="5" verticalAlign="middle">
                    <s:BorderContainer width="100%" verticalCenter="0" borderColor="#A8CB17">
                        <mx:Grid width="{mainGroup.width - 10}" height="{mainGroup.height}"
                                 paddingBottom="5" paddingTop="5" paddingLeft="5" paddingRight="5">
                            <mx:GridRow id="far1" verticalAlign="middle" width="100%" >
                                <mx:GridItem colSpan="1" width="100%" verticalAlign="middle"/>
                                <mx:GridItem colSpan="6" width="100%" verticalAlign="middle" horizontalAlign="left">
                                    <s:Label text="Fratrie" horizontalCenter="0" textAlign="left" />
                                </mx:GridItem>
                                <mx:GridItem colSpan="2" width="100%" verticalAlign="middle"/>
                            </mx:GridRow>
                            <mx:GridRow id="far2" verticalAlign="middle" width="100%" >
                                <mx:GridItem colSpan="1" width="100%" verticalAlign="middle"/>
                                <mx:GridItem colSpan="6" width="100%" verticalAlign="middle">
                                    <s:TextArea heightInLines="8" width="100%" id="taFrat"/>
                                </mx:GridItem>
                                <mx:GridItem colSpan="2" width="100%" verticalAlign="middle"/>
                            </mx:GridRow>
                            <mx:GridRow id="far3" verticalAlign="middle" width="100%" >
                                <mx:GridItem colSpan="2" width="100%" verticalAlign="middle">
                                    <s:Label text="Antécédents Familiaux" horizontalCenter="0" textAlign="right" />
                                </mx:GridItem>
                                <mx:GridItem colSpan="1" width="100%" verticalAlign="middle">
                                    <s:CheckBox label="Alerte" id="afA"/>
                                </mx:GridItem>
                                <mx:GridItem colSpan="1" width="100%" verticalAlign="middle">
                                    <s:CheckBox label="RAS" id="afRAS"/>
                                </mx:GridItem>
                                <mx:GridItem colSpan="1" width="30" verticalAlign="middle"/>
                                <mx:GridItem colSpan="4" width="100%" verticalAlign="middle">
                                    <s:Label text="Antécédents Familiaux ODF" horizontalCenter="0" textAlign="right" />
                                </mx:GridItem>
                            </mx:GridRow>
                            <mx:GridRow id="far4" verticalAlign="middle" width="100%" >
                                <mx:GridItem colSpan="4" width="100%" verticalAlign="middle">
                                    <s:TextArea heightInLines="8" width="100%" id="taanfam"/>
                                </mx:GridItem>

                                <mx:GridItem colSpan="1" width="30" verticalAlign="middle"/>
                                <mx:GridItem colSpan="4" width="100%" verticalAlign="middle">
                                    <s:TextArea heightInLines="8" id="taAnFamOrtho" width="100%"/>
                                </mx:GridItem>

                            </mx:GridRow>

                            <mx:GridRow id="far5" verticalAlign="middle" width="100%" >
                                <mx:GridItem colSpan="4" width="100%" verticalAlign="middle">
                                    <s:Label text="Divers 3" horizontalCenter="0" textAlign="right" />
                                </mx:GridItem>

                                <mx:GridItem colSpan="1" width="100%" verticalAlign="middle"/>
                                <mx:GridItem colSpan="4" width="100%" verticalAlign="middle">
                                    <s:Label text="Divers 4" horizontalCenter="0" textAlign="right" />
                                </mx:GridItem>
                                <!--                                    <mx:GridItem colSpan="2" width="100%" verticalAlign="middle"/>
                                -->                                </mx:GridRow>
                            <mx:GridRow id="far6" verticalAlign="middle" width="100%" >
                                <mx:GridItem colSpan="4" width="100%" verticalAlign="middle">
                                    <s:TextArea heightInLines="8" width="100%" id="taDiv3"/>
                                </mx:GridItem>
                                <mx:GridItem colSpan="1" width="100%" verticalAlign="middle"/>
                                <mx:GridItem colSpan="4" width="100%" verticalAlign="middle">
                                    <s:TextArea heightInLines="8" width="100%" id="taDiv4"/>
                                </mx:GridItem>
                                <mx:GridItem colSpan="2" width="100%" verticalAlign="middle"/>
                            </mx:GridRow>
                        </mx:Grid>
                    </s:BorderContainer>
                </s:VGroup>
            </s:NavigatorContent>

现在，截图： result

Answer 1

<mx:Grid width="100%" height="100%" paddingBottom="5" paddingTop="5" paddingLeft="5" paddingRight="5" horizontalGap="5">
  <mx:GridRow id="far1" verticalAlign="middle" width="100%" >
    <mx:GridItem colSpan="1" width="20%" verticalAlign="middle"/>
    <mx:GridItem colSpan="6" width="60%" verticalAlign="middle" horizontalAlign="left">
      <mx:Label text="Fratrie" horizontalCenter="0" textAlign="left" />
    </mx:GridItem>
    <mx:GridItem colSpan="1" width="20%" verticalAlign="middle"/>
  </mx:GridRow>

  <mx:GridRow id="far2" verticalAlign="middle" width="100%" >
    <mx:GridItem colSpan="1" verticalAlign="middle"/>
    <mx:GridItem colSpan="6" verticalAlign="middle">
      <mx:TextArea   width="100%" id="taFrat"/>
    </mx:GridItem>
  </mx:GridRow>

  <mx:GridRow id="far3" verticalAlign="middle" width="100%" >
   <mx:GridItem colSpan="2"  verticalAlign="middle">
     <mx:Label text="Antécédents Familiaux" horizontalCenter="0" textAlign="right" />
   </mx:GridItem>
   <mx:GridItem colSpan="1"  verticalAlign="middle">
     <mx:CheckBox label="Alerte" id="afA"/>
   </mx:GridItem>
   <mx:GridItem colSpan="1"  verticalAlign="middle">
     <mx:CheckBox label="RAS" id="afRAS"/>
   </mx:GridItem>
   <mx:GridItem colSpan="4" verticalAlign="middle">
     <mx:Label text="Antécédents Familiaux ODF" horizontalCenter="0" textAlign="right" />
   </mx:GridItem>
 </mx:GridRow>

 <mx:GridRow id="far4"  width="100%" >
   <mx:GridItem colSpan="4" >
     <mx:TextArea   width="100%" id="taanfam"/>
    </mx:GridItem>
    <mx:GridItem colSpan="4"  >
      <mx:TextArea   id="taAnFamOrtho" width="100%"/>
    </mx:GridItem>
 </mx:GridRow>

 <mx:GridRow id="far5" verticalAlign="middle" width="100%" >
   <mx:GridItem colSpan="4" verticalAlign="middle">
     <mx:Label text="Divers 3" horizontalCenter="0" textAlign="right" />
   </mx:GridItem>
   <mx:GridItem colSpan="4" verticalAlign="middle">
     <mx:Label text="Divers 4" horizontalCenter="0" textAlign="right" />
   </mx:GridItem>
 </mx:GridRow>

 <mx:GridRow id="far6" width="100%" >
   <mx:GridItem colSpan="4">
     <mx:TextArea   width="100%" id="taDiv3"/>
   </mx:GridItem>
   <mx:GridItem colSpan="4" >
     <mx:TextArea width="100%" id="taDiv4"/>
   </mx:GridItem>
 </mx:GridRow>

</mx:Grid>

网格布局 - 非常奇怪的结果

1 个答案: