Search Flex Samples

Setting the header height on a Flex Panel container

The following example shows you how you can change the header height on a Panel container in Flex by setting the headerHeight style.





<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white">



<mx:ApplicationControlBar dock="true">

<mx:Form styleName="plain">

<mx:FormItem label="headerHeight:">

<mx:HSlider id="slider"

minimum="24"

maximum="64"

value="32"

snapInterval="2"

tickInterval="4"

liveDragging="true" />

</mx:FormItem>

</mx:Form>

</mx:ApplicationControlBar>



<mx:Panel id="panel"

title="The quick brown fox jumped"

status="{panel.width}x{panel.height}"

titleIcon="@Embed('assets/Panel.png')"

headerHeight="{slider.value}"

borderColor="haloBlue"

borderAlpha="1.0"

width="400"

height="150">

<mx:VBox id="vBox" width="100%" height="100%">

<mx:Label text="{vBox.width}x{vBox.height}" />

</mx:VBox>

</mx:Panel>



</mx:Application>


0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples