ASDoc

mx.containers
Form クラス

Form クラス
mx.containers.Container の拡張

Form コンテナを使用すると、フォームのレイアウトの制御、指定またはオプションによるフォームフィールドのマーク付け、エラーメッセージの処理などを実行できるほか、フォームデータを Flex データモデルにバインドしてデータのチェックや検証を行うこともできます。また、スタイルシートを適用することによってフォームの外観を設定することもできます。

<mx:Form> タグは、フォーム全体のコンテナを定義します。コンテンツを定義するには、<mx:FormHeading> タグおよび <mx:FormItem> タグを使用します。また、Form コンテナに他のタイプのコンポーネントを挿入することもできます。

MXML シンタックス

<mx:Form> タグは、親クラスのすべてのプロパティと、次のプロパティを継承します。

 <mx:Form
   indicatorGap="16"
   labelWidth="デフォルト値は Form 内で最も長いラベルの長さです。"
   marginBottom="16"
   marginLeft="16"
   margingRight="16"
   marginTop="16"
   verticalGap="6">
     ...
       child tags
     ...
 />

例を参照するにはここをクリックしてください

関連項目
FormHeading
FormItem

メソッド
	`layoutChildren( ) : Void` サイズ変更に反応して、このコンテナの子の位置およびサイズを設定します。
	`measure( ) : Void`Form の推奨、最小、および最大サイズを計算します。

mx.containers.Container クラスから継承されるメソッド

createChildren draw executeChildBindings getViewMetrics getViewMetricsAndMargins init

mx.core.View クラスから継承されるメソッド

childLoaded   constructObject2   createChild   createChildren   destroyAllChildren   destroyChild   destroyChildAt   draw   getBorderMetrics   getChildAt   getChildIndex   getViewMetrics   init   layoutChildren   layoutChrome   setChildIndex

mx.core.UIComponent クラスから継承されるメソッド

drawFocus getFocus getFocusManager setEnabled setFocus

プロパティ

mx.containers.Container クラスから継承されるプロパティ

autoLayout   childDescriptors   className   clipContent   creationIndex   creationPolicy   defaultButton   hLineScrollSize   hPageScrollSize   hPosition   hScrollPolicy   icon   label   maxHPosition   maxVPosition   numRepeaters   version   vLineScrollSize   vPageScrollSize   vPosition   vScrollPolicy

mx.core.View クラスから継承されるプロパティ

baselinePosition className numChildren version

mx.core.UIComponent クラスから継承されるプロパティ

enabled errorString tabEnabled tabIndex version

エフェクト

mx.core.UIComponent クラスから継承されるエフェクト

focusInEffect focusOutEffect

mx.core.UIObject クラスから継承されるエフェクト

creationCompleteEffect   hideEffect   mouseDownEffect   mouseOutEffect   mouseOverEffect   mouseUpEffect   moveEffect   resizeEffect   showEffect

イベント

mx.containers.Container クラスから継承されるイベント

childrenCreated scroll

mx.core.View クラスから継承されるイベント

childCreated childDestroyed childIndexChanged

mx.core.UIComponent クラスから継承されるイベント

focusIn focusOut invalid keyDown keyUp valid valueCommitted

mx.core.UIObject クラスから継承されるイベント

creationComplete  dragComplete  dragDrop  dragEnter  dragExit  dragOver  draw  effectEnd  effectStart  hide  hideToolTip  initialize  load  mouseChangeSomewhere  mouseDown  mouseDownSomewhere  mouseMove  mouseMoveSomewhere  mouseOut  mouseOver  mouseUp  mouseUpSomewhere  move  resize  show  showToolTip  unload

スタイル
`indicatorGap`	`型 : Number 形式 : Length CSS の継承 : あり`ラベルと子コンポーネントの間隔を示すピクセル数です。デフォルト値は 14 です。
`labelWidth`	`型 : Number 形式 : Length CSS の継承 : あり`フォームラベルの幅です。デフォルトは、フォーム内で最も長いラベルの長さです。
`marginBottom`	`型 : Number 形式 : Length CSS の継承 : なし`コンテナの下境界線とコンテンツ領域の間隔を示すピクセル数です。デフォルト値は 16 です。
`marginTop`	`型 : Number 形式 : Length CSS の継承 : なし`コンテナの上境界線とコンテンツ領域の間隔を示すピクセル数です。デフォルト値は 16 です。
`verticalGap`	`型 : Number 形式 : Length CSS の継承 : なし`子同士の垂直方向の間隔を示すピクセル数です。デフォルトは 6 です。

mx.core.UIObject クラスから継承されるスタイル

color   fontFamily   fontSize   fontStyle   fontWeight   horizontalGap   leading   marginLeft   marginRight   textAlign   textDecoration   textIndent   verticalGap

メソッドの詳細

layoutChildren

layoutChildren( )
										
													 :  Void

サイズ変更に反応して、このコンテナの子の位置およびサイズを設定します。layoutChildren() メソッドの詳細については、UIObject.layoutChildren() メソッドを参照してください。

Form.layoutChildren() メソッドは、verticalGap スタイルプロパティによって隙間を指定される、垂直列内の子の位置を設定します。marginLeft、marginRight、marginTop、および marginBottom スタイルプロパティが適用されます。

width がパーセント値に設定された子は、Form の指定されたパーセント値まで水平方向に拡大されます。それ以外の子は、それぞれの preferredWidth に設定されます。子はそれぞれの preferredHeight に設定されます。

このメソッドは、何を実行する前にも super.layoutChildren() メソッドを呼び出します。

measure

measure( )
										
													 :  Void

Form の推奨、最小、および最大サイズを計算します。measure 関数の詳細については、UIObject.measure() メソッドを参照してください。

Form.measure() メソッドは、_measuredPreferredWidth を、最大の子の幅にmarginLeft および marginRight スタイルプロパティの値と境界線の幅を加えた値に設定します。

_measuredPreferredHeight は、すべての子の preferredHeights の合計に、各子同士の verticalGap 間隔を加えた値に設定されます。marginTop および marginBottom スタイルプロパティと、境界線の高さも追加されます。

_measuredMinWidth は、子の最大の最小幅に設定されます。width がパーセント値である子には minWidth プロパティが使用され、それ以外の子には preferredWidth プロパティが使用されます。marginLeft および marginRight スタイルプロパティの値と、境界線の幅の値も追加されます。

例

FormExample.mxml

<?xml version="1.0" encoding="utf-8"?>
<!-- Form レイアウトの使用方法を示す簡単な例 -->
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" backgroundColor="#FFFFFF"
width="100%" height="100%">

<mx:Model id="checkModel">
<FirstName>{fname.text}</FirstName>
<DOB>{dob.text}</DOB>
<Email>{email.text}</Email>
<Age>{age.text}</Age>
<SSN>{ssn.text}</SSN>
<Zip>{zip.text}</Zip>
<Phone>{phone.text}</Phone>
</mx:Model>

<mx:Panel title="Form Check Panel" width="100%" height="100%">

<mx:HBox width="80%" height="100%">

<mx:Form width="100%" height="100%">
<mx:FormItem label="First name" required="true" direction="horizontal">
<mx:TextInput id="fname" width="200"/>
</mx:FormItem>

<mx:FormItem label="Date of birth (dd*mm*yyyy*)">
<mx:TextInput id="dob" width="200"/>
</mx:FormItem>

<mx:FormItem label="E-mail address">
<mx:TextInput id="email" width="200"/>
</mx:FormItem>

<mx:FormItem label="Age">
<mx:TextInput id="age" width="200"/>
</mx:FormItem>

<mx:FormItem label="Social-security no">
<mx:TextInput id="ssn" width="200"/>
</mx:FormItem>

<mx:FormItem label="Zip">
<mx:TextInput id="zip" width="200"/>
</mx:FormItem>

<mx:FormItem label="Phone">
<mx:TextInput id="phone" width="200"/>
</mx:FormItem>
</mx:Form>

</mx:HBox>

</mx:Panel>

<mx:StringValidator field="checkModel.FirstName" minLength="4" maxLength="12" listener="fname"/>
<mx:PhoneNumberValidator field="checkModel.Phone"></mx:PhoneNumberValidator>
<mx:DateValidator field="checkModel.DOB" listener="dob"></mx:DateValidator>
<mx:EmailValidator field="checkModel.Email" listener="email"></mx:EmailValidator>
<mx:NumberValidator field="checkModel.Age" listener="age" integerError="Enter Integer value"
minValue="18" maxValue="50" domain="int">
</mx:NumberValidator>
<mx:SocialSecurityValidator field="checkModel.SSN" listener="ssn"></mx:SocialSecurityValidator>
<mx:ZipCodeValidator field="checkModel.Zip" listener="zip"></mx:ZipCodeValidator>

</mx:Application>

mx.containers Form クラス

layoutChildren

measure

mx.containers
Form クラス