Question

首次进入Flex表单组件的世界时，我注意到在几分钟内创建漂亮的外形非常容易。

但是，当我向每个表单组件提供一个helpcontent组件时，我的formlayout就搞砸了。帮助内容覆盖了我的表单组件，我尝试了所有内容，但我无法让它按照应有的方式对齐。

这是一张图片： http://gyazo.com/7363fb80c70340e029e41165b36bed2c.png

以下是代码：

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

    <s:Group width="100%" height="100%" left="10" right="10" top="10" bottom="10">
        <s:VGroup width="100%" height="100%">
            <s:HGroup width="100%" height="50%">
                <s:Form width="75%">
                    <s:layout>
                        <s:FormLayout/>
                    </s:layout>
                    <s:FormHeading label="Filter (Optioneel)" />
                    <s:FormItem label="Naam:" width="100%">
                        <s:TextInput id="txtName" width="200"/>
                        <s:helpContent>
                            <s:Label x="0" y="0" paddingLeft="0" paddingRight="0"
                                     text="Vul hier een naam in, dit mag een deel zijn."/>
                        </s:helpContent>
                    </s:FormItem>
                    <s:FormItem label="Datum vanaf:" width="100%">
                        <mx:DateField id="dtFrom" width="200"/>
                        <s:helpContent>
                            <s:Label text="Kies hier een startdatum."/>
                        </s:helpContent>
                    </s:FormItem>
                    <s:FormItem label="Datum tot:" width="100%">
                        <mx:DateField id="dtTo" width="200"/>
                        <s:helpContent>
                            <s:Label text="Kies hier een einddatum."/>
                        </s:helpContent>
                    </s:FormItem>
                </s:Form>

            </s:HGroup>
            <s:Panel width="100%" height="100%">
                <mx:AdvancedDataGrid id="dgRunningQuotations" left="5" right="5"
                                     top="5" bottom="25"
                                     designViewDataType="flat"
                                     resizableColumns="false" textAlign="right"
                                     variableRowHeight="true">
                    <mx:columns>
                        <mx:AdvancedDataGridColumn width="50" dataField="ID"
                                                   headerText="NR"/>
                        <mx:AdvancedDataGridColumn dataField="Name" headerText="Naam"
                                                   wordWrap="true"/>
                        <mx:AdvancedDataGridColumn width="100" dataField="PDate"
                                                   headerText="Datum"/>
                    </mx:columns>
                </mx:AdvancedDataGrid>
            </s:Panel>
        </s:VGroup>
    </s:Group>
</s:Group>

将表单大小增加到绝对值而不是75％，也无济于事。

Answer 1

尝试不在表单项上添加width属性，甚至可以在其中添加项目，看看是否有效。我尝试了一个非常简单的例子，没有位置设置，它工作正常。

Flex 4.5，对齐表单helpcontent搞砸了

1 个答案: