Flex Examples
The following example shows how you can change the text alignment in the Flex DateChooser control by setting the textAlign style.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/12/24/changing-the-flex-datechooser-controls-text-alignment/ -->
<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="textAlign:">
<mx:ComboBox id="comboBox" selectedIndex="1">
<mx:dataProvider>
<mx:Array>
<mx:Object label="left" />
<mx:Object label="center" />
<mx:Object label="right" />
</mx:Array>
</mx:dataProvider>
</mx:ComboBox>
</mx:FormItem>
</mx:Form>
</mx:ApplicationControlBar>
<mx:DateChooser id="dateChooser"
textAlign="{comboBox.selectedItem.label}" />
</mx:Application>
View source is enabled in the following example.
For an example of aligning the month name and year, see “Aligning headers in a DateChooser control in Flex”.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
Is there a way to align the Month and Year title in the header?
Anthony,
How about this:
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:Style> .dateChooserHeaderStyles { fontWeight: bold; textAlign: left; } </mx:Style> <mx:DateChooser headerStyleName="dateChooserHeaderStyles" /> </mx:Application>Peter
Actually, I turned this into a full example. For more information, see “Aligning headers in a DateChooser control in Flex”.
Hi Peter,
I have set the width and height for the dateChooser component. The texts are all aligned to top middle.
Is there a way to align to align in the center.
I have used a custom dateChooser. Which implements IUITextField. But do no where / how to set the alignment of the text to vertical middle.
The demo link is here. With viewsource enabled. Could you pls help me.
http://125.22.254.206/clients/FlexDemos/CalendarDemo/CalendarDemo.html
Regards,
Arulmurugan