Flash Builder 4 -> DropDownList

Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-21 (水) 22:18:20 | 最終更新:2010-07-25 (日) 2:22:08

DropDownList
spark.components

 

dataProvider

まだ触り初めでよく分からない。

ひとまず XMLListCollection に挑戦。

Tree コンポーネントのときとは違いデータに階層がないせいか、XML だと上手くできなかった。
Flash Builder 4 -> Tree

そこで今回は XMLList スタートにすることで希望通りの結果を得られた。

  1. var myXMLList:XMLList = new XMLList(event.result);
  2. myDropDownList.dataProvider = new XMLListCollection(myXMLList);

 

prompt

prompt プロパティは、selectedIndex = -1 のときに表示されるテキスト。
つまり、ユーザが触れる前なので、ユーザへ誘導文言に使える。

  1. myDropDownList.prompt = "1つだけだよ!";

 

selectedIndex

selectedIndex プロパティは、選択状態にある行番号(0 スタート)を表す。
未選択の場合は -1 。
 

デフォルト値を設定
  1. myDropDownList.selectedIndex = 3;

これで行番号3番(つまり4行目)を選択状態にできる。

  1. for (var i:int = 0; i < myXMLList.length(); i++) {
  2.     if (myXMLList[i].@id == myID) {
  3.         myDropDownList.selectedIndex = i;
  4.     }
  5. }[/as3onfx4]
  6.  
  7. これで変数に合う行を選択行にできる。
  8.  
  9. <div class="flow1">selectedItem</div>
  10. <span class="emphasis_b">selectedItem</span> プロパティには、DropDownList において選択されている箇所のオブジェクトが入っている。
  11.  
  12. dataProvider が XMLListCollection なら、そのノード情報が格納されている。
  13. [as3onfx4]var item:Object = myDropDownList.selectedItem;
  14. var id = item.@id; // 属性値の受け取り方
  15. var hoge = item.hoge; // 子ノードの受け取り方

よって、Tree コンポーネント同様に、上記のようにして情報を受け取ることができる。

Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-21 (水) 22:18:20 | 最終更新:2010-07-25 (日) 2:22:08

Flash Builder 4 -> CheckBox

Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-21 (水) 18:49:46 | 最終更新:2010-07-25 (日) 2:21:42

CheckBox
spark.components
mx.controls

 

選択状態

selected プロパティを用いる。

selected : Boolean
ボタンがダウン状態の場合は true、アップ状態の場合は false です。

Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-21 (水) 18:49:46 | 最終更新:2010-07-25 (日) 2:21:42

Flash Builder 4 -> Button

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-21 (水) 18:31:03 | 最終更新:2010-07-25 (日) 2:21:18

Button
spark.components
mx.controls

 

クリックイベント登録
FB4

FB4 上ではこちらから。

テキストボックスに関数名を記入してもよし。
ドロップダウンから選択してもよし。
 

イベントハンドラーを生成
[mxml]

[/mxml] 上記のコードが自動生成される。
 

サービスの呼び出しを生成

あ、ちなみに サービスと接続 してないと、この選択肢は表示されない。
[mxml]




[/mxml] もう少し多めにコードを自動生成してくれる。
 

AS
  1. import flash.events.Event;
  2.  
  3. var myButton:Button = new Button();
  4. myButton.addEventListener( MouseEvent.CLICK, hoge(event:MouseEvent) );
Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-21 (水) 18:31:03 | 最終更新:2010-07-25 (日) 2:21:18

データ型の指定

Posted by muchag | Flash Builder 4,PHP |
初回投稿:2010-07-21 (水) 16:02:17 | 最終更新:2010-07-25 (日) 14:15:49

FB4 を使い始めた頃に、「戻り値の設定」でデータ型を取得するのにはまった。
Flash Builder 4 -> PHP&MySQLとの連携

FB4 による自動生成の mysqli 用コードではちゃんとデータ型が取得できるのに
PDO だとできないなんて~!!

最初は諦めたけど、やっぱり気になって色々と試していたら、データ型を取得できるようになった。
 

お手本

自動生成の mysqli 用コードを見ていると、こんな箇所がある。

  1. while (mysqli_stmt_fetch($stmt)) {
  2.     $rows[] = $row;
  3.     $row = new stdClass();
  4.     mysqli_stmt_bind_result($stmt, $row->id, $row->name);
  5. }

何か変なコードに見えるが、一部抜粋なので気にしない。 😎

無論、これでデータ型を指定できているとは思えないが
これを見習って、DB からの取得結果を 新たな配列に入れ直す方法 を思いついた。
 

PDO 用
  1. $rows = getAll($sql, $param);
  2.  
  3. $myRows = array();
  4. foreach ($rows as $key => $val) {
  5.     $row = new stdClass();
  6.     $row->id   = (int)$val->id;
  7.     $row->name = (string)$val->name;
  8.  
  9.     $myRows[] = $row;
  10. }

データを入れ直すときに 各々の適切な型にキャストしてやる のがポイント。

これで無事に「戻り値の設定」でデータ型を取得できた。 😆

Posted by muchag | Flash Builder 4,PHP |
初回投稿:2010-07-21 (水) 16:02:17 | 最終更新:2010-07-25 (日) 14:15:49

Flash Builder 4 -> サイズ指定

Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-21 (水) 15:17:40 | 最終更新:2010-07-25 (日) 2:24:31

width, height

基本は widthheight

FB4 上ではこちらから。

 

絶対値指定
[mxml][/mxml]

または

  1. myGroup.width = 200;

 

パーセント指定
[mxml][/mxml]

または

  1. myGroup.percentWidth = 100;
  2.  
  3. // これはエラーになる
  4. myGroup.percentWidth = 100%;

 

minWidth, minHeight, maxWidth, maxHeight

最小値を指定するのが minWidthminHeight

最大値を指定するのが maxWidthmaxHeight

パーセント指定はできない

‘minWidth’ のイニシャライザ : ここではパーセンテージは使用できません。
Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-21 (水) 15:17:40 | 最終更新:2010-07-25 (日) 2:24:31

Flash Builder 4 -> RichEditableText

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-19 (月) 5:11:58 | 最終更新:2010-07-25 (日) 2:22:59

HTML タグの反映
[mxml][/mxml]
  1. import flashx.textLayout.conversion.TextConverter;
  2. import flashx.textLayout.elements.Configuration;
  3. import flashx.textLayout.elements.TextFlow;
  4. import flashx.textLayout.formats.TextDecoration;
  5. import flashx.textLayout.formats.TextLayoutFormat;
  6.  
  7. private function init():void {
  8.     var txt:String = "Check out our website at <a href='http://blog.flexexamples.com/' target='_top'>flexexamples.com</a>.";
  9.  
  10.     var cfg:Configuration = TextFlow.defaultConfiguration;
  11.  
  12.     var normalFmt:TextLayoutFormat = new TextLayoutFormat(cfg.defaultLinkNormalFormat);
  13.     normalFmt.color = 0xFF0000; // red
  14.     normalFmt.textDecoration = TextDecoration.NONE;
  15.  
  16.     var hoverFmt:TextLayoutFormat = new TextLayoutFormat(cfg.defaultLinkHoverFormat);
  17.     hoverFmt.color = 0xFF00FF; // purple
  18.     hoverFmt.textDecoration = TextDecoration.UNDERLINE;
  19.  
  20.     cfg.defaultLinkNormalFormat = normalFmt;
  21.     cfg.defaultLinkHoverFormat = hoverFmt;
  22.  
  23.     ret.textFlow = TextConverter.importToFlow(txt, TextConverter.TEXT_FIELD_HTML_FORMAT, cfg);
  24. }

Flex Examples:Customizing the appearance or a hyperlink in a TextFlow object in Flex 4
こちらよりの丸パクリ。。。
 

リンクの実装(a タグ)
  1. import flashx.textLayout.elements.LinkElement;
  2. import flashx.textLayout.events.FlowElementMouseEvent;
  3. import mx.controls.Alert;
  4.  
  5. private function init():void {
  6.     var myString:String = "検索サイト:<a href="http://www.google.com/">Google</a>";
  7.     myString.replace(/^<a href=(^.*$)>$/, "<a href=$1 click=\"linkElement_clickHandler(event);\">");
  8.  
  9.     var myRichEditableText:RichEditableText = new RichEditableText();
  10.     myRichEditableText.text = myString;
  11. }
  12.  
  13. protected function linkElement_clickHandler(event:FlowElementMouseEvent):void {
  14.     var linkEl:LinkElement = event.flowElement as LinkElement;
  15.     event.stopImmediatePropagation();
  16.     event.preventDefault();
  17. }

<参考サイト>
Flex Examples:Creating a LinkElement in a Spark RichEditableText control in Flex 4
 

テキストの折り返し

width プロパティを設定しないと折り返しは実現しない。

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-19 (月) 5:11:58 | 最終更新:2010-07-25 (日) 2:22:59

Flash Builder 4 -> LayoutBase

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-18 (日) 21:06:06 | 最終更新:2010-07-25 (日) 2:41:59

Flash Builder 4 -> AS3 で layout の設定
で書いたが、コンテナ系コンポーネントの layout プロパティは
値ではなく LayoutBase クラスのサブクラスで設定する

サブクラス BasicLayout, ButtonBarHorizontalLayout, HorizontalLayout, TileLayout, VerticalLayout

Adobe® Flex® 4 リファレンスガイド:LayoutBase

これ関連で、分かりやすい記事を見つけたのでメモ。
Flexデベロッパーセンター:Flex 4 マスターシリーズ #10 Flex 4 Spark Layouts

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-18 (日) 21:06:06 | 最終更新:2010-07-25 (日) 2:41:59

Flash Builder 4 -> width, height のパーセント指定

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-18 (日) 14:11:44 | 最終更新:2010-07-25 (日) 2:50:44

ActionScript で、コンポーネントの width を 100% にしようとしてはまった・・・。

  1. var myGroup:Group = new Group();
  2. myGroup.width = "100%"; // エラー
  3. myGroup.width = 100%; // エラー

グーグル先生にお伺いを立てると・・・一発回答!
ジャンピング土下座:ActionScriptでのwidth/heightのパーセント指定方法

な、なるほど・・・そういうプロパティがあったのね・・・。

  1. var myGroup:Group = new Group();
  2. myGroup.percentWidth = 100;

チャンチャン!

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-18 (日) 14:11:44 | 最終更新:2010-07-25 (日) 2:50:44

Flash Builder 4 -> XML との連携

Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-18 (日) 4:06:52 | 最終更新:2010-07-18 (日) 4:07:57

まぁ、私にミスがあるんだろうけど・・・。

意味不明なことが・・・。

[データ]-[XML サービスを設定] をしてみたら
最初に XML ファイルを選択した時点で

org.dom4j.DocumentException: Error on line 1 of document :
Element type “hoge” must be followed by either attribute specifications, “>” or “/>”.
Nested exception: Element type “hoge” must be followed by either attribute specifications, “>” or “/>”.

こういうありがたいお告げをいただきました。。。

Flash Builder 4 -> Tree でちゃんと動いていた XML ファイルを指定したのに
どうしてエラーになるんだろう。

エラー内容を調べてみた。
Interstage Business Application Server メッセージ集:3.4.27 FSP_INTS-BAS_AP2555
Flex ではないけど、XML のエラーだし、多分同じよね?

一通りチェックしたけど該当なし。

[mxml]





[/mxml] このデータで試してみても “name” がアカンって言われた。
もしかして日本語(全角文字)が引っ掛かってる?

Posted by muchag | Flash Builder 4 |
初回投稿:2010-07-18 (日) 4:06:52 | 最終更新:2010-07-18 (日) 4:07:57

Flash Builder 4 -> 文字列と XML の相互変換

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-18 (日) 4:06:39 | 最終更新:2010-07-25 (日) 2:40:56

文字列から XML オブジェクトへ
  1. var myXML:XML = new XML(String);

このように文字列を XML コンストラクタの引数にするだけ。

但し、XML の属性値、名前、テキスト値はすべて String データ型で表現されているので
後々数値として利用する場合は Number() 関数等で変換してから利用すること。
 

XML オブジェクトから文字列へ

XML オブジェクトまたはXMLList オブジェクトを文字列に変換する場合は
toString メソッド、あるいは toXMLString メソッドを用いる。

両者の違いは、最下層ノードの時に出る。

  1. var myXML:XML =
  2.     <order>
  3.         <item id='1' quantity='2'>
  4.             <menuName>burger</menuName>
  5.             <price>3.95</price>
  6.         </item>
  7.     <order>;
  8.  
  9. trace(myXML.item[0].menuName.toXMLString());
  10.     // <menuName>burger</menuName>
  11. trace(myXML.item[0].menuName.toString());
  12.     // burger

最下層ノードのときだけは、toString メソッドだと当該ノードの値だけを抽出。

<参考元>
ActionScript 3.0 のプログラミング > ActionScript 3.0 の基本データ型およびコアクラス > XML の操作 > XML の型変換

Posted by muchag | ActionScript 3.0,Flash Builder 4 |
初回投稿:2010-07-18 (日) 4:06:39 | 最終更新:2010-07-25 (日) 2:40:56
« 前ページへ次ページへ »