The following example shows you how you can align the selected date in the Flex DateField control’s text field by setting the textAlign style.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/04/28/aligning-the-selected-date-in-a-datefield-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="top"
backgroundColor="white">
<mx:Script>
<![CDATA[
import mx.events.ItemClickEvent;
private function init():void {
dateField.selectedDate = new Date();
}
private function toggleButtonBar_itemClick(evt:ItemClickEvent):void {
dateField.setStyle("textAlign", evt.item.label);
}
]]>
</mx:Script>
<mx:ApplicationControlBar dock="true">
<mx:ToggleButtonBar id="toggleButtonBar"
selectedIndex="1"
itemClick="toggleButtonBar_itemClick(event);">
<mx:dataProvider>
<mx:Array>
<mx:Object label="left" />
<mx:Object label="center" />
<mx:Object label="right" />
</mx:Array>
</mx:dataProvider>
</mx:ToggleButtonBar>
</mx:ApplicationControlBar>
<mx:DateField id="dateField"
width="200"
textAlign="center"
initialize="init();" />
</mx:Application>
View source is enabled in the following example.
