前手順としてXML作成とWebサーバのセットアップが必要です。
方法はHTTPServiceを使用して、ウェブサーバにあるXMLファイルを取得します。このデータをデータバインディングでListコントロールのdataProviderに繋ぎます。
■結果(画像)
■Flash コンテンツ
A Flash Content
■ソースコード
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | <?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"> <fx:Script> <![CDATA[ import mx.collections.ArrayCollection; import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; [Bindable] private var arcColorItems:ArrayCollection; protected function testColorService_resultHandler(event:ResultEvent):void { arcColorItems = event.result.coloritems.coloritem; } protected function btnGetData_clickHandler(event:MouseEvent):void { testColorService.send(); } protected function testColorService_faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString, "Error"); } ]]> </fx:Script> <fx:Declarations> <s:HTTPService id="testColorService" url="https://localhost/testcolor.xml" //サーバーURL 任意に変更 result="testColorService_resultHandler(event)" fault="testColorService_faultHandler(event)"/> </fx:Declarations> <s:VGroup> <s:Button id="btnGetData" label="Get Data" click="btnGetData_clickHandler(event)"/> <s:List id="lisColor" width="200" height="200" dataProvider="{arcColorItems}" labelField="colorname"/> </s:VGroup> </s:Application> |
■XMLデータ
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 | <?xml version="1.0"?> <coloritems> <coloritem> <id>1</id> <colorname>Red</colorname> <colorcode>#FF0000</colorcode> </coloritem> <coloritem> <id>2</id> <colorname>Cyan</colorname> <colorcode>#00FFFF</colorcode> </coloritem> <coloritem> <id>3</id> <colorname>Blue</colorname> <colorcode>#0000FF</colorcode> </coloritem> <coloritem> <id>4</id> <colorname>DarkBlue</colorname> <colorcode>#0000A0</colorcode> </coloritem> <coloritem> <id>5</id> <colorname>LightBlue</colorname> <colorcode>#ADD8E6</colorcode> </coloritem> <coloritem> <id>6</id> <colorname>Purple</colorname> <colorcode>#800080</colorcode> </coloritem> <coloritem> <id>7</id> <colorname>Yellow</colorname> <colorcode>#FFFF00</colorcode> </coloritem> <coloritem> <id>8</id> <colorname>Lime</colorname> <colorcode>#00FF00</colorcode> </coloritem> <coloritem> <id>9</id> <colorname>Magenta</colorname> <colorcode>#FF00FF</colorcode> </coloritem> <coloritem> <id>10</id> <colorname>White</colorname> <colorcode>#FFFFFF</colorcode> </coloritem> <coloritem> <id>11</id> <colorname>Silver</colorname> <colorcode>#C0C0C0</colorcode> </coloritem> <coloritem> <id>12</id> <colorname>Gray</colorname> <colorcode>#808080</colorcode> </coloritem> <coloritem> <id>13</id> <colorname>Black</colorname> <colorcode>#000000</colorcode> </coloritem> <coloritem> <id>14</id> <colorname>Orange</colorname> <colorcode>#FFA500</colorcode> </coloritem> <coloritem> <id>15</id> <colorname>Brown</colorname> <colorcode>#A52A2A</colorcode> </coloritem> <coloritem> <id>16</id> <colorname>Maroon</colorname> <colorcode>#800000</colorcode> </coloritem> <coloritem> <id>17</id> <colorname>Green</colorname> <colorcode>#008000</colorcode> </coloritem> <coloritem> <id>18</id> <colorname>Olive</colorname> <colorcode>#808000</colorcode> </coloritem> </coloritems> |
http://www.adobe.com/devnet/flex/videotraining/exercises/ex2_05_htt.html#articlecontentAdobe_numberedheader
0 件のコメント:
コメントを投稿