<code>
<?xml version="1.0" encoding="utf-8"?>
<s:HGroup xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
creationComplete="init()">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import com.amdocs.infra.utils.FlexFormatters;
import mx.collections.ArrayCollection;
import mx.controls.DateField;
import mx.events.CalendarLayoutChangeEvent;
import mx.events.FlexEvent;
import mx.formatters.DateFormatter;
import mx.utils.StringUtil;
import spark.events.IndexChangeEvent;
private var arr:ArrayCollection = new ArrayCollection();
private var date:Date;
private var selecteDate:Date = new Date();
public var dateChanged :Boolean;
[Bindable]
private var timezone:String;
[Bindable]
public function get selectedDate():Date
{
if(dateChanged)
return date;
else
return selecteDate;
}
public function set selectedDate(value:Date):void
{
if(value.toString()!= null)
{
selecteDate = value;
var dateformatter:DateFormatter = new DateFormatter();
dateformatter.formatString = "MM/DD/YYYY L:NN:SSA";
var dateStr:String = dateformatter.format(value).substr(0,10);
var dateArray:Array = dateStr.split("/");
dateInput.selectedDate = new Date(dateArray[2],dateArray[0]-1,dateArray[1]);
timeInput.selectedItem = dateformatter.format(value).substr(11,10);
dateStringLabel.text = FlexFormatters.getDateTimeFormatter({ dateTimePattern: "EEEE, MMMM dd, yyyy h:mm:ss a" }).format(value);
dateChanged = false;
timezone = TimeZoneUtil.getTimeZone();
}
}
protected function formatTime():void
{
var rawTimeString:String;
// If the combobox has a custom value, hten use the selectedItem. Otherwise, use the selectedItem.value
if (timeInput.selectedIndex == ComboBox.CUSTOM_SELECTED_ITEM)
rawTimeString = StringUtil.trim(timeInput.selectedItem).toUpperCase();
else if (timeInput.selectedIndex != -1)
rawTimeString = StringUtil.trim(timeInput.selectedItem).toUpperCase();
// look for AM or PM at end of the timestring
var amPm:String = "";
if (rawTimeString.substr(-2) == "AM")
amPm = "AM";
else if (rawTimeString.substr(-2) == "PM")
amPm = "PM";
// Split time by colons
var timeArr:Array = StringUtil.trimArrayElements(rawTimeString.replace(amPm, ""),":").split(":");
var hour:int = 0;
var minute:int = 0;
var second:int = 0;
// determine the hour/minute/second from the array
if (timeArr.length >= 2)
{
hour = timeArr[0];
minute = timeArr[1];
second = (timeArr.length == 3 ? timeArr[2] : 0) ;
}
else
{
trace("Error parsing time (" + rawTimeString + "). Defaulting to midnight");
}
// If it is an AM time and hour is 12 (midnight) then set the hour to zero)
if (amPm == "AM" && hour == 12)
hour = 0;
// add 12 hours if the hour is between 1 and 11
else if (amPm == "PM" && hour >=1 && hour <= 11)
hour = hour + 12;
// If hours, minutes, or seconds exceed what they should be, then
// calculate how many days/hours/minutes should be added to the final date
// and determine the final hour/minute/second
if (second >= 60)
{
minute += Math.floor(second/60);
second = second % 60;
}
if (minute >= 60)
{
hour += Math.floor(minute/60);
minute = minute % 60;
}
var addedDays:int = 0;
if (hour >= 24)
{
addedDays += Math.floor(hour/24);
hour = hour % 24;
}
var timeString:String = lpad(hour,2,"0") + ":" + lpad(minute,2,"0") + ":" + lpad(second,2,"0");
var dateString:String = FlexFormatters.getDateTimeFormatter({ "dateTimePattern": "yyyy-MM-dd" }).format(dateInput.selectedDate);
// Create date from final dateString/timeString
date = DateFormatter.parseDateString(dateString + " " + timeString);
// Add days to the final date if needed
if (date != null && addedDays > 0)
date.setDate(date.getDate() + addedDays);
//dateValueLabel.text = (date != null?date.toString():null);
dateStringLabel.text = FlexFormatters.getDateTimeFormatter({ dateTimePattern: "EEEE, MMMM dd, yyyy h:mm:ss a" }).format(date);
dateChanged = true;
}
// helper function to add a leading zero to hour/minute/second
private function lpad(number:int, width:int, padChar:String = " "):String
{
var ret:String = ""+number;
while(ret.length < width)
ret=padChar + ret;
return ret;
}
private function init():void
{
for each (var ampm : String in ["AM","PM"])
{
for(var i :int = 0;i<12;i++)
{
var hours:int = (i == 0?12:i);
for each(var minutes : String in ["00","30"])
{
var item:Object = hours+":"+minutes+" "+ampm;
arr.addItem(item);
//trace(hours+":"+minutes+" "+ampm);
}
}
}
timeInput.dataProvider = arr;
}
protected function timeInput_changeHandler(event:IndexChangeEvent):void
{
if (timeInput.selectedIndex!= ComboBox.CUSTOM_SELECTED_ITEM)
{
timeInput.selectedItem = String(timeInput.selectedItem).replace(" ",":00");
}
// TODO Auto-generated method stub
if(dateInput.selectedDate!= null)
formatTime();
}
protected function dateInput_changeHandler(event:CalendarLayoutChangeEvent):void
{
// TODO Auto-generated method stub
if(timeInput.selectedItem!= null)
formatTime();
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<s:VGroup>
<s:HGroup>
<mx:DateField id="dateInput" change="dateInput_changeHandler(event)"/>
<s:ComboBox id="timeInput" labelField="value" initialize="timeInput_initializeHandler(event)" click="timeInput_clickHandler(event)" change="timeInput_changeHandler(event)"/>
<s:Label text="{timezone}" paddingTop="8"/>
</s:HGroup>
<s:Label id="dateStringLabel"/>
</s:VGroup>
</s:HGroup>
</code>
上面的代碼是一個日期時間選取其中用戶可以選擇(HH:MM:SSAM/PM)的任何日期和時間格式。如何設置COMBOX的光標移動到特定的指數?
這個日期時間選擇器將在用戶雙擊一個Grid時調用。在一個網格中有一個稱爲Selected Date的列。從beckend帶來的值被分解爲日期和時間的不同,並被分配到日期時間和時間combox。
客戶希望在下面的方式來COMBOX工作:
假設,如果選定的日期字段是12年12月12日上午4時二十零分15秒,如果在下拉用戶點擊即可下拉不應該從12開始: 6:00 AM每次它應該從它開始像時間上午04時20分15秒,應該從上午四點30分00秒爲上午7時50分12秒被啓動最近即將推出的時間應該從早上8:00 請諮詢來啓動
不,問題是在combox值應顯示爲4:20:15上午但當用戶想要選擇任何值從combox它應該從4:30開始。假設如果價值是9:45 PM那麼它應該從下午10:00開始 – user1942215
我已經寫了一些邏輯,但第一件事是我沒看到我怎麼可以前進滾動欄和第二個事件我會打電話給它改變其不工作 – user1942215
有在列表組件的方法list.scrollToIndex(),但它在MX是肯定的:L ist,我不確定它是否在spark版本s:List中。不過,這可「手工」完成,我會在此改變組合框,有創建自己的功能。我很抱歉,我不能嘗試(代碼)它自己現在說具體步驟...... – user3190916