|
DynamicCockpitトップページの例の見積書フォームアプリケーションのデモを公開しています。
例のXMLでは、imageで読み込んだ見積書フォーム画像の上に、textInput、numberInput、commaInputといった入力フィールドを配置しています。
それぞれの入力フィールドにonChangedイベントが発生した場合、入力された値をサーバに非同期に問い合わせて、その結果を任意のフィールドに格納しています。
郵便番号から住所を検索する機能は、住所⇔郵便番号検索WEBサービス「ぽすたん」を利用するためのPostanConnectorオブジェクトを利用しています。
※このデモには、イースト株式会社の提供する住所⇔郵便番号検索WEBサービス「ぽすたん」を利用しています。
<image x="0" y="0" url="001.jpg" />
例 画像ファイルの配置
<textInput id="address1" x="77" y="61" width="198" height="14" text="" fontSize="11" maxChars="24" marginLeft="5" backgroundColor="0xFFF8CE" focusedBackgroundColor="0xC0ffC0" borderStyle="none" enter="../address2" tabIndex="2" imeMode="on"/>
例 テキストフィールドの配置
それぞれの入力フィールドには属性を与えることができます。今回与えられる属性は以下のような意味を持ちます。
| 属性 |
説明 |
| id |
オブジェクトを特定するためのID |
| x |
配置されるx座標 |
| y |
配置されるy座標 |
| width |
テキストフィールドの幅 |
| height |
テキストフィールドの高さ |
| text |
テキストフィールドに表示される文字列 |
| fontSize |
テキストフィールドの文字サイズ |
| maxChars |
入力できる最大文字数 |
| marginLeft |
テキストフィールドの左余白 |
| backgroundColor |
背景色 |
| focusBackgroundColor |
フォーカスが与えられているときの背景色 |
| borderStyle |
テキストフィールドの境界線のスタイル |
| enter |
Enterキーが押されたとき移動するオブジェクトのID |
| tabIndex |
Tabキーで移動するオブジェクトのインデックス |
| imeMode |
IME入力モード |
例 textInputの属性(一部)
|
