3 Replies Latest reply on Jul 26, 2011 8:11 AM by kevinklin

    Spark form and formitem gap

    isabelle loyer

      Dear Flexer,

       

      I'd like to create a form what include hbox and vbox on my Air apps.

      Indeed in the same line, you can see several text imput with label.

       

      In my case, I'd like to change gap into form item. Indeed in several case, there is a lot of white space between two form item.

      I already set the gap to 0 on property form, but It seems to work only vertical direction.

       

      So, is someone can explain to me how reduce space on horizontal direction.

       

      Thanks for helping.

        • 1. Re: Spark form and formitem gap
          kevinklin Adobe Employee

          Please provide a small, compilable test case showing the problem you are having.

           

          -Kevin

          • 2. Re: Spark form and formitem gap
            isabelle loyer Level 1

            Thanks for your answer.

             

            Find below an exemple:

             

             

                 <s:Form x="0" y="137" id="foPerso"  width="100%">
            
                           <!-- Reduce space between form items. --> 
                           <s:layout>
                                <s:HorizontalLayout gap="0" paddingLeft="0"/>
                           </s:layout>
            
            
            
                           <s:HGroup paddingLeft="5" verticalAlign="middle" width="100%" gap="0">
            
            
                                <s:ComboBox id="cbQualite" dataProvider="{DP_PAT_CIVIL}" width="130" height="22"/>
            
                                <s:FormItem label="Nom" >
            
            
                                     <s:TextInput id="fdNom" width="150" height="16"/>
                                </s:FormItem>
                                <s:FormItem label="Prénom">
                                     <s:TextInput id="fdPrenom" width="150" height="16"/>
                                </s:FormItem>
            
                                <s:ComboBox id="cbDossier1" dataProvider="{DP_PAT_DOS1}" width="118" height="22"/>
                                <s:FormItem label="">
                                     <s:TextInput id="fDossier1" width="90" height="16"/>
                                </s:FormItem>
                           </s:HGroup>
            
                           <s:HGroup>
                                <s:FormItem label="Naissance">
                                     <mx:DateField id="dfNaissance" editable="true" showToday="false"/>
                                </s:FormItem>
                                <s:RadioButton label="Masculin" group="{rbsex}"/>
                                <s:RadioButton label="Féminin" group="{rbsex}"/>
                                <s:ComboBox id="cbDossier2" dataProvider="{DP_PAT_DOS1}" width="118" height="22"/>
                                <s:FormItem label="">
                                     <s:TextInput id="fDossier2" width="90" height="16"/>
                                </s:FormItem>
            
                           </s:HGroup>
            
            

             

             

            Capture d’écran 2011-07-21 à 12.30.14.jpg

             

            Thanks for your help

            • 3. Re: Spark form and formitem gap
              kevinklin Adobe Employee

              You'll need to reskin the FormItems. Create a new FormItemSkin and remove the columns and parts you don't need. It looks like the only columns you need are the labelCol and contentCol.

               

              -Kevin