Flex Study Notes (Day 1)

Stringvalidator string Verification
Phonenumbervalidator phone number verification
Datevalidator date Verification
Emailvalidator email Verification
Numbervalidator numeric Verification

Alert
Introduce namespace
Import MX. Controls. Alert;
Import MX. Events. closeevent;
Alert. oklabel = "OK ";
Alert. Show ("the program is running! \ N be careful "," NOTE ", alert. OK );

Yes | no | OK | cancel 1 | 2 | 4 | 8 if there are multiple, you can use the added value.
To display Yes + NO, use 3.

Alert. Show ("are you sure you want to save it? "," Save ", 3, this, alertok );
Protected function alertok (Event: closeevent): void
{
If (event. Detail = alert. Yes)
{
Lblmsg. Text = "yes ";
}
Else
{
Lblmsg. Text = "no ";
}
}

Alt +/force prompt for namespace Introduction

Monthnames = ", "August October", "August November", "August December"]'

Daynames = '["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]'

Formatstring = "YYYY-MM-DD"

Textinput Control
Add creationcomplete = "Init ()" for S: Application ()"

Protected function Init (): void
{
Input. addeventlistener (keyboardevent. key_down, enter );
}
Protected function enter (E: keyboardevent): void
{
If (E. keycode = 13)
{
Alert. Show ("press the Enter key", "NOTE", alert. OK );
}
}
Or in the keydown = "Enter (event)" of the textinput control )"

DataGrid Control

Certificate -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

<? XML version = "1.0" encoding = "UTF-8"?> <S: Application xmlns: FX = "http://ns.adobe.com/mxml/2009" xmlns: S = "Library: // ns.adobe.com/flex/spark" xmlns: MX = "Library: // ns.adobe.com/flex/mx "minwidth =" 955 "minheight =" 600 "creationcomplete =" application1_1_creationcompletedhandler (event) "> <FX: SCRIPT> <! [CDATA [import MX. collections. arraycollection; import MX. collections. ilist; import MX. containers. GRID; import MX. controls. alert; import MX. events. calendarlayoutchangeevent; import MX. events. closeevent; import MX. events. flexevent; import spark. events. indexchangeevent; [Bindable] protected var Province: arraycollection = new arraycollection ([{label: "Anhui", data: 1 },{ label: "Jiangsu", data: 2 }, {label: "Zhejiang", data: 3} ]); [Bindable] protected var country: arraycollection = new arraycollection ([{label: "First Group", children: province}]); protected var dgcollection: arraycollection = new arraycollection (); protected function btn_clickhandler (Event: mouseevent): void {// todo auto-generated method stub alert. yeslabel = "OK"; alert. nolabel = "cancel"; alert. show ("are you sure you want to save it? "," Save ", 3, this, alertok);} protected function application1_1_creationcompletedhandler (Event: flexevent): void {dgcollection. additem ({XM: "James", NL: 25, XL: ""}); dgcollection. additem ({XM: "", NL: 25, XL: ""}); dgcollection. additem ({XM: "", NL: 25, XL: ""}); dgcollection. additem ({XM: "", NL: 25, XL: ""}); DG. dataprovider = dgcollection;} protected function alertok (Event: closeevent): void {If (event. detail = ale Rt. yes) {lblmsg. TEXT = "yes";} else {lblmsg. TEXT = "no" ;}} protected function cb_changehandler (Event: indexchangeevent): void {// todo auto-generated method Stub this. lblmsg. TEXT = "ComboBox selected text:" + CB. selecteditem. label + ", value:" + CB. selecteditem. data;} protected function btnadd_clickhandler (Event: mouseevent): void {// todo auto-generated method stub province. additem ({label: "Hainan", data: 4});} prote CTED function btndelete_clickhandler (Event: mouseevent): void {// todo auto-generated method stub province. removeitemat (list. selectedindex);} protected function df_changehandler (Event: calendarlayoutchangeevent): void {// todo auto-generated method Stub this. lblmsg. TEXT = DF. selecteddate. fullyear + "year" + (DF. selecteddate. month + 1) + "month" + DF. selecteddate. date + "day";} protected function button#clickhandler (E Vent: mouseevent): void {// Add data dgcollection to the DataGrid Control. additem ({XM: "Tian Qi", NL: 28, XL: ""});} protected function button2_clickhandler (Event: mouseevent ): void {// Delete the data dgcollection for the DataGrid Control. removeitemat (DG. selectedindex);} protected function button3_clickhandler (Event: mouseevent): void {// Add the column var newgrid: gridcolumn = new gridcolumn () for the DataGrid Control; newgrid. datafield = "hyzk"; newgrid. headertext = "Marital status "; VaR Cols: ilist = DG. columns; cols. additem (newgrid);} protected function button4_clickhandler (Event: mouseevent): void {// Delete the column var Cols: ilist = DG for the DataGrid Control. columns; cols. removeitemat (3);} protected function button5_clickhandler (Event: mouseevent): void {// traverse the DataGrid for (var I: Int = 0; I <dgcollection. length; I ++) {TA. TEXT = TA. text + dgcollection [I]. XM + "\ n" ;}} public var step: Int = 10; protected func Tion button6_clickhandler (Event: mouseevent): void {// set the value of the scroll bar this. pb. setprogress (Step + = 10,100); If (Step <100) {This. pb. label = "loading... "+ (STEP/100) * 100 +" % ";} else if (step = 100) {This. pb. label = "loaded" ;}}// file upload/download progress public var file: filereference = new filereference (); protected function file_progress (E: progressevent): void {pbar. label = "uploaded" + math. round (100 * E. bytesloaded/e. bytestotal) + "%"; pbar. setpr Ogress (math. round (100 * E. bytesloaded/e. bytestotal), 100);} protected function upload (): void {If (file. size> 0) {file. load () ;}} [Bindable] protected var statetext: String = "select the file to import"; protected override function createchildren (): void {super. createchildren (); file. addeventlistener (event. select, file_select); file. addeventlistener (event. complete, file_complete); file. addeventlistener (progressevent. pro Gress, file_progress);} protected function file_select (E: Event): void {statetext = file. name;} protected function file_complete (E: Event): void {var bytearray: bytearray = new bytearray (); bytearray = file. data; bytearray. position = 0; alert. show ("uploaded! "," Congratulations ", alert. OK) ;}]> </FX: SCRIPT> <FX: declarations> <! -- Place non-visual elements (such as services and value objects) Here --> <mx: stringvalidator source = "{xm}" property = "text" maxlength = "4" minlength = "2" toolongerror = "Name Too Long" tooshorterror = "Name Too short"> </ MX: stringvalidator> <s: numbervalidator source = "{NL}" property = "text" minvalue = "0" maxvalue = "120"> </S: numbervalidator> </FX: declarations> <s: form x = "361" Y = "7" width = "300" Height = "165"> <s: formitem label = "Name: "> <s: textinput id =" XM "/> </S: formitem> <s: Formitem label = "Age:"> <s: textinput id = "NL"/> </S: formitem> <s: formitem label = "Email:"> <s: textinput id = "Yx"/> </S: formitem> </S: Form> <s: button id = "BTN" x = "10" Y = "6" label = "button" Click = "btn_clickhandler (event)"/> <s: label id = "lblmsg" x = "76" Y = "186" text = "Hello world! "Color =" {CP. selectedcolor} "/> <s: ComboBox id =" CB "x =" 10 "Y =" 35 "change =" cb_changehandler (Event) "dataprovider =" {province} "/> <s: list id = "list" x = "6" Y = "66" width = "150" Height = "77" dataprovider = "{province}"> </s: list> <s: button id = "btndelete" x = "86" Y = "151" label = "delete" Click = "btndelete_clickhandler (event)"/> <s: button id = "btnadd" x = "8" Y = "151" label = "add" Click = "btnadd_clickhandler (event)"/> <mx: tree x = "8" Y = "211" width = "312" dataprovider = "{country}"> </MX: Tree> <mx: colorpicker id = "CP" x = "327" Y = "6"/> <mx: datefield id = "DF" x = "197" Y = "7" change = "df_changehandler (event)" daynames = "[" Sunday "," Monday "," Tuesday ", "Wednesday", "Thursday", "Friday", "Saturday"] "formatstring =" YYYY-MM-DD "monthnames =" ["January", "February", "March ", "August ", "December"] "/> <s: DataGrid x =" 361 "id =" DG "Y =" 180 "width =" 300 "requestedrowcount =" 4 "> <s: columns> <s: arraylist> <s: gridcolumn datafield = "XM" headertext = "name"> </S: gridcolumn> <s: gridcolumn datafield = "NL" headertext = "Age"> </S: gridcolumn> <s: gridcolumn datafield = "XL" headertext = "education"> </s: gridcolumn> </S: arraylist> </S: columns> </S: DataGrid> <s: button x = "382" Y = "316" label = "add" Click = "button#clickhandler (event)"/> <s: button x = "491" Y = "317" label = "delete" Click = "button2_clickhandler (event)"/> <s: button x = "382" Y = "367" label = "add column" Click = "button3_clickhandler (event)"/> <s: button x = "491" Y = "367" label = "delete column" Click = "button4_clickhandler (event)"/> <s: button x = "10" Y = "396" label = "traverse DataGrid" Click = "button5_clickhandler (event)"/> <s: textarea id = "ta" x = "106" Y = "396" Height = "20"/> <mx: progressbar id = "PB" x = "573" Y = "326" labelplacement = "center" Maximum = "100" minimum = "0" mode = "Manual"/> <s: button x = "602" Y = "353" label = "progress" Click = "button6_clickhandler (event)"/> <s: panel x = "353" Y = "396" width = "250" Height = "200" Title = "Data Import"> <s: textinput x = "10" Y = "10" width = "157" text = "{statetext}"/> <s: button x = "175" Y = "11" label = "Browse" Click = "file. browse (); "/> <mx: progressbar id = "pbar" x = "10" Y = "57" width = "157" labelplacement = "center"/> <s: button x = "175" Y = "57" label = "Upload" Click = "Upload ();"/> </S: Panel> </S: Application>

The page effect is as follows: