Hatena::Groupactionscript

ActionScript(AS3)やFlexを勉強しようと思ってはじめた日記

2009年03月16日 月曜日

はてなフォトライフの画像を表示してみる(4)小さい画像から大きい画像を表示する

| 08:16 | はてなフォトライフの画像を表示してみる(4)小さい画像から大きい画像を表示する - ActionScript(AS3)やFlexを勉強しようと思ってはじめた日記 を含むブックマーク はてなブックマーク - はてなフォトライフの画像を表示してみる(4)小さい画像から大きい画像を表示する - ActionScript(AS3)やFlexを勉強しようと思ってはじめた日記 はてなフォトライフの画像を表示してみる(4)小さい画像から大きい画像を表示する - ActionScript(AS3)やFlexを勉強しようと思ってはじめた日記 のブックマークコメント

表示できるようになって、面白くなってきた

やってみたこと

  • 小さい画像をクリックしたら大きい画像を表示するようにしてみました。
  • 大きい画像をクリックしたら、大きい画像は消えるようにした
    • this.parent.removeChild(this)
    • 一旦、親要素からremoveChildをするのってJavaScriptに似ている

課題

  • 写真の情報を大きい画像とともに表示したい
  • もう一度シャッフルすようなボタンが欲しい

ソース(FhatenaViewer.as)

package
{
	import flash.display.DisplayObject;
	import flash.display.StageScaleMode;
	import flash.events.*;
	import flash.net.*;	
	import mx.core.UIComponent;	
	import photo.Photo;
	import photo.PhotoInfomation;

	public class FhatenaViewer extends UIComponent
	{
		public var rdf:Namespace    = new Namespace("rdf",    "http://www.w3.org/1999/02/22-rdf-syntax-ns#");
		public var dc:Namespace     = new Namespace("dc",     "http://purl.org/dc/elements/1.1/");
		public var hatena:Namespace = new Namespace("hatena", "http://www.hatena.ne.jp/info/xmlns#");

		public function FhatenaViewer()
		{
			createPhoto('http://f.hatena.ne.jp/macanai/rss');
		}

		public function onLoading(event:ProgressEvent):void
		{
		}

		public function createPhoto(feed:String):void
		{
			var loader:URLLoader = new URLLoader();
			loader.load(new URLRequest(feed));
			loader.addEventListener(Event.COMPLETE, createPhotoByXML);
			loader.addEventListener(ProgressEvent.PROGRESS, onLoading);
		}

		public function createPhotoByXML(event:Event):void
		{
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.stageFocusRect = false;
			var feed:XML = new XML(event.target.data);
			for each(var item:Object in feed.*::item){
				createPhotoItem(item.hatena::imageurlmedium,item);
			}
		}

		public function createPhotoItem(url:String,item:Object):void
		{
				var p:Photo = new Photo();
				p.property = item;
				p.x = (stage.width - p.width) * Math.random();
				p.y = (stage.height - p.height) * Math.random();
				addChild(p);
				p.loadImage(url);
				p.addEventListener(FocusEvent.FOCUS_IN,pFocusInHandler);
		}

		private function pFocusInHandler(event:FocusEvent):void
		{
			setChildIndex(event.currentTarget as DisplayObject, numChildren - 1);
			var p:PhotoInfomation = new PhotoInfomation();
			p.property = event.currentTarget.property;
			addChild(p);
			p.loadImage(event.currentTarget.property.hatena::imageurl);
			
		}

	}
}

ソース(photo/PhotoInfomation.as)

package photo
{
	import flash.display.Loader;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.net.URLRequest;
	
	public class PhotoInfomation extends Sprite
	{
		public var property:Object;

		public function PhotoInfomation()
		{
		}

		public function loadImage(url:String):void
		{
			var loader:Loader = new Loader();
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadhandler);
			loader.load(new URLRequest(url));
		}

		public function loadhandler(event:Event):void
		{
			addChild(event.target.loader);
			addEventListener(MouseEvent.CLICK, clickListener);
		}
		
		private function clickListener(event:Event):void
		{
			this.parent.removeChild(this);
		}
	}
}