2 Replies Latest reply on Mar 21, 2012 11:55 AM by Carol L. Frampton

    How to get Horizontal Slider in line with text?

    dhondtl

      Hi,

       

      I am trying to put my horizontal sliders in line with text information, but for some reason the alignmentbase property does not work. Any tips?

       

      The code I use now:

       

      <s:Panel id= "ViewTracksPanel"

                       title = "Viewing settings"

                       width="100%"

                       height="100%">       

       

                  <s:layout>

                      <s:VerticalLayout paddingLeft="10" paddingTop="10" paddingBottom="10"/>

                  </s:layout>   

       

                  <s:VGroup >           

                      <s:HGroup gap="30">

                          <s:RadioButton group="{viewingtype}" id="viewtrackHistory" label="Track History" value="History" />

                          <s:RadioButton group="{viewingtype}" id="viewLatestLocation" label="Current Position" value="LatestLocation"/>    <!--does not work because precision of data is not inline with interval precision    -->   

                      </s:HGroup>   

       

                      <s:HGroup right="40">

                          <mx:Text text="Track Time Interval: {timeInt.value} Minutes "/>

                          <s:Label text="1"/>

                          <s:HSlider stepSize="1" minimum="1" maximum="60" id="timeInt" width="200" dataTipPrecision="0" change="timeInt_changeHandler(event)" alignmentBaseline="ideographicBottom" />

                          <s:Label text="60"/>

                          <s:Label/>

                      </s:HGroup>           

       

                      <s:HGroup>

                          <mx:Text text="Display Time Interval: {Speed.value} Seconds"/>

                          <s:Label text="1"/>

                          <s:HGroup>

                              <s:HSlider stepSize="1" minimum="1" maximum="5" id="Speed" width="200" dataTipPrecision="0" alignmentBaseline="ideographicBottom"/>

                          </s:HGroup>

                          <s:Label text="5"/>

                      </s:HGroup>

                      <s:Label/>  

       

      This results in:

      slider.jpg

       

      As seen above, the slider (& corresponding labels) are not on the same 'horizontal line/position' as the mx Text (ex. 'Track Time Interval' but a bit above?

      I tried to put alignmentbaseline to all possible values but whithout succes.

       

      Any advice would be really great!

      Thanks.