MXMLTest10 External XML Read Test (Listタグで外部XMLデータをループ表示)

/**
 * Copyright siouxcitizen ( http://wonderfl.net/user/siouxcitizen )
 * MIT License ( http://www.opensource.org/licenses/mit-license.php )
 * Downloaded from: http://wonderfl.net/c/dKKt
 */

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  layout="absolute" width="500" height="500" backgroundColor="#333333">
    <mx:Script>
        <![CDATA[
            //Yahooショッピングから"出石そば"で検索した結果(XML)を処理
            //Listを使って外部XMLデータをループ表示できるようにしました。
            //検索結果サムネイル画像クリックでYahooのページへとびます。
                        
            //XMLデータをListで表示するため、一度XMLデータを連想配列、配列に詰め直しました。                                   
            //↑XMLデータを直接セットした場合Listでうまく表示されなかったので。
            //↓そのデータ入れ替えについては下記サイトを参考にしました。
            //http://www.fxug.net/modules/xhnewbb/viewtopic.php?topic_id=1356
            
            private var query:String = "出石そば";//検索キーワード デフォルト値設定
            private var URL:String;  //クエリ先URL
            private var loader:URLLoader;
            private var xmlData:XML;
            private var ns:Namespace = new Namespace("urn:yahoo:jp:itemSearch"); 
            
            private var preName:String = "タイトル : "; 
            private var preHeadline:String = "ここがウリ!!! : "; 
            private var prePrice:String = "お値段 : "; 
            private var preReviewCnt:String = "商品レビュー数 : "; 
            private var preReview:String = "　　商品レビューポイント : ";
            private var preRatingCnt:String = "お店レーティング数 : "; 
            private var preRating:String  = "　　お店レーティングポイント : ";
                       
            //クエリ先URLと検索キーワードを結合後、クエリ先URLへ検索を行う            
            private function testXMLDataDisplay():void {
                //外部XML処理中はボタンを不活性化
                btnTest.enabled = false; 
                
                //URL＋クエリ情報設定
                URL = "http://shopping.yahooapis.jp/ShoppingWebService/V1/itemSearch?appid=uQ_E1kmxg64.0fo1fkMwTnvcEmBn.foaHDXp0MF8WvUXD3jQcDaDIAuC0b6zRFmh3BT2umN6&query=" + escapeMultiByte(query); 
                var request:URLRequest = new URLRequest(URL);
                request.url = URL;
                loader = new URLLoader();
                loader.addEventListener(Event.COMPLETE, completeHandler);
                
                try {
                    loader.load(request);
                } catch (error:Error) {
                    trace("Unable to load requested document.");
                }    
            }

            //クエリ先より取得したXMLを処理            
            private function completeHandler(event:Event):void {
                xmlData = new XML(loader.data);
                //名前空間設定
                default xml namespace = ns; 
                //XMLデータを移し変える配列を準備 
                var dataList:Array = new Array();
                
                for each(var element:Object in xmlData.Result.Hit){
                    var dataObj:Object = new Object(); //データ移し変え用連想配列
                    dataObj.name= preName+element.Name;
                    dataObj.headline = preHeadline + element.Headline;
                    dataObj.price = prePrice + element.Price;
                    dataObj.review = preReview + element.Review.Rate;
                    dataObj.reviewCnt = preReviewCnt + element.Review.Count;
                    dataObj.rating = preRating + element.Store.Ratings.Rate
                    dataObj.ratingCnt = preRatingCnt + element.Store.Ratings.Count
                    dataObj.linkURL = element.Url;
                    dataObj.imgURL = element.Image.Small;
                    dataList.push(dataObj);
                }
                //XMLデータを移し変えた配列をデータプロバイダーにセット
                list.dataProvider = dataList;
                
                //外部XML処理後にボタンを活性化
                btnTest.enabled = true;            
            }
            
            //変更されたコンボボックスの値をセット
            private function onChangeCombo():void {
                query = String(comboTest.selectedItem);
            }
        ]]>
    </mx:Script>
    <mx:Button id="btnTest" click="testXMLDataDisplay();" x="10" y="10" label="検索" enabled="true"/>
    <mx:ComboBox id="comboTest" x="70" y="10" change="onChangeCombo()">
        <mx:ArrayCollection>
            <mx:String>出石そば</mx:String>
            <mx:String>但馬牛</mx:String>
            <mx:String>ズワイガニ</mx:String>
        </mx:ArrayCollection>
    </mx:ComboBox>
    
    <mx:List id="list" x="10" y="40" width="450" height="410" backgroundColor="#AAAAAA">
        <mx:itemRenderer>
            <mx:Component>
                <mx:Canvas width="700" height="130">
                    <mx:Image source="{data.imgURL}" click="navigateToURL(new URLRequest(data.linkURL))"/>
                    <mx:Text x="80" y="0" text="{data.name}"/>
                    <mx:Text x="80" y="20" text="{data.headline}"/>
                        
                    <mx:Text x="80" y="40" text="{data.reviewCnt}"/>
                    <mx:Text x="220" y="40" text="{data.review}"/>
                        
                    <mx:Text x="80" y="60" text="{data.ratingCnt}"/>
                    <mx:Text x="220" y="60" text="{data.rating}"/>
                        
                    <mx:Text x="0" y="80" text="{data.price}"/>
                    <mx:HRule width="650"/>
                </mx:Canvas>
            </mx:Component>
        </mx:itemRenderer>                                     
    </mx:List>  
    
</mx:Application>