Flexでウェブアルバムが作りたい!!(5)

移転しました。

user_idとapi_keyは各自のものに置き換えてください。そして、かなりコードはつぎはぎだらけで汚いですがなんとか動いています。

なんとか試行錯誤していくうちに、

あたりがちょっとだけわかってきた気がします。

今後の課題としては、やはりポップアップ。
これがくせ者で、なかなか思い通りにデータを連携させることができません。

このデータの連携がうまく行かないせいで、卒論にも手がつかず・・・・


以下は、そのときのソースです。

FlickrSearch.mxml(メインアプリケーション)

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    backgroundGradientColors="[0xFFFFFF, 0xAAAAAA]"
    horizontalAlign="left"
    verticalGap="15"
    horizontalGap="15" initialize="init()">
<mx:Script>
	<![CDATA[
		import flash.events.Event;
		import flash.events.IOErrorEvent;
		import flash.net.URLLoader;
		import flash.net.URLLoaderDataFormat;
		import flash.net.URLRequest;
		import mx.collections.ArrayCollection;
		
		//NSID、api_keyを格納
		private var user_id:String = "1234567@1234";
		private var api_key:String = "1234567890123456789";
		private var tags:String = "apple";
		private var loop:int = 50;
		
		//返り値のXMLを格納するXMLオブジェクトを生成
		private var myXML:XML;
		[Bindable]
		public var ArrayURL:ArrayCollection;
		
		private function init():void{
			//http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=b2e2bdd12587da70a37b430e1f09c2a3&user_id=35571855%40N06
			var furl:String = "http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=" + api_key + "&tags=" + tags;
			var myURLReq:URLRequest = new URLRequest(furl);
			
			//リクエスト発行します
			var myXMLLoader:URLLoader = new URLLoader();
			myXMLLoader.dataFormat = URLLoaderDataFormat.TEXT;
			myXMLLoader.addEventListener(Event.COMPLETE,setPhotoXML);
			myXMLLoader.addEventListener(IOErrorEvent.IO_ERROR,isError);
			myXMLLoader.load(myURLReq);
		}
		
		private function setPhotoXML(e:Event):void{
			//読み込んだ後の処理を記述
			myXML = new XML(e.target.data);
			ArrayURL = new ArrayCollection();
			for(var i:int=0;i<loop;i++){
				var photo_id:String = myXML.photos.photo[i].@id;
				var farm_id:String = myXML.photos.photo[i].@farm;
				var server_id:String = myXML.photos.photo[i].@server;
				var secret:String = myXML.photos.photo[i].@secret;
				var size:String = "m"
				var photoURL:String = "http://farm" + farm_id + ".static.flickr.com/" + server_id + "/" + photo_id + "_" + secret + "_" + size +".jpg"
				//var photoURL_m:String = "http://farm" + farm_id + ".static.flickr.com/" + server_id + "/" + photo_id + "_" + secret + "_" + "m" +".jpg"
				ArrayURL.addItem(photoURL);
			}
		}
		
		//例外処理
		private function isError(e:IOErrorEvent):void{
			trace("failed to Load photos info");
		}

	]]>
</mx:Script>
	
	<mx:Panel width="880" height="650" layout="absolute" title="JOY Album" id="AlbumPanel" horizontalCenter="0" verticalCenter="-2">
		<mx:TileList width="850" height="600" dataProvider="{ArrayURL}" itemRenderer="PhotoWindow" id="item" borderStyle="solid">
		</mx:TileList>
	</mx:Panel>
	
</mx:Application>

PhotoWIndow.mxmlMXMLコンポーネント

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
	width="250" height="250"
	horizontalAlign="center"
	paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5">
	
<mx:Script>
	<![CDATA[
		import mx.core.Application;
		import mx.controls.Label;
		import mx.controls.Alert;
		import mx.managers.PopUpManager;
		import mx.controls.Image;
		import flash.events.Event;
		
		[Bindable]
		public var thumbnil:Image;
		
		private function click():void{
			//var pop:PopUpWIndow = PopUpWIndow(PopUpManager.createPopUp(this,PopUpWIndow,false));
			//PopUpManager.centerPopUp(pop);
		}

		private function closePopup():void{
			PopUpManager.removePopUp(this);
		}
	]]>
</mx:Script>

<mx:Image source="{data}" id="photoIMG" scaleContent="true" themeColor="#009DFF" click="click()"></mx:Image>
</mx:VBox>

PopUpWindow.mxmlMXMLコンポーネント

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="300" showCloseButton="true" 
    close="PopUpManager.removePopUp(this);" initialize="showImg(event)">
    <mx:Script>
        <![CDATA[
            import mx.managers.PopUpManager;
            [Bindable]
            public var bigImg:String;
            
            private function processLogin():void {
                // Check credentials (not shown) then remove pop up.
                PopUpManager.removePopUp(this);
            }
            
            private function showImg(event:Event):void{
            	//bigImg = event.target.pop.thumbnil;
            }
        ]]>
    </mx:Script>
    <mx:Image source="{}">
    </mx:Image>
    <mx:Label text="{}">
    	
    </mx:Label>
</mx:TitleWindow>