AIR 3 & FP11 - RTMFP + Starling framework

Project/Programming 2012.01.17 11:36
    

설정

트랙백

댓글

Starling performance test

Project/Programming 2012.01.10 21:58

package {
	import starling.events.Event;
	import starling.core.Starling;
	import starling.display.Sprite;
	import starling.display.Button;
	import starling.textures.Texture;
	import starling.display.DisplayObject;
	import starling.display.Image;
	import starling.utils.deg2rad;
	import flash.display.Bitmap;


	public class Demo extends Sprite {

		[Embed(source = "f60.png")]
		private var MyBitmap:Class;
		
		private var _myTexture:Texture;
		private var _arrButterflys:Vector.<Butterfly>;

		public function Demo() {
			// addedToStage 이벤트에 대한 리스너 추가
			addEventListener( Event.ADDED_TO_STAGE , onAddedToStage);
		}


		private function onAddedToStage(e:Event):void {
			var myBitmap:Bitmap = new MyBitmap() as Bitmap;
			_myTexture = Texture.fromBitmap(myBitmap);

			var len:int = 800;
			
			_arrButterflys = new Vector.<Butterfly>(len, false);
			
			for (var i:int = 0; i<len; i++) {
				var fly:Butterfly = new Butterfly(_myTexture);
				
				fly.alpha = Math.random();
				fly.destX = Math.random()*stage.stageWidth;
				fly.destY = Math.random()*stage.stageHeight;
				
				fly.setVertexColor(0, Math.random()*0xFFFFFF);
				fly.setVertexColor(1, Math.random()*0xFFFFFF);
				fly.setVertexColor(2, Math.random()*0xFFFFFF);
				fly.setVertexColor(3, Math.random()*0xFFFFFF);
				
				fly.x = Math.random()*stage.stageWidth;
				fly.y = Math.random()*stage.stageHeight;
				fly.rotation = deg2rad(Math.random()*360);
				
				fly.pivotX = fly.width >> 1;
				fly.pivotY = fly.height >> 1;
				
				_arrButterflys[i] = fly;
				addChild(fly);
			}

			stage.addEventListener(Event.ENTER_FRAME, onFrame);
		}
		
		private function onFrame(e:Event):void{

			var len:uint = _arrButterflys.length;

			for (var i:int = 0; i < len; i++){

				// move the sausages around
				var fly:Butterfly = _arrButterflys[i];
				
				fly.x -= ( fly.x - fly.destX ) * .1;
				fly.y -= ( fly.y - fly.destY ) * .1;

				if (Math.abs(fly.x - fly.destX)<1 && Math.abs(fly.y-fly.destY) < 1){
					fly.destX = Math.random()*stage.stageWidth;
					fly.destY = Math.random()*stage.stageHeight;
					fly.rotation = deg2rad(Math.random()*360);
				}
			}
		}

		public override function dispose():void {
			removeEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
			_myTexture.dispose();
			super.dispose();
		}
	}
}

import starling.display.Image;
import starling.textures.Texture;

class Butterfly extends Image{
	
	public var destX:Number = 0;
	public var destY:Number = 0;
	
	public function Butterfly(inTexture:Texture):void{
		super(inTexture);
	}
}

    

설정

트랙백

댓글

  • scrubs 2012.03.11 00:33 ADDR 수정/삭제 답글

    소셜미디어는 인기소설가의 글과 같은 글재주를 요구하지 않습니다. 보고 듣기를 잘하면 소셜미디어에서는 환영받을수 있습니다.

[Starling-07] MovieClip 클래스를 이용한 애니메이션

Project/Programming 2012.01.09 00:49
Flash에서 애니메이션이라고 하면 역시 MovieClip이지만 Starling에도 MovieClip 클래스가 있다. 물론 애니메이션을 위한 클래스지만 Starling의 MovieClip은 화면에 표시할 수 있는 것이 비트맵 이미지 또는 색상을 지정한 사각형 뿐이다. 따라서 MovieClip라는 이름은 같지만 Starling의 MovieClip은 프레임마다 할당된 비트맵을 표시하는 클래스인 것이다.

또한 Starling MovieClip의 자식 객체를 관리하거나 프레임에 스크립트가 들어가는 기능은 없다. 이 점도 Flash Player의 MovieClip과는 크게 다르다. (Starling은 표시 목록의 관리는 Sprite의 책임이다. 한편, MovieClip은 Image 클래스에 타임 라인 기능을 더한 Image의 서브 클래스다. MovieClip이 Sprite의 하위 클래스인 Flash Player와는 달리, 양쪽의 역할은 분리되어 있다.)


스프라이트 시트와 TextureAtlas
MovieClip의 각 프레임을 볼 때 GPU는 표시 프레임에 할당된 텍스처, 셰이더에서 사용할 수 있도록 준비가 이루어진다. 이 때 텍스처가 프레임마다 물리적으로 다른 비트맵 파일이면 프레임을 진행할 때마다 텍스처 전환이 발생한다.

텍스처 전환 처리에는 당연히 시간이 걸린다. 또한 텍스처의 GPU에 업로드가 필요할 때 추가 오버헤드가 증가한다. 일반적으로 이 문제를 해결하기 위해 각 프레임의 텍스처를 하나의 파일에 정의한다. 이 것을 스프 라이트 시트라고  한다.

아래 그림은 Starling 샘플에 포함된 스프라이트 시트의 일부를 자른 것이다.




여러 프레임에 해당하는 텍스처가 1개의 파일로 되어 있으면 GPU를 이용해서 사용 위치를 바꾸는 것만으로 텍스처 자체를 전환하지 않고 렌더링 처리가 가능하다. 따라서 고속 프레임을 업데이트할 수 있다.

또한 Stage3D에서 취급할 수 있는 텍스처의 폭은 2의 계승이라는 규칙 때문에, 그 이외의 너비 텍스처는 Starling 내부에 여분의 사전 처리가 발생한다. 하지만 스프라이트 시트의 경우 표시되는 텍스처가 더 큰 텍스처(스프라이트시트)가 아니기 때문에 개별 텍스처 너비 사이즈를 걱정할 필요가 없다.

이 것을 최적화한 1단계가 TextureAtlas다. TextureAtlas는 여러 스프라이트시트를 하나의 파일에 정리한 것이다. 동시에 여러 애니메이션을 재생하는 경우 특히 유용하다. TextureAtlas를 만들기 위해, 차기 버전의 Flash Professional CS6에서 지원되는 것 같다. 벡터 애니메이션 스프라이트시트로 내보내기 기능을 기다리거나 Texture Packer 등의 도구를 이용하면 된다.


TextureAtlas 로드
TextureAtlas를 사용하여 프레임마다 각각 TextureAtlas의 어떤 영역을 표시할지 정보가 필요하다. 따라서 다음과 같은 형식으로 각 프레임의 텍스처 정보를 지정하게 되어 있다. 도구를 사용하여 TextureAtlas를 생성하는 경우 이러한 XML 파일도 동시에 생성된다.

  
  
  
  


TextureAtlas 태그 imagePath 속성은 TextureAtlas의 파일 이름이다. SubTexutre 태그의 name 속성은 애니메이션의 고유 이름 뒤에 프레임 번호를 추가한 것이다. 나머지 x, y, height, width에서 텍스처로 사용 영역을 지정한다. (실제로 SubTexture는 텍스처의 일부를 처리하는 클래스가 있다) TextureAtlas가 준비되면 다음과 같은 프로그램에 포함한다.
[Embed (source = "atlas.png")]
private static const MyBitmap:Class;
 
[Embed (source = "atlas.xml"mimeType = "application / octet - stream")]
private static const MyXml:Class;

이러한 정보는 TextureAtlas라는 클래스에서 함께 관리한다. TextureAtlas(PNG 파일)은 일단 Texture 클래스 로딩하면서 XML 파일과 함께 TextureAtras 생성자에 전달한다. TextureAtlas 객체에서 고유 이름을 지정하여 Texture(실제로는 SubTexture의) 벡터를 얻을 수 있다. 이 때 사용하는 메소드가 getTextures()다.
import starling.textures.TextureAtlas;

	private function onAddedToStage(e:Event):void {
		// 텍스처 아틀라스로드
		var myTexture:Texture = Texture.fromBitmap(new MyBitmap);
		// 텍스처 아틀라스의 영역 정보 가져오기
		var myXml:XML = XML(new MyXml);

		// TextureAtlas 인스턴스 생성
		var myTextureAtlas:TextureAtlas = new TextureAtlas(myTexture,myXml);
		// "walk_"를 식별 이름으로 가진 Texture 벡터 생성
		var frames:Vector. = myTextureAtlas.getTextures("walk_");

		// ... 앞으로는 아래에 계속
	}

벡터의 첫 번째 텍스처의 크기가 애니메이션의 영역을 결정한다. 애니메이션 여기까지 왔으면 나머지는 MovieClip의 인스턴스를 생성하면 된다. MovieClip 생성자의 인수에서 얻은 텍스처 벡터를 지정한다.
import starling.display.MovieClip;

	private var myMovieClip:MovieClip;

	private function onAddedToStage(e:Event):void {
		//... 위에서 계속

		// MovieClip 객체의 생성
		myMovieClip = new MovieClip(frames);

		// 애니메이션 재생 시작
		Starling.juggler.add(myMovieClip);
		addChild(myMovieClip);
	}

알겠지만, Tween뿐만 아니라 MovieClip의 재생도 Juggler을 사용한다. MovieClip도 IAnimatable의 서브클래스다. Juggler에 MovieClip을 추가하면 재생이 시작된다. 재생을 제어하는​​ 세 가지 메소드가 포함되어 있다.
myMovieClip.play();
myMovieClip.pause();
myMovieClip.stop();

pause()를 실행한 다음에 play()를 실행하면 현재 상태부터 재생되지만 stop()을 실행한 다음에 play()를 호출하면 처음 부터 다시 재생된다. 애니메이션은 default로 반복 재생된다. 이 설정은 loop 속성을 설정하여 바꿀 수 있다. 재생 여부 isPlaying 속성을 확인한다. 애니메이션이 끝까지 재생되면 movieComplete 이벤트가 발생한다. 재생이 완​​료되면 다음 작업으로 이동하고자하는 경우에 사용할 수 있을 것이다.
myMovieClip.addEventListener(Event.MOVIE_COMPLETED, onMovieComplete);

애니메이션이 반복되는 경우에는 재생이 완​​료될 때마다 movieComplete 이벤트가 발생한다. MovieClip의 부모 Sprite가 Stage에서 제거되면 MovieClip 재생을 중지해야한다. 그래서 다음과 같은 코드를 추가한다.
addEventListener(Event.REMOVED_FROM_STAGE,onRemovedFromStage);

	private function onRemovedFromStage(event:Event):void {
		Starling.juggler.remove(myMovieClip);
	}

Juggler의 remove() 메소드는 MovieClip뿐만 아니라 Tween도 삭제할 수 있다. 또 다른 MovieClip 사용 MovieClip의 생성자의 두 번째 파라미터에 임의의 프레임 속도를 지정할 수 있다.
// 40 fps를 지정
myMovieClip = new MovieClip (frames, 40);

MovieClip마다 다른 프레임 속도를 지정할 수 있다. 재생중인 프레임 속도는 fps 속성에서 가져올 수 있다. 또한 fps 속성 값을 설정하여 프레임 속도를 변경할 수도 있다. 그리고 모든 프레임에 대해 별도의 재생 시간을 지정할 수 있다. 아래는 5 번째 프레임을 2 초 동안 재생하도록 설정하는 예다.
myMovieClip.setFrameDuration(5, 2);

나중에 프레임을 추가하거나 삭제할 수도 있다. 이를 위해서 addFrameAt() removeFrameAt() 메서드를 사용한다. 아래는 5 프레임 애니메이션을 10번 째 프레임에 추가하거나 5 프레임을 제거하는 것이다. 
myMovieClip.addFrameAt(5, frames [10]);
myMovieClip.removeFrameAt(5);

프레임의 텍스처를 바꿀 수도 있다. setFrameTexture() 메소드를 사용하면 된다.
myMovieClip.setFrameTexture(5, frames [10]);

프레임에 소리를 연결할 수도 있다. setFrameSound() 메서드를 사용한다.
[Embed (source = "step.mp3")]

private static const StepSound:Class;
 
myMovieClip.setFrameSound (5, new StepSound() as Sound);

이제 5번 째 프레임이 표시되는 타이밍에 지정한 소리가 재생된다. 프레임에 직접 스크립트를 연결할 수는 없다. 그 대신 Juggler.delayCall() 메서드를 사용할 수 있다. 이상에서 Starling 애니메이션의 기본은 끝이다. Starling 표현의 유연성은 CPU 렌더링보다 미약하다. 그러나 빠른 렌더링을 안정적으로 해야할 경우에 선택하면 적당할 것이다.


원본 : http://cuaoar.jp/2011/12/movieclip-starling.html


 


package {
	import starling.events.Event;
	import starling.display.Sprite;
	import starling.display.DisplayObject;
	import starling.display.Image;
	import starling.textures.Texture;
	import starling.textures.RenderTexture;
	import starling.textures.TextureAtlas;
	import starling.display.MovieClip;
	import starling.core.Starling;

	public class Demo extends Sprite {

		[Embed(source = "patch.png")]
		private var MyBitmap:Class;

		[Embed(source = "patch.xml",mimeType = "application/octet-stream")]
		private var MyXml:Class;
		
		private var _arrMovieClips:Array;


		public function Demo() {
			// addedToStage 이벤트에 대한 리스너 추가
			addEventListener(Event.ADDED_TO_STAGE,onAddedToStage);
		}
		private function onAddedToStage(e:Event):void {

			// 텍스처 아틀라스로드
			var myTexture:Texture = Texture.fromBitmap(new MyBitmap());

			// 텍스처 아틀라스의 영역 정보 가져오기
			var myXml:XML = XML(new MyXml());

			// TextureAtlas 인스턴스 생성
			var myTextureAtlas:TextureAtlas = new TextureAtlas(myTexture,myXml);

			// "walk_"를 식별 이름으로 가진 Texture 벡터 생성
			var frames:Vector.<Texture>=myTextureAtlas.getTextures("patch_");

			// MovieClip 객체의 생성
			
			_arrMovieClips = [];
			var count:int = 20;
			for(var i:int=0;i<count;i++){
				var myMovieClip = new MovieClip(frames, 60);
				myMovieClip.x = 20+((stage.stageWidth-90)/count)*i;
				myMovieClip.y = stage.stageHeight - myMovieClip.height >> 1;
				Starling.juggler.add(myMovieClip);
				_arrMovieClips.push(myMovieClip);
				addChild(myMovieClip);
				
			}
			
		//	myMovieClip.setFrameDuration(5, 2);

		//	myMovieClip.addFrameAt(5,frames[10]);
		//	myMovieClip.removeFrameAt(5);
		}

		private function setAlign(inTarget:DisplayObject):void{
			inTarget.x = stage.stageWidth >> 1;
			inTarget.y = stage.stageHeight >> 1;
		}

		public override function dispose():void {
			removeEventListener(Event.ADDED_TO_STAGE,onAddedToStage);
			super.dispose();
		}
	}
}

    

설정

트랙백

댓글

[Starling-06] 비트맵을 표시하는 방법

Project/Programming 2012.01.08 04:49
이번에는 비트맵(텍스처)을 표시하는 방법이다. Starling에서는 비트맵 또는 이전 포스트와 같이 사각형을 사용하여 화면을 구성한다. 기사의 뒷 부분에서 동적으로 텍스처 업데이트하는 방법도 소개한다. (참고 : 앞으로 내용에서 "텍스처 = 비트맵"으로 이해)


Image와 Texture 클래스
Starling 프레임워크는 비트맵을 표시하기 위하여 Image를 사용한다. Image는 Quad의 서브클래스다. 따라서 Quad에서 비트맵 처리 기능을 추가한 것이 Image 클래스가 되는 것이다. Flash Player 표시 객체는 Bitmap에 BitmapData가 있지만 Starling에서는 Image에 Texture가 있다. Texture에 로드할 수 있는 이미지 포멧은 PNG, JPEG, JPEG-XR, ATF 이렇게 4 종류이다. 각 형식마다 전용 읽기 함수가 포함되어 있다. 예를 들어, Bitmap 객체에서 Texture 객체를 만드는 경우 다음과 같다.
var myTexture:Texture = Texture.fromBitmap(myBitmap);

다음은 생성된 Texture에서 Image 객체를 생성하고 표시 목록에 추가하는 것만으로 화면에 비트맵이 표시된다. 아래는 myBitmap.png라는 파일을 표시하는 예제다. 포함된 비트맵 처리 부분을 제외하면 사각형을 표시하는 샘플 코드와 거의 동일하다.

package { import starling.events.Event; import starling.display.Sprite; import starling.display.Image; import starling.textures.Texture; import flash.display.Bitmap; public class Demo extends Sprite { // PNG 파일을 포함 [Embed(source = "icon128.png")] private var MyBitmap:Class; private var myImage:Image; public function Demo() { // addedToStage 이벤트에 대한 리스너 추가 addEventListener( Event.ADDED_TO_STAGE , onAddedToStage); } private function onAddedToStage(e:Event):void { var myBitmap:Bitmap = new MyBitmap() as Bitmap; // Bitmap에서 Texture 오브젝트를 생성 var myTexture:Texture = Texture.fromBitmap(myBitmap); // Image 객체를 생성 myImage = new Image(myTexture); // 표시 목록에 추가 addChild(myImage); } public override function dispose():void { removeEventListener(Event.ADDED_TO_STAGE, onAddedToStage); super.dispose(); } } }

Starling의 Texture는 가로와 세로 픽셀 수가 2층(1, 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048)을 전제로하고 있는 것 같다. 다른 크기의 비트맵에서 Texture를 생성하면 Starling은 자동으로 가장 가까운 크기에 맞게 Texture를 다시 만든다.


벡터 이미지를 텍스처로보기
Flash Player 표시 객체는 벡터 데이터를 비트맵화 하는 기능을 가지고 있다. 이것을 이용하면 AS3 및 Flash Professional 기능을 사용하여 그린 벡터 이미지에서 Image 개체를 생성할 수 있다. 처리 효율을 생각하면 일부러 런타임에 비트맵을 생성하는 것보다는 사전에 비트맵화해 두는 것이 좋을 것이다. 따라서 이 방법은 동적으로 텍스처를 생성해야하는 경우에 필요하다. 구체적인 예를 소개한다. 아래는 Sprite의 graphic 특성에 그린 원을 텍스처로 변환하여 Image 객체로 화면에 표시하는 예제다.

private function onAddedToStage(e:Event):void{ var radius:uint = 100; // Flash Player의 Sprite를 생성 var shape : flash.display.Sprite = new flash.display.Sprite(); // 임의의 색상을 결정 graphics 속성 원을 그린다 var color:uint = Math.random() * 0xFFFFFF; shape.graphics.beginFill(color); shape.graphics.drawCircle(radius, radius, radius); shape.graphics.endFill(); // Sprite를 BitmapData로 변환; var buffer : BitmapData = new BitmapData (radius * 2, radius * 2, true, color); buffer.draw(shape); // BitmapData에서 Texture를 생성 var myTexture:Texture = Texture.fromBitmapData(buffer); // Texture에서 Image를 만듭니다 myImage = new Image(myTexture); // 표시 목록에 추가 addChild(myImage); }

이 경우 코드에서 Flash Player 표시 객체를 사용하게되므로, Starling 표시 객체와 혼동하지 않도록 주의가 필요하다.


동적 텍스처의 업데이트
위의 방법을 사용하면 동적으로 생성한 비트맵을 볼 수 있다. 그러나 표시 비트맵을 업데이트하려면 벡터 이미지 만들기부터 다시 한다. 즉, CPU 그리기 및 GPU 렌더링이 모두 행해지는 것은 그다지 효율적 수단은 아닌 것 같다.(항상 피해야한다는 의미는 아니다.)

이럴 때는 RenderTexture 클래스가 유용하다. RenderTexture은 Texture의 서브 클래스에서, "Starling 표시 객체"를 기존의 Image 객체에 그리는 기능을 제공한다. 이는 GPU만을 사용하기 때문에 효율적이다. RenderTexture은 "Flash Player 표시 객체"를 취급하지 않기 때문에 이미 준비되어 있는 Image 객체를 비트맵으로 합성하는 방법이 기본이다. 특히 미리보기 그래픽을 알고 있는 경우에 유효하다. RenderTexture 생성자는 그리기 영역의 크기만을 지정한다. 이 시점에서 RenderTexture 아직 새하얀(투명)상태다.다음으로 RenderTextire 인스턴스를 사용하여 Image의 인스턴스를 생성하는 단계로 위 코드에서 보았던 방식 그대로다.

import starling.textures.RenderTexture; private var myRenderTexture:RenderTexture; private function onAddedToStage(e : Event):void { // RenderTexture 객체를 생성 myRenderTexture = new RenderTexture(320,480); // RenderTexture에서 Image를 만든다 var canvas:Image = new Image(myRenderTexture); // 표시 목록에 추가 addChild(canvas); }

이제 그리기 영역 지정이 완료되었다.
다음은 RenderTexture를 업데이트하면 화면 표시도 자동으로 업데이트된다. RenderTexuture에 Starling의 표시 객체를 그리려면, draw() 메서드를 사용한다. 그릴 표시 객체는 위치, 비율, 각도, 알파를 지정할 수 있다. 아래 예제에서는 RenderTexture의 x 좌표와 y 좌표를 지정하고 있다.

myImage.x = 10; myImage.y = 20; myRenderTexture.draw(myImage);

많은 표시 객체를 그리고 싶은 경우를 위해, drawBundled() 메소드도 포함되어 있다. 이것은 여러 표시 객체 그리기를 일괄적으로 실행하는 것으로, 처리 효율의 향상을 노린 것이다. GPU를 효율적으로 사용하기 위해서 GPU에 대한 그리기 요청 횟수를 줄이는 것은 중요하다. drawBundled()의 인수는 함수를 지정한다. 함수에서 draw()은 함께 처리된다. 아래는 이미지를 조금씩 회전시키는 예제다.
myRenderTexture.drawBundled(rot);
	private function rot():void {
		var count:int = 30;
		var diff:Number = 2 * Math.PI / count;

		for (var i:int = 0; i < count; ++i) {
			myImage.rotation = diff * i;
			myRenderTexture.draw(myImage);
		}
	}

행하면 아래와 같이된다.



이미지는 Starling 샘플에 포함된 것을 사용했다. RenderTexture에 그려진 내용을 모두 삭제하려면 clear() 메소드를 사용한다.


자원의 해제
불필요하게 된 텍스처가 있는 경우에는 dispose()가 리소스를 해제한다. 특히 RenderTexture은 일시적인 이용이 많다고 생각되므로 잊지 말아야한다.
public override function dispose():void {
		myRenderTexture.dispose();
		super.dispose();
	}

원본 : http://cuaoar.jp/2011/12/starling-flash-1.html


 
package {
	import starling.events.Event;
	import starling.display.Sprite;
	import starling.display.Image;
	import starling.textures.Texture;
	import flash.display.BitmapData;
	import flash.display.Bitmap;
	import starling.textures.RenderTexture;

	public class Demo extends Sprite {

		[Embed(source = "icon128.png")]
		private var MyBitmap:Class;

		private var myRenderTexture:RenderTexture;
		private var myImage:Image;

		public function Demo() {
			// addedToStage 이벤트에 대한 리스너 추가
			addEventListener( Event.ADDED_TO_STAGE , onAddedToStage);
		}
		private function onAddedToStage(e:Event):void {

			// RenderTexture 객체를 생성
			myRenderTexture = new RenderTexture(330,330);

			// RenderTexture에서 Image를 만든다
			var canvas:Image = new Image(myRenderTexture);

			canvas.x = stage.stageWidth- canvas.width >> 1;
			canvas.y = stage.stageHeight- canvas.height >> 1;
			// 표시 목록에 추가
			addChild(canvas);


			var myBitmap:Bitmap = new MyBitmap() as Bitmap;

			// Bitmap에서 Texture 오브젝트를 생성
			var myTexture:Texture = Texture.fromBitmap(myBitmap);

			// Image 객체를 생성
			myImage = new Image(myTexture);
			myImage.x = 165;
			myImage.y = 165;
			
			addEventListener(Event.ENTER_FRAME, run);

		}
		
		private function run(e:Event):void{
			myRenderTexture.drawBundled(rot);
		}

		private function rot():void {
			var count:int = 8;
			var diff:Number = (Math.random()*2) * Math.PI / count;

			for (var i:int = 0; i < count; ++i) {
				myImage.rotation += diff * i;
				myRenderTexture.draw(myImage);
			}
		}

		public override function dispose():void {
			removeEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
			removeEventListener(Event.ENTER_FRAME, run);
			myRenderTexture.dispose();
			myImage.dispose();
			super.dispose();
		}
	}
}
 
    

설정

트랙백

댓글

[Starling-01] Starling 2D framework 소개

Project/Programming 2012.01.04 12:31

Starling은 FlashPlayer 11 버전에서 새롭게 추가된 3D 렌더링 기능 “Stage3D”를 이용하여 만들어진 오픈 소스 2D ActionScript framework이다. FreeBSD 라이선스로 배포되고 있다.

현재 버전은 0.9이며 다운로드는 Starling Framework v0.9.1

Stage3D는 direct로 GPU 기능을 활용할 수 있기 때문에 기존보다 훨씬 빠른 렌더링이 가능하다. 이미 다양한 3D framework가 Stage3D를 활용하고 있다. (Alternativa3D, Away3D, Minko, Flare3D, Mixamo 등)

Stage3D는 강력하지만 충분히 활용하기 위해서는 개발의 복잡성 때문에 개발자들이 넘어야 할 벽이 많다. 하지만 Starling은 이러한 복잡성을 숨기면서 빠른 2D 드로잉을 수행할 수 있도록 개발되었다. Starling에서는 ActionScript에서 익숙한 DisplayObject와 같은 형식의 API를 제공한다. 또한 Starling에서는 비트맵 글꼴 및 스프라이트시트 같은 FlashPlayer에서 지원하지 않는 기능도 제공한다. (파티클 효과도 github에서 확장 기능을 다운로드하면 사용할 수 있다.)

Starling은 iOS를 기반으로 하는 Sparrow를 Stage3D에 포팅한 것이다. 즉,
 * Starling은 이미 모바일 장치에서 검증되었다.
 * Starling에서 개발한 애플리케이션은 쉽게 iOS 네이티브 애플리케이션에 포팅 할 수 있다.

앞으로 작성되는 Starling Framework 소개글은 akihiro kamijo의 글을 기반으로 작성되며 실험을 통해서 계속적으로 추가 적인 내용을 업데이트할 예정이다. 번역 과정에서 원글과 다소 차이가 있을 수 있으나 이해되는 범위 안에서 포스팅한다.

원문 : http://cuaoar.jp/2011/09/starling-actionscript-3.html

    

설정

트랙백

댓글

  • 깡생이 2012.01.31 00:49 ADDR 수정/삭제 답글

    자수님
    정말 오랜만에 자수님 블로그에서 정독 하고 있습니다.
    역시나 좋은 내용들 잘 보고 갑니다.

액션스크립트 3.0 스킬업 강좌를 종강하며...

Project/Programming 2009.05.01 03:18


어제 마지막 액션스크립트 3.0 스킬업 강의가 종강을 하게 되었다. 6강, 18시간이라는 시간 동안 커리큘럼의 내용을 모두 습득하기에는 어려움이 있었던 것이 사실이었지만 늦은 시각까지 강의를 들으시는 수강생 분들의 노력 덕에 본인이 오히려 도움을 받았다는 생각이 든다.

바쁜 업무 때문에 부득이하게 마지막 강의를 참석하지 못하신 분들도 있었던 것 같다. 마지막 수업, 술 한잔 모임에도 참석하지 못한 분들도 다음에는 강의실이 아닌 곳에서라도 술 한잔 할 수 있는 기회가 있기를 바란다.

아무튼 그 동안 모든 수강생분들 부족한 제 강의를 듣느라 너무 고생 많았습니다. 아무쪼록 이번 기회를 통해서 좀더 플래시 액션스크립트에 대한 즐거운 생각을 할 수 있기를 바라며, 본인 또한 앞으로도 여러분들에게 도움이 될 수 있는 사람이 되기 위해 노력 하겠습니다. 감사합니다.

    

설정

트랙백

댓글

  • 권오남 2009.05.01 12:44 ADDR 수정/삭제 답글

    자수님 수강 즐겁게 잘들었습니다~
    어제 모임도 재밌었구요. 무엇보다 좋은 이야기들 많이 해주셔서
    많은 도움이 되었습니다.^^

    다음 강좌도 기회가 된다면 또 듣고 싶네요~

    다른 수강생 여러분들도 수고 많으셨어요~

    • jasu 2009.05.03 02:30 신고 수정/삭제

      권오남님도 고생 많았어요~ ^^ 어쨌거나 제 경험이니 모든 내용이 옳은 생각이라고는 할 수 없습니다. 적당히 본인의 상황 배경에 맞춰서 공부하세요 ^^ 말씀 고마워요~

  • 김성훈 2009.05.01 17:11 ADDR 수정/삭제 답글

    3주 강의가 넘 순식간에 지나가서 아쉽네요~
    이번 강의를 통해서 저한테 스스로 자극도 많이 되고 자수님의 강의 들을수 있어서
    너무 좋았습니다. 이제는 자수님께서 설명해주신 좋은 방법들을 내것으로 만들어야
    하는 숙제가 생겼네요~

    자수님과 앞으로도 계속 기회가 되서 만나 뵐수 있었음 좋겠네요~
    그동안 강의해주신 자수님과 강좌 수강하셨던 분들 모두 수고 많으셨습니다~

    • jasu 2009.05.03 02:34 신고 수정/삭제

      김성훈님도 수고 많았습니다. 저도 종강을 하고 나니 아쉬운 점이 한 두가지가 아니네요 ^^; 무엇보다 좀더 도움이 될 수 있도록 준비를 하고 강의를 했어야 했는데 일정이 짧다보니 너무 급하게 진행한 것은 아닌가 하는 생각이 듭니다. 강의 내용들이 대부분 레퍼런스를 참조한 내용들이니 강의 가이드에 따라 차분하게 내용들을 스스로 풀어가 보시면 좋을 것 같네요 ^^ 그동안 수고하셨어요~

  • 하영진 2009.05.06 13:22 ADDR 수정/삭제 답글

    정말 몰랐던 부분 그리고 알듯 말듯 다가가기 힘들었던 패턴까지.
    회를 거듭할수록 배움을 통해 많은 자극과 즐거움이 있었던 시간이었습니다.
    정말 수고 많으셨어요^^
    블로그에도 자주 놀러오겠습니다.^^

    • jasu 2009.05.06 20:32 신고 수정/삭제

      도움이 되신 것은 제가 도와드린 것 보다는 영진님의 노력이 컸기 때문일겁니다. 저를 통해 확인된 부분이더라도 시간이 흐르면 자연히 잊게 되니 꾸준히 활용해 보세요 ^^ 말씀 감사합니다.

  • 고대현 2009.05.06 14:08 ADDR 수정/삭제 답글

    짧은시간이였지만 많은걸 준비하고 알려주셔서 너무 감사했습니다.
    강의와 함께 작업하셨던 결과물들 보면서 큰! 자극이 됐습니다.
    수고 많으셨어요~ ^^

    • jasu 2009.05.06 20:36 신고 수정/삭제

      대현님도 늦은 시각에 수업 들으시느라 고생 많았습니다. 제 경험으로는 플래시는 자극이 생각보다 큰 힘을 내는 것 같아요. 강의 이외에도 플래시를 통해서 자극 받을수 있는 모임에 적극 참여해 보세요. 노력하기 보다는 스스로에게 즐거움을 줄 수 있는 부분들을 찾아가다보면 도움이 되실것 같습니다. 말씀 감사합니다. ^^

  • MissFlash 2009.05.22 20:37 신고 ADDR 수정/삭제 답글

    강의를 잘 마치셨나 보네요~

    자기가 좋아하는 공부는 누가 안시켜도 참 잘 할수 있을텐데... 저도 꼭 한 번 전문적으로 배워보고 싶네요~

    • jasu 2009.06.08 03:31 신고 수정/삭제

      짧은 시간이었지만 제가 오히려 많은 배움을 얻은 기분이었던 것 같네요 ^^

실무자를 위한 액션스크립트 3.0 스킬업 과정

Project/Programming 2009.04.09 01:33

이번에 아는 형님의 도움으로 액션스크립트 3.0 강좌를 개설하게 되었다.  컴퓨터 학원은 고등학교 시절에 정보처리기능사 자격증 반을 다녔던 것이 전부인 나에게 가당치도 않은 일이지만 컴퓨터 학원은 주입식이어서는 안 된다는 내 소신을 시험해 볼 좋은 기회일 듯싶어서 욕심을 내보았다. 물론 강좌를 신청한 분들에게 기대한 만큼의 무엇을 전달하지 못할 수도 있겠으나 내가 할 수 있는 부분에 있어서는 최선을 다 해볼 요량이다.

강좌는 초중급으로 프로그래밍 언어에 대한 기본지식이 있거나 액션스크립트 2.0에서 3.0으로 넘어가는 분들을 대상으로 하였다. 따라서 기본적인 프로그래밍 언어에 대한 설명은 따로 시간을 할애하지 않을 생각이다.

사실 6강 18시간이라는 시간은 커리큘럼의 모든 부분을 자신의 것으로 만들기에는 턱없이 부족한 시간이다. 하지만 독학으로 공부하며 방향을 잡지 못하거나 본인이 공부하고 있는 것이 맞는 것인지 의심되는 분들에게는 도움이 될 것이라 믿는다.

본 강좌에서의 중심은 객체지향언어인 액션스크립트로 작업을 함에도 불구하고 oop의 장점을 충분히 활용하지 못하는 기존의 습관을 바꿔보는 것이다. 강좌가 끝날 때 이 부분에 대해서 느낌을 찾으시는 분들은 좋은 경험이 될 것이라 생각한다. 본 강좌에서 디자인패턴을 메인 메뉴로 올려놓은 것은 디자인패턴을 공부하기 위한 것이 아니라 많은 프로그래머들에게 입증된 디자인패턴의 구조를 토대로 본인의 코딩, 구조화 습관에서 생각의 전환을 하기 위해 디자인패턴을 다룰 것이다.

아무쪼록 강좌를 신청하신 분들, 그리고 본인 또한 좋은 경험이 되길.... ^^

http://www.dikr.co.kr/courses/ac1_003.asp


 

    

설정

트랙백

댓글

  • 제라드 2009.04.09 08:41 ADDR 수정/삭제 답글

    예전부터 블로그 많이 찾아왔지만.. 이번에 처음 글을 올리게 되네요.^^
    제가 사실 방향을 잡지 못하고 갈팡질팡 하는 한 사람입니다. ㅋㅋ
    그래서 이번에 과감히 신청을 하게 되었죠. 저에게 너무나 필요한 커리큘럼인듯 해서요..
    이번에 자수님에게서 그 느낌을 찾고, 좋은 경험이 되고 싶네요.
    종종 놀러오겠습니다.^^ 강의 잘 부탁드려요.~

    • jasu 2009.04.10 00:52 신고 수정/삭제

      안녕하세요 그러셨군요 쿠쿠 감사합니다.
      좋은 느낌을 찾으실 수 있도록 노력하겠습니다.^^
      감사합니다.

  • MissFlash 2009.04.10 21:53 신고 ADDR 수정/삭제 답글

    와~ 좋은 강좌네요...

    시간이 된다면 저도 꼭한번 참석해보고 싶은데... 대학원생이라 시간내기가 어렵겠네요... 게다가 지방 ㅜㅜ;

    자수님의 실력을 많이많이 전수해 주세요~

    후기도 올려주시구요... 기대하겠습니다.

    • jasu 2009.04.14 00:22 신고 수정/삭제

      저도 많이 배워야 하는 입장이라 아무쪼록 제 경험이 도움이 되었으면 하는 입장입니다. ^^ 말씀 감사합니다. ^^

  • 이창민 2009.04.14 20:45 ADDR 수정/삭제 답글

    저 지금 듣고 있어요 오늘은 첫 수업이랍니다.
    많이 어색하고 하지만 계속 진행 될 수록 즐거운 강의 시간이 될꺼 같아요
    기대하고 있습니다..ㅋㅋㅋ
    수업 시작이라 다시 수업에 몰두~

    • jasu 2009.04.15 13:17 신고 수정/삭제

      쿠쿠 네네 짧은 시간이지만 즐겁게 공부해 보도록 합시다~ ^^

  • 제라드 2009.04.15 09:05 ADDR 수정/삭제 답글

    Jasu님 첫강의 잘 들었습니다.
    남은 강의도 기대만땅이에요.^^
    수고하셨습니다.

    • jasu 2009.04.15 13:17 신고 수정/삭제

      감사합니다. 기대만땅에 약간 부담이... 쿠쿠 아무튼 즐거운 시간이 되길 바랍니다.

  • 강석희 2009.04.16 09:36 ADDR 수정/삭제 답글

    늦었지만 인사드립니다~

    오늘 두번째수업이군요^^

    오늘도 열강부탁드립니다~^^

    • jasu 2009.04.18 21:48 신고 수정/삭제

      네네 감사합니다. ^^ 남은 시간도 즐겁게 달려보아요

  • 쭈니 2009.04.16 11:38 ADDR 수정/삭제 답글

    안녕하세요 jasu님의 강의를 정말 들어보고싶은데 이미 개강을 해서 등록하기엔 타이밍이 좀 늦었네요 추 후 추가적인 강의계획이 있으신지 궁금합니다. 그리고 전 디자이너인데 플래시를 같이 하면서 2.0기반에서 for문 if문 기초적인 배열 함수 등... XML에서 데이터를 파싱?해서 뿌려주는 기초개념은 잡혀있는데요 강의 듣는데 잘 따라 갈 수 있을지... 어느정도의 배경지식이 필요한지 궁금합니다. 3.0개념을 잡아서 Air를 이용해 간단한 위젯 같은 어플등을 만들어 보고 싶습니다.
    답변 부탁드려요!

    • jasu 2009.04.18 21:56 신고 수정/삭제

      안녕하세요 다음에 강의 기회가 있을지는 저도 잘 모르겠습니다. 일단 이번 강의의 경우는 수강생 분들의 아는 범위가 다소 차이가 있는 관계로 단순한 프로그래밍 지식 보다는 제가 문제를 풀어가는 방법을 알려드리고 그것을 통해 자신의 구조화 방법에 대한 고찰을 해보는 시간으로 진행되고 있습니다.

      프로그래밍, 특히 ActionScript의 경우는 어떤 문제를 풀어가는 과정에서 스스로 즐거움을 찾는 것이 멋진 작품을 만드는 핵심이라고 생각이 됩니다. 너무 결과에 대한 욕심보다는 하나의 목표를 위해 진행하는 과정에서의 즐거움에 도움을 받아보세요 ^^ 말씀 감사합니다.

  • 권오남 2009.04.18 14:22 ADDR 수정/삭제 답글

    수업 재밌게 잘듣고 있어요~
    몰랐던 부분들을 알게 되는거 같아서 기분이 좋습니다.
    남은 수업도 화이팅입니다^^

    • jasu 2009.04.18 21:58 신고 수정/삭제

      수업에 대해 기분 좋은 느낌을 받고 계시다니 저에게는 너무 좋은 말씀이시네요 ^^ 남은 시간도 좋은 느낌을 계속 유지할 수 있도록 진행해 보도록 하겠습니다. 감사합니다.

  • 지돌스타 2009.04.30 10:48 ADDR 수정/삭제 답글

    좋은 강좌를 진행하시는군요. 아~ 강좌는 이미 끝났군요. 정말 수고 많으셨습니다.
    오늘 MVC패턴에 대한 글을 Adobe RIA사이트에서 봤는데 매우 이해하기 쉽고 명쾌했습니다.
    자수님의 이런 노력은 많은 이들에게 큰 도움이 될것이라 생각해요.

    • jasu 2009.04.30 14:19 신고 수정/삭제

      아 말씀 감사합니다. 오늘이 종강입니다. 노력은 했는데 저와 수강생분들이 생각하고 기대하신 만큼 잘 전달이 되었는지는 모르겠네요. 처음이다보니 미숙한 점도 많았던 것 같고, 아무튼 끝까지 불평 없이 강의를 들으신 분들에게 박수를 ^^ 감사합니다.

갤러리툴 개발자의 마음.

Project/Programming 2009.02.07 11:30

어제 관련 포스트를 보고 당황스럽고 많이 힘들었던 갤러리툴 개발자이다. 일단 프로젝트에 대해서 기능 제안을 하고 사용자들에게 좀더 손 맛나는 그리기툴을 제공하고자 했던 개인적인 생각을 피력하고 싶어서 이 글을 쓴다. 사실 본인이 왜 이런 글을 써야만 하는지도 모르겠다.

이번 갤러리 개편의 경우는 스케치판을 생각하고 기획된 것이 아니었다. 스케치판에서 기획자와 이야기를 나눴다는 분은 이번 프로젝트 진행 시에 전혀 관여하지 않았던 것으로 알고 있으며 관련 내용 조차 공유되지 않았다. 또한 갤러리 개편 프로젝트는 작년 초에 갤러리 서비스를 개편하고자 하는 의지를 기획으로부터 전달 받았고, 그에 따라서 일본에서 서비스하는 칠판 형태의 손 맛나는 그리기툴을 만들어 보자는 취지에서 프로토타입을 만들기로 하고 개발입장에서 역 제안하여 진행하게 되었던 것이다. (프로토타입 개발시 예전에 본인이 만들었던 좌표생성 및 재생 샘플과 칠판 느낌을 만들기 위해 관련 도움을 받았던 기술 문서는 일본의 munegon씨가 adobe에 제공한 칠판 제작에 관한 기사였다.)
 
그리기 과정은 프로토타입을 만들기 이전에 기획 쪽에 제안했으며 퍼가기의 기능은 싸이월드 내부에서 서비스 하고 있는 동영상이나 구글의 유튜브 서비스의 퍼가기 기능을 접목하여 일반 미니홈피 사용자들이 다른 사람들에게 자신의 그림 솜씨를 PR할 수 있는 기회를 제공해 보자는 취지에서 기획쪽에 제안 했던 것이다.

프로토타입 샘플

본인 스스로 나름대로 열심히 개발하여 보람을 느끼며 진행을 했던 작업이었는데 인터넷 상에서는 여러 가지 말들이 많은 것 같다. 그런데 나에게는 다른 이야기는 다 들리지 않고 오로지 이 프로젝트를 위해 밤을 새며 노력했던 모든 작업자들의 노력이 사실과 다른 이유로 비난받고 있는 듯 싶어서 한 없이 마음이 아프다.

만약 본인이 스케치판을 염두하고 개발을 진행하고 제안했다면 지금의 갤러리 서비스를 만들지 못했을 것이다. 나는 디자이너, 개발자, ui개발자, 기획자들과 함께 최선을 다해 노력했을 뿐이다. 그런데 지금의 내 마음이 너무 아프다. 우리가 좋은 서비스를 만들기 위해 노력했던 그 자체가 엉뚱한 방향으로 흘러 본의 아니게 회사에 누를 끼치고 있는 것 같아서 말이다. 사실 관계를 확인하지 않고 떠도는 인터넷에서의 이슈가 얼마나 무서운 것인가를 새삼 깨닫게 된다.

 

    

설정

트랙백

댓글

  • lovedev 2009.02.07 12:37 신고 ADDR 수정/삭제 답글

    헐...비난을 하다니..정말 이해안가네요..
    힘내세요...

    기술을 기술로 보지 못하는 현실이 안타깝네요.
    여러곳에서 적용을 안했을 뿐 일반적인 기술 모델인데..
    그걸 가지고 왈가불가 하다니.. 헐뜯기 작전인거 같아요.

  • 스케치판 2009.02.07 13:07 ADDR 수정/삭제 답글

    이정도 확대를 의도한 건 아니었습니다. 고생하신 부분 충분히 공감하고 이해합니다.
    단 거대한 기업의 행보가 저희같은 벤처들에게는 큰 아픔으로 다가올 수 있고 그쪽의 기획출발은 저희 서비스가 아니었을지 모르지만 선기획되고 서비스한 입장에서 저희의 존재사실과 의심할 수 있는 부분들을 말씀드리고 싶네요.
    제가 개인적인 마음을 올린 것도 주위에서 저희랑 제휴한 줄 알고 축하메시지들을 주셔서 알게되었고, 상처를 받은 거랍니다. 싸이월드와의 개인적인 연도 있었구요...
    기획자가 당당하다면 머가 문제겠습니까? 조속히 오해가 있었다면 풀고, 문제가 있었다면 조율하고, 님같이 상처받는 분들이 나오지 않기를 바랍니다.. 글에 진실성이 보이시는데 참.. 착찹하네요...

    • jasu 2009.02.07 15:59 신고 수정/삭제

      위의 내용과 예전에 라이브 할 때 올린 글에서도 언급했듯이 갤러리 개편 프로젝트의 경우는 기획 이후 개발 프로세스로 진행한 것이 아닌 개발 프로토타입 진행 후 기획 단계로 진행했었습니다. 따라서 프로젝트의 방향은 기획에서 하달되어 프로토타입을 만든 것이 아니며 프로토타입 개발 이전에 개발 쪽에서 방향성을 제시하고 프로토타입을 개발했던 것입니다.

      그 이후에 프로토타입에 근거해서 기획이 되었습니다. 프로토타입 개발 이전에는 java로 만들어진 어플리케이션을 플래시화 하고 내부에서 서비스하고 있는 이미지 편집툴과 ui룩이 같은 형태로 진행하는 것이었습니다. 그렇기 때문에 관련 내용에 있어서 많은 오해가 있고 잘못된 방향으로 흐르고 있다고 판단하여 글을 남겼던 것입니다.

      스케치판에서도 속상할 것이기에 저도 마음이 좋지 않습니다. 누구의 잘못 보다는 일단 사실에 대한 오해는 푸는 것이 좋을 것 같아서 글을 올렸습니다. 아무쪼록 더 이상 힘들어 하는 사람이 생기지 않도록 오해가 풀리고 원만하게 해결되기를 바랍니다. 스케치판 관계자 분들도 힘내시기 바랍니다.

  • 스케치판 2009.02.07 18:12 ADDR 수정/삭제 답글

    네~ 정말 아쉬운건 만약 플렛폼이 마이스페이스나 페이스북 이었다면 선의의 경쟁도 하고 서로 상생을 모색하기도 쉬었을텐데 하는 마음이 드네요..
    한국인터넷 생태계에서 만약 저희의 입장이셨다면 같은 출발선이나 기회의 균등을 논하기 어려웠을것 같네요..소비자들의 절대다수를 가지고 있으며, 닫혀있는 포털과 신규벤처의 불신이 뿌리깊은 사실도 상황을 안좋은 쪽으로 몰아가는것 같습니다.
    잘 마무리하고 기회된다면 좋은 모습으로 다시 커뮤니케이션하였으면 합니다.

    • jasu 2009.02.07 20:12 신고 수정/삭제

      위 내용은 제 사견이고 제가 알고 있는 사실에 관한 이야기와 제 마음을 썼을 뿐입니다. 저와 이야기할 것은 아닌 것 같습니다.

  • 스케치판 2009.02.07 20:28 ADDR 수정/삭제 답글

    아..오해하지 마세요~ 개인적인 넋두리일뿐~ 님의 실력등은 충분히 인정하고 멋지게 생각합니다.
    상황만 그렇다는거니 기분나빴다면 죄송합니다~

  • douglas9 2009.02.09 11:53 ADDR 수정/삭제 답글

    같은 개발자로서 마음이 아프네요 자수님 힘내세요!

  • jasu 2009.02.09 23:45 신고 ADDR 수정/삭제 답글

    더이상 이 포스트에서 트랙백이나 댓글 허용하지 않겠습니다.

Box2D로 표현할 수 있는 것

Project/Programming 2009.01.03 19:21
Box2D 물리 엔진을 이용하여 표현할 수 있는 방법 모색과 구조 공부를 위해서 사용해 보았었다. Box2D는 ActionScript 기반으로 제작된 것이 아니라 타 언어로 개발되어 다양한 프로그래밍 언어로 변화하였기 때문에 ActionScript 구조나 효율적인 면에서 다소 ActionScript와 맞지 않는 형태를 취하고 있다.

예를 들면 Box2D에서는 기본적인 수치 계산에 사용하는 값은  실 세계의 관점에서 미터 단위로 값을 사용하고 있다. 또한 무게도 kg단위로 표현이 되는데, 이로 인해서 표시객체로서 화면에 표현할 때는 다시 미터 단위를 pixel 단위로 변환해야 하는 수치계산부가 포함된다. 이로 인해서 불필요한 연산을 포함하게 되는 것이다.

그렇다고 하더라도 기본적인 프로그래밍 언어적인 측면에서 짜임새 있는 구조를 취하고 있다.
 
샘플로 제작한 결과물은 Box2D에서 사용할 수 있는 오브젝트 생성 및 오브젝트 끼리 서로 연관성을 유지할 수 있도록 연결해 주는 Joint을 통해서 서로 연결 관계를 만들어 낼 수 있다.

샘플 이미지



샘플 플래시




일단 화면에서 마우스를 드래그 하여 오브젝트를 생성 할 수 있다. 왼쪽에 나타나 있는 메뉴 버튼에 따라서 생성할 모양을 선택할 수 있다. 상단의 3개의 버튼(u,j,m)은 u는 unit 생성 메뉴를 나타내고 j는 joint 메뉴, 그리고 m은 생성한 오브젝트를 이동(move) 할 수 있는 기능 메뉴이다.

일단 생성할 수 있는 기본적인 오브젝트 모양은 삼각부터 8각까지이고 마지막 f는 자유로운 선 연결을 통해서 자율각도의 도형을 만들 수 있다. 자율도형의 경우에도 8개의 각만을 유지하는데 이는 Box2D(일반 다른 물리엔진에서도 대체적으로 그러하다)에서 8각 이상의 오브젝트에서는 물리 연산에 있어서 오류가 발생한다. 이는 각이 많은 경우 각에 따른 관성과 마찰력을 만들어 내는 연산에 있어서 한계점이라고 이해하면 될 것 같다.

각을 많이 만들 수 없기 때문에 단일 오브젝트로 자유로운 형태의 모양을 만들고 그것에 이미지를 맵핑 할 수 없는 것은 여러 개의 오브젝트를 묶어서 표현 할 수 있을 것이다.

또한 Box2D에서 자율 각도의 도형을 만들 때 지켜야 할 규칙에 대한 이야기를 하고 있는데 이는 이전 각도와 다음 각도의 연장선에서 안쪽에 새로운 각을 생성하면 엔진에 오류가 발생한다. 이는 물리엔진에서 표면의 각도에 따라 충돌 계산을 처리하는데 표면 안팎을 구분할 수 없는 계산의 사각이 발생하기 때문이다. 따라서 샘플에서는 자율도형을 만들 때에는 가이드 라인을 제공하고 있으며 그 가이드 색에 포인트를 생성할 수 없도록 처리해 놓았다. 그리고 Box2D에서 약간의 오류가 있는데 자율도형을 만들 때 시계방향으로 만들면 대체적으로 문제가 없지만 시계 반대방향으로 각도를 만들면 문제가 발생한다. 따라서 샘플에서 만들어진 자율도형의 경우에는 시계 반대방향으로  만들어진 각도의 포인터 배열 순서를 역으로 reverse하여 처리하였다.

오른쪽 상단의 메뉴 j에서는 Box2D에서 제공하는 joint 기능들을 포함하고 있다. 몇몇 기능은 구현되지 않거나 구현 과정에 있는 것들도 있다.

Joint는 오브젝트와 오브젝트를 잇는 역할을 한다. Box2D에서는 6종류의 조인트를 지원하고 있다.

b2DistanceJointDef
이는 오브젝트의 거리를 일정하게 유지하는 조인트이다.

B2RevoluteJointDef
이는 오브젝트와 오브젝트간의 연결을 통해 회전시키는 역할을 한다. 사람의 팔과 다리와 같은 관절 역할을 한다고 보면 될 것 같다.

b2PrismaticJointDef
이는 피스톤 같은 움직임을 표현한다. 오브젝트간의 직선으로 연결된 길을 통해서 직선 운동을 한다.

b2PulleyJointDef
도르래 같은 기능을 하는 조인트이다.

b2GearJointDef
기어 조인트이다. 기어에 의해서 연결되고 있는 관계를 나타내는 조인트이다.

b2MouseJointDef
마우스 조인트는 오브젝트를 마우스 인터랙션을 통해서 움직이기 위한 조인트이다. 샘플에서 오브젝트를 마우스로 클릭 후 드래그(메뉴중 M버튼이 눌려진 상태에서만)를 통해서 이동 가능한 것도 마우스 조인트를 사용하고 있기 때문이다.

그리고 샘플에서 마우스 오른쪽 버튼을 통해서 context 메뉴를 제공하고 있는데 오브젝트를 삭제하는 기능과 오브젝트의 정보를 확인하고 수정 할 수 있는 info 메뉴가 그것이다.

Info와 Remove 기능은 생성한 오브젝트 위에서만 사용 가능하다. 선택되는 오브젝트가 없을 때에는 기능이 처리되지 않는다. Remove는 해당 오보젝트를 바로 삭제해 준다. Info는 해당 오브젝트의 정보 값들을 오른쪽에 표시해 주고 있는데 해당 값들을 변경함으로써 오브젝트의 물리 값들을 변경할 수 있다. 예를 들면 마찰력, 관성, 탄력등…

또한 색 변경과 static으로 물리역학에 영향을 받지 않는(멈춰있는 장애물) 오브젝트로 만들 수도 있다.

왼쪽 하단에는 물리역학이 적용되고 있는 영역의 중력 값을 변경 할 수 있다. 실 세계에서의 중력은 위에서 아래(Y축)로만 적용되지만 여기서는 X축으로도 적용 가능하여 바람에 날리는 형태의 환경도 만들어 낼 수 있다.

그리고 마지막으로 화면에서 shift 키를 누른 상태에서 마우스로 원을 그리면 전체적인 메뉴를 볼 수 있는데 기능 중에는 구현되지 않은 것들도 있다. Fullscreen으로 적용할 경우 키보드를 사용할 수 없으니 normal 화면에서 사용할 수 있다.

몇 개월 전에 만들었던 결과물이지만 중간에 다른 일들로 인하여 잠시 손을 놓고 있었다. 사용하다 보면 약간 버그도 발생하고 있는데 나중에 시간이 허락되면 Box2D를 사용하는 방법에 대해서 포스팅을 하면서 수정하도록 하겠다. 시간이 허락이 될지는 잘 모르겠지만 말이다...;;

블로그를 통해서 새해 인사를 하지 못했는데 아무쪼록 제 블로그에 방문하는 모든 분들 2009년에는 명박스럽지 않은 즐거운 해가 되었으면 좋겠다. 모든 분들 새해 복 많이 받으세요~~ ^^

    

설정

트랙백

댓글

  • 쿠나 2009.01.03 21:42 ADDR 수정/삭제 답글

    우와우, 새로운 클래스 알고 갑니다.
    명박스럽지 않은 해라면 저도 간곡히 부탁드리는 바입니다 ^^;
    자수님도 2009년에는 더 행복하세요 :D

    • jasu 2009.01.04 06:04 신고 수정/삭제

      네네 ^^ 쿠나님도 새해 복 많이 받으세요~

  • 땡굴이 2009.01.03 22:32 ADDR 수정/삭제 답글

    새해 인사 너무 거창하시네요.. 크크. 나도 관심은 많은데.. 킁킁. 네 덕에 좀 공부좀하자. 새해 복 많이 받아.

    • jasu 2009.01.04 06:06 신고 수정/삭제

      ^^ 2008년에 너무 여러 복을 많이 받으셔서 2009년은 좀 부담스러우시겠지만 땡굴이형도 새해 복 많이 받으셔요~ ^^

  • 액션신 2009.01.06 10:59 ADDR 수정/삭제 답글

    RSS 구독하다가 간만에 블로그 살펴보고 갑니다. 좋은 글 감사드려요^^

    • jasu 2009.01.12 15:16 신고 수정/삭제

      방문 감사합니다. 시간이 허락되는 한 즐거운 글 올리도록 하겠습니다. ^^ 감기 조심하세요

  • hiroinaru 2009.01.12 00:16 ADDR 수정/삭제 답글

    좋은글 읽고갑니다^^

  • 고대현 2009.04.14 20:41 ADDR 수정/삭제 답글

    선생님 지금 수업들으면서 덧글을 달고 있네요 ㅋㅋ
    멋진예제 잘봤습니다~~ ^0^)///

    • jasu 2009.04.15 13:19 신고 수정/삭제

      쿠쿠 선생님이라는 호칭이... 그냥 자수라고 부르셔도 됩니다. ^^ 감사합니다.

Wii remote controller with papervision3d

Project/Programming 2008.04.30 00:58
날씨가 참 따스하다. 토요일에 회사 사람들과 같이 자전거를 타고 여의도에서 홍대, 홍대에서 회사에 들려서 탁구를 치고 돌아왔더니 아직도 몸이 어수선하다. 그래도 날씨 좋은 날 즐겁게 운동한 기분이라 몸은 어수선해도 즐거운 시간이었다.

wiiFlash를 이용하면 재미있는 것들을 해볼 수 있겠다 싶어서 Wii remote controller를 하나 구입하여 기본적인 테스트를 해봤다. wiiFlash에서 제공하는 wii 리모컨과 통신을 가능하게 하는 패키지를 기본 베이스로 하고 리모컨의 움직임에 따라 나타나는 값을 통해서 papervision3d로 표현해 보았다.

기존에 외국 사람들이 테스트한 동영상을 여러 번 볼 수 있었는데 좀더 재미있는 결과물을 만들기 전에 기본적인 기능 테스트 형태로 만들어 보았다. wiiFlash가 0.4 버전으로 릴리즈되면서 마우스를 컨트롤해주는 기능이 추가 되었다. 이는 플래시를 통해서 구현되는 것이 아니라 소켓통신을 하는 WiiFlashServer에서 컨트롤 할 수 있도록 기능이 들어가 있는 것이다. 이것을 이용하면 멀리서 마우스를 대신하여 리모트컨트롤을 사용할 수 있다.

위리모컨의 기본적인 기능은 중력감지를 통해서 3개의 축(x,y,z)값을 얻을 수 있다. 그리고 리모컨 이외에 센서바가 필요한데 센서바는 왼쪽 오른쪽 각각 3개의 센서를 통해서 적외선이 나오는데 리모컨에서는 이 적외선을 감지하여 각도와 거리를 측정할 수 있다.

예전에 발표로 준비했던 프리젠테이션 템플릿에 위리모컨을 이용했으면 하는 아쉬움이 있다. wiiFlash 패키지를 이용하면 간단하게 리모컨을 이용하여 플래시에서 표현할 수 있기 때문에 플래시 컨텐츠의 어디던지 적용이 가능하다.

집에 Wii 리모컨이 있는 분들은 한번 받아서 사용해 보면 또 다른 재미 경험을 할 수 있을 듯싶다. 사실 컴퓨터가 입력 받는 입력기로는 키보드와 마우스만 있는 것이 아니다. wii리모컨은 이러한 것을 경험을 통해서 다시 한번 느끼게 해준다.






WiiFlashServer 0.4.exe

wiiBasicDocument.exe


테스트 순서 >
1.    블루투스를 이용하여 위리모컨과 컴퓨터를 연결한다.
2.    WiiFlashServer를 실행하여 WiiFlashServer프로그램이 1번에서 연결된 리모콘을 감지하는지 확인한다. 감지하면 첫번째 작은 원에 위리모컨 모양이 나타나고 짧게 위리모컨이 진동한다.
3.    올려놓은 파일을 실행한다.
4.    위리모컨을 움직인다. (홈 버튼을 누르면 마우스의 기능을 위리모컨이 가로채는 기능을 on off 할 수 있다. 이는 센서바도 사용해야 한다. 센서바가 없으면 마우스가 왼쪽 하단에서 헤어나오질 못함.)

    

설정

트랙백

댓글

  • Han Sanghun 2008.04.21 15:08 ADDR 수정/삭제 답글

    오우 멋진걸... wii 리모콘으로 플래시 게임을 즐길 수도 있겠는데.

    • jasu 2008.04.21 23:35 신고 수정/삭제

      플래시 뿐만이 아니라 위플래시서버를 돌리면 데스크탑 마우스 포인터를 사용할 수 있는 것을 보면 여러가지로 응용이 가능할 듯 싶어요 이미 외국에서는 Johnny Lee라는 사람이 여러가지 실험을 통해서 기발한 결과물들을 만들어 내고 있네요 위모트를 이용한 멀티 터치스크린 등등...
      위모트는 게임을 위해 만들어진 기계지만 발상의 전환이 전혀 다른 분야의 기초 기술이 되는 것 같은 느낌이에요 ^^

  • 찌노 2008.04.22 09:24 ADDR 수정/삭제 답글

    캬.. 조만간 PC(FLASH) 게임도 쏟아져 나오겠네요.. 일단 wii 자체가 많이 팔린다면 ㅎ

    • jasu 2008.04.24 00:06 신고 수정/삭제

      쿠쿠 wii의 간단한 게임들은 충분히 플래시로 구현이 가능한 것들이 많은 것 같더라구요...

  • Namoo 2008.04.23 15:45 ADDR 수정/삭제 답글

    Wii 를 사야할 또 다른 이유가 생겼군요.. 정말 흥미로운 정보네요 감사합니다 ^^;;

    • jasu 2008.04.24 00:07 신고 수정/삭제

      비교적 저렴한 게임기로 여럿이 함께 즐길 수 있는 점에서 괜찮을 것 같네요 유튜브에서 검색해 보면 재미있는 결과물들을 많이 보실 수 있을거에요...

  • 2008.04.29 16:07 ADDR 수정/삭제 답글

    비밀댓글입니다

  • Blue 2008.04.29 16:10 ADDR 수정/삭제 답글

    안녕하세요 자수님 언제나 글 감사히 읽고있습니다
    저도 전부터 위플래시에 관심이있었는데 이렇게 직접 올려주시니 감사해요
    이번 4.0 버전을 시험해 보려고 했더니..깔리지도 않고 에러만 나네요 ㅡㅡ;
    친구한테 위도 빌리고 맘먹고 해보려했더니.. 먼가 제가 놓친것이 있을까요 ?
    자수님은 ? 잘깔리셨나요 ?

    • jasu 2008.04.29 18:17 신고 수정/삭제

      위 플래시 서버를 돌리기 전에 일단 위와 컴퓨터가 블루투스로 연결이 되어 있는 상태여야 해요 그 다음에 위플래시서버를 돌리시면 될것 같습니다.

  • 우야꼬  2008.05.01 01:06 신고 ADDR 수정/삭제 답글

    와 재밌는 시도네요.
    닌텐도 반만큼만 Wii가 판매된다면
    Wii 전용 플래시 게임도 서비스할만 하겠는데요 ㅋ

    • jasu 2008.05.06 10:04 신고 수정/삭제

      입력 장치가 위모트라는 것만 빼면 다를 것이 없지만 재미있는 아이디어를 만들어 낼 수 있지 않을까 싶기도 하네요 ^^

  • 빅몽크 2008.05.08 16:19 ADDR 수정/삭제 답글

    형, WII로 만든 좋은 작품 기대하고 있을께요~!. ^^
    또 멋진 작품 하나 나올것 같은 예감이~~.

    • jasu 2008.05.13 15:32 신고 수정/삭제

      작품? ;; 쿠쿠 시간 날때 만져봐야지...

  • 짱양 2008.05.09 00:08 ADDR 수정/삭제 답글

    와,,대단한데요,,
    위에 관심이 많았는데,
    앞으로 정말 기대되네요,,

    • jasu 2008.05.13 15:33 신고 수정/삭제

      전 위는 없고 위모트 하나 사서 가끔 놀고 있어요..쿠쿠

  • 조원 2008.06.17 17:00 ADDR 수정/삭제 답글

    자수님, 안녕하세요. 자수님 블로그를 이따금 들르는 사람 입니다.
    올려주신 포스트에 관심이 있어 저도 리모컨을 구매해서 시도를 해보았는데
    블루투스 동글이 Wii 리모컨은 잘 인식을 하는데
    WiiFlash 서버만 띄우면 블루 스크린이 뜨네요.

    혹시 테스트 진행하시면서 이런 일은 없었는지 있었다면 어떻게 해결을 하셨는지 궁금합니다.
    아니면 블루투스 동글은 어느 기종을 사용하셨는지만이라도 좀 부탁 드리겠습니다.

    • jasu 2008.06.18 19:28 신고 수정/삭제

      안녕하세요 저도 블루스크린은 아니더라도 WiiFlash 서버를 돌리고 사용을 하다보면 가끔 먹통이 되어서 다시 WiiFlash를 실행해야 하는 문제가 발생했던 것 같네요 현재 WiiFlash 버전을 확인해 보세요

  • 조원 2008.06.18 20:31 ADDR 수정/삭제 답글

    답변 감사합니다.
    블루 스크린만 보면 블루투스 동글 호환 문제인 것 같은데
    다른 제품을 몇개 구입해서 해봐야겠네요.
    답변 주셔서 다시 한번 감사드립니다.

    • 흐음 2008.06.30 11:50 수정/삭제

      자바로 만들어진 wiimote프로그램및 소스
      c#으로도 만들어진 소스및 프로그램들도 있는데
      관심있으시면 한번 가보시길...
      http://onakasuita.org/wii/index-e.html

      자바소스
      http://www.wiili.org/WiiremoteJ

      참고로 저는 2002년말쯤에 산 블루투스동글 장치가 인식때문인지 잘안되던데...
      http://onakasuita.org/wii/index-e.html 에서 다운받은건 잘 되더군요...

    • jasu 2008.07.08 13:22 신고 수정/삭제

      아 좋은 정보 감사합니다. ^^

즐거운 만남 플래시 컨퍼런스....

Project/Programming 2008.04.08 05:43
4월 5일, 땡굴이 형님이 운영하시는 액션스크립트 까페에서 1차 컨퍼런스 행사가 있었다. 집요한 문군애절한 부탁에 보헤형과 함께 스피커로 나서긴 했으나 이런 행사에서 스피커로 서는 것이 처음인지라 무엇을 어떻게 준비를 해야 할지 난감했다.

일단 ‘무엇을’ 준비해야 하는가에 대한 고민을 오래 한 것 같다. 무엇이든 일단 시작해 보자는 생각에 프리젠테이션을 위한 프리젠테이션 템플릿을 만들기 시작했다. 무엇보다도 내가 알고 있는 일의 작업 스타일에 대한 이야기를 하는 것이 설명하기도 편하고 오시는 분들도 도움이 될 듯싶었기 때문이다.

일단 무엇을 만들 것이라는 것이 결정되고 일주일 정도 지났을 때, 나는 작업량의 절반 정도를 진행하고 있었다. 그러던 어느 날 작업하던 flashDevelop 패키지 파일이 열리지가 않아서 각각 클래스들을 열어 봤더니 총 7개 정도의 클래스 파일이 깨져서 열리지 않거나 다른 클래스 소스와 짬뽕이 된 코드가 눈앞에서 펼쳐져 있더라는….쿨럭…

외장하드에 자료를 보관하고 있었는데 외장하드의 물리적인 트랙 에러가 발생한 듯싶었다. 일단 살아 있는 코드를 다른 하드에 저장 했다. 소실된 클래스들을 다시 만들 생각하니 힘이 쫙 빠졌다. 문제의 클래스(총 3개 정도는 파일이 열리지 않았었고 4개 정도의 파일이 회사 작업 클래스 코드들과 얽혀 있었다)들을 작성하는 데는 3시간 정도의 작업 시간이 걸린 것 같다.(했던 작업을 다시 하는 것인지라 3시간이 길게 느껴지긴 했다.)

사용자 삽입 이미지1/60sec | f5 | 18mm | ISO-400사진출처 : 문군


아무튼 그런 우여곡절 끝에 프리젠테이션 템플릿은 완성이 되었다. 하지만 이제는 ‘어떻게’가 문제였다. 어떤 내용으로 이것을 잘 포장하여 이야기를 풀어야 하는지는 생각조차 하지 않았기 때문에….

결국 내용은 평소에 보던 책과 인터넷을 헤집고 다니면서 얻은 자료들을 토대로 준비하게 되었다. 마지막 날에는 감기몸살까지 찾아와서 고생을 좀 했으니 내가 할 수 있는 노력은 어느 정도 했다고 생각하는데 이런 발표자의 마음이 전달 되었는지는 잘 모르겠다.

사실 컨퍼런스에 오신 분들의 작업 스타일, 하는 일에 대해서 충분히 고려하지 못했다는 생각이 든다. 너무 내 안에 있는 이야기만 일방적으로 한 것은 아닌가 하는 아쉬움이 남는다.

발표가 끝나고 1차, 2차, 3차까지 달렸는데, 살인적인 입담을 소유하고 있는 진우와, 앞 테이블(나에게는 뒷 테이블이어서 다행이었다. 쿠쿠) 연인의 행각에 어쩔 줄 몰라 하시는 땡굴이 형의 모습에 새벽 첫차를 타고 집에 도착할 때까지 턱이 아프도록 웃었다.
사용자 삽입 이미지1/40sec | f5.6 | 18mm | ISO-400사진출처 : 문군사용자 삽입 이미지1/30sec | f5 | 18mm | ISO-400사진출처 : 문군

다시 한번 궂은 일 마다하지 않고 컨퍼런스를 준비해 준 땡굴이형님과 그 아이들(문군포함 스텝님들)에게 고마움을 전한다. 그리고 결코 가볍지 않은 행사 후원을 해주신 단군소프트 관계자 분에게도 감사하다는 말을 전하고 싶다.

사용자 삽입 이미지1/15sec | f5.6 | 18mm | ISO-400사진출처 : 문군



비록 발표는 아쉬웠지만 내가 할 수 있는 일은 마무리하는 것이 좋을 것 같아서 컨퍼런스 때 발표했던 프리젠테이션 템플릿 소스와 UML등을 압축하여 올려 놓는다. 시간에 쫓기며 진행한 작업이니 잘못 된 부분도 있을 수 있고 좀더 최적화 해야 하는 부분에서 쉽게 쉽게 진행한 부분도 있으니 이해를 바란다.

다시 한번 노파심에서 말씀 드리지만 이 자료는 OOP 개념에 대한 이해의 목적으로 만들어진 자료이기 때문에 완벽하지 않을 수 있다. 하지만 OOP를 처음 접하거나 느낌이 슬슬 오기 시작하신 분들에게는 조금이나마 도움이 될 수 있지 않을까 싶다.

아무쪼록 사회생활을 준비하고 열심히 공부 하려는 후배들에게 플래시가 즐거운 공부와 놀이가 되었으면 한다. 파이팅~ ^^

ActionScript발표자료.alz

ActionScript발표자료.a01

ActionScript발표자료.a00


사용자 삽입 이미지



    

설정

트랙백

댓글

  • 이전 댓글 더보기
  • Jay 2008.04.09 01:01 ADDR 수정/삭제 답글

    쿄. 좋은 자료 감사합니다. 열심히 정진하겠습니다 -

  • 문군 2008.04.09 01:05 ADDR 수정/삭제 답글

    역시 이런 자료를 널리 공개하시는 형님의 마음을 잘 간직해야 겠어여^^
    크읍 제 사진이라 밝혀주시니 참 기분이 이상하게 좋네여^^ ㅋㅋㅋ

  • jroco 2008.04.09 01:08 ADDR 수정/삭제 답글

    강의 넘 멋졌어요~~ ^ㅂ^ 발표자료도 올려주시구...
    ^^ 감사합니다~~ 플래시 공부 더 욱더 열심히 !!!

  • 동강 2008.04.09 01:17 ADDR 수정/삭제 답글

    기대 만큼이나, 알찬 컨퍼런스였습니다. 그동안 문군형한테 말로만 듣던
    자수형님을 뵙게 되어 반가웠구요. 한창 OOP 에 대해 공부 중인데
    단비와 같은 발표였습니다. ㅋ PPT 는 정말 ..헉! 소리를 냈지요.

    그럼 후에 또 있을 컨퍼런스때에도 스피커로 뵙길 희망 드립니다.ㅎ
    수고 하셨습니다.ㅎ

  • 무좀유죄 2008.04.09 01:18 ADDR 수정/삭제 답글

    강연 너무 알차고 만족스러웠어요 ~

    기회만 된다면 이런 강연은 잊지 않고 쫒아다니면서 참석 하고 싶어요

    앞으로 이런 자리 자주 만들어 주시면 감사하겠습니다 ^^

  • 깡생이 2008.04.09 01:19 ADDR 수정/삭제 답글

    자수님 넘 멋지십니다~
    자료 감사히 보며 열심히 공부할께요~~~~

  • 톰톰씨 2008.04.09 01:21 ADDR 수정/삭제 답글

    와..자료 감사합니다.. 사실 전 초보인지라..컨퍼런스때는 멍~하고 듣고있었지만;;
    참고삼아 열심히 공부해볼게요 ^^*

  • 섭이 2008.04.09 01:21 ADDR 수정/삭제 답글

    세미나 때 자수님을 실제로 뵙게 되어 참 반가웠습니다 ^^
    좋은 자료 감사히 받아갑니다!

  • 리에 2008.04.09 01:45 ADDR 수정/삭제 답글

    컨퍼런스 때 자수님의 블러그 주소를 적어왔었는데 지금에서야..^-^;
    정말 알차고 좋은 말씀들도 많이 해주시고 이렇게 자료 공유까지 해주시다니..감사합니다.^^
    와~!! 라는 탄성을 소리없이<?> 계속 내며 열심히 들었는데.. 정말 감동이었어요.^^
    자료 감사히 보며 열심히 공부해야겠어요.^^ 다시 한번 감사드립니다.*^^*

  • 쿠로 2008.04.09 04:25 ADDR 수정/삭제 답글

    컨퍼런스 잘들었습니다. ^^ 전부 클래스 작업을 하고 단시간내에 좋은 퀄리티의 어플리케이션을 만들어 내는 모습을 보고 역시나 프로라는 모습을 보게 된것 같네요

  • 조영현 2008.04.09 09:04 ADDR 수정/삭제 답글

    아 정말 감사합니다. 이렇게 좋은 자료를 공유 해주시다니.. 열심히 공부하겠습니다!

  • 아리 2008.04.09 13:33 ADDR 수정/삭제 답글

    아 정말 보고싶고 알고싶던 컨퍼런스자료 공개해주셔서 너무 감사드리고요
    당일날도 즐겁고 재미있게 보고 듣고왔습니다. 역시나 다시봐도 마구 따라해보고싶어지는 강의였어요..의욕떨어지고 자포자기하다가 다시 처음부터 시작하면 되지않을까?란 생각을 가질수있게 해주셔서 감사했습니다!!

  • 없음 2008.04.09 15:23 ADDR 수정/삭제 답글

    정말 많은 도움이 되었던 컨퍼런스였습니다.
    듣는 것만으로도 큰 도움을 얻었는데 자료까지 이렇게 공유해주시니 너무너무 감사드려요~

  • 부성이 2008.04.10 10:21 ADDR 수정/삭제 답글

    금요일 철야작업을 하는바람에 늦잠을자서 30분정도 강의를 못들었는데...이렇게 자료 공유해주시니 너무 감사합니다^^
    공부 열심히 해서 자수님 뒤를 잇는 후배가 될께요 ㅎㅎ

  • jasu 2008.04.10 10:24 신고 ADDR 수정/삭제 답글

    아 모든 분들 말씀 감사합니다. 일일히 댓글 달지 못해서 죄송해요 ^^;
    도움이 되면 좋은 일이에요 ^^ 파이팅~~

  • 마이더스 2008.04.10 15:13 ADDR 수정/삭제 답글

    블로그와서 항상 배워가기만 하네요~
    컨퍼런스때 강의듣고 더욱더 자극받고 열심히 해야 겠다는 생각이 드네요...앞으로도 멋진 플래시 선두그룹에서 이끌어주시기 바랍니다.^^

  • 마넴이리 2008.04.13 11:57 ADDR 수정/삭제 답글

    정말 잘 들었습니다. 자료도 머찌고 인물도 훤하시고 ㅇㅂㅇb
    감사합니다.

  • 야시토미 2008.04.15 10:39 ADDR 수정/삭제 답글

    자료 잘 받아갑니다~ (^^)(__)
    여러모로 도움될것 같아요~

  • 쏘쏘 2008.04.21 11:48 ADDR 수정/삭제 답글

    컨퍼런스 잘들었습니다. 너무 감사합니다~* ^ㅡ^ 좋은자료보고
    열심히 하겠습니다 *_*

  • 마카노슈 2008.04.25 01:19 ADDR 수정/삭제 답글

    명강의 잘들었습니다^^
    인상깊었던 프리젠테이션 플래시도 멋졌어요 ~~
    감사합니다~

    • jasu 2008.04.25 10:07 신고 수정/삭제

      아고...명강의 까지는 잘 모르겠네요..쿠쿠 아무튼 감사합니다. 종종 놀러오세요

[AS3] Logger 그래프

Project/Programming 2008.03.01 14:51

엑셀에서의 XML 스프레드시트를 저장하여 일련의 숫자 데이터를 LineGraph로 표현해주는 기능을 한다. 사내 회의 때 사용할 목적으로 만들게 되었다. 사용하는 XML 스프레드시트 데이터는 기본적으로 규칙을 가지고 있는데 아래와 같다.

하나의 셀에는 1뎁스, 2뎁스, 3뎁스까지 표현을 하고 그 이후 데이터들은 날자 별로 각각의 데이터가 들어가게 된다. 반듯이 지켜야 할 규칙은 1뎁스, 2뎁스, 3뎁스를 표현해야 하며 3뎁스의 첫번째 group의 [방문수, 절대 고유 방문자수, 페이지뷰, 평균 페이지뷰, 사이트 방문 시간] 5개의 데이터 타입을 아래에 group에서도 똑같이 적용을 하여야 한다.

위 최소한의 규칙을 적용한다면 cell의 가로 길이나 1뎁스, 2뎁스의 개수는 몇 개라도 상관이 없다.

이렇게 한 이유는 사용하고자 하는 데이터의 형태를 따르게 되었기 때문이다. 초기 작업 진행에 있어서 xml 스프레드시트 데이터의 형태가 트리구조의 형태를 갖지 못하기 때문에 데이터 표현에 있어서 어떠한 방법을 사용해야 하는지가 고민이었다. 1뎁스 데이터 안에 2뎁스와 3뎁스를 group화 할 경우에 각각의 데이터 비교에 있어서 하나의 그래프에 여러 개의 라인그래프를 넣어야 할 경우 불필요한 참조 형태이기 때문에 복잡한 데이터 구조를 조합하여 하나의 group데이터로 표현해야 하는 문제가 있었다. 이로 인해 CPU낭비와 구조화 작업에 있어서 어려움이 예상되었다.

그래서 뎁스에 따른 데이터를 group화 하지 않고 xml 스프레드시트의 각 라인별(cell단위)를 기준으로 하나의 데이터로 표현하고 AssetData 클래스를 통해서 각각의 cell 데이터를 검사하여 원하는 서비스별 데이터를 array로 받아올 수 있도록 하였다.

이렇게 데이터를 구분하였을 때 1뎁스, 2뎁스에서 원하는 데이터들을 멀티 선택하여 화면에 표현할 수 있게 되었다.

한 화면에서 보여질 수 있는 그래프는 위에서 언급한 것과 같이  [방문수, 절대 고유 방문자수, 페이지뷰, 평균 페이지뷰, 사이트 방문 시간] 5개의 그래프 컨테이너를 보여줄 수 있으며 각각의 그래프컨테이너에는 여러 개의 cell 데이터에 해당하는 라인그래프를 표현할 수 있다.

상단에 풀스크린을 지원하는 아이콘을 클릭할 경우 풀스크린으로 보여질 수 있으나 flashPlayer에서의 풀스크린을 할 경우 키보드 이벤트가 작동하지 않기 때문에 멀티선택을 할 수 없는 문제점이 있다. exe파일은 풀스크린이더라도 키보드 입력을 받을 수 있다.

exe파일 버전으로 올려 놓는다. xml데이터는 가상의 데이터 값을 넣어두었으니 필요하신 분은 비교 대상의 데이터를 직접 넣어서 사용해보면 좋을 것 같다. 플래시 안에서 data.xml 파일을 로드하게 해놓았으니 Logger.exe파일과 같은 폴더에 data.xml 데이터를 넣어서 사용하면 된다.


Logger.zip

http://dicaland.cafe24.com/blog/logger/Logger.swf

    

설정

트랙백

댓글

  • 땡굴이 2008.03.02 04:19 ADDR 수정/삭제 답글

    쉽지 않은 작업일텐데 잘 만들었네..
    혹시 너 한테는 너무 쉬웠던 작업(?) 크크..
    참 부지런한 놈이야.. 회의할 때 쓰려고 만든게 이 정도면 작정하고 프로젝트 진행하면 ... 크크..

    • jasu 2008.03.03 09:57 신고 수정/삭제

      쿠쿠 그냥 부담없이 재밌게 작업했던 것 같네요 살 맛나는 멋진 작업을 만나야겠죠. 아직 못 만난 듯 하여 스스로 노력중입니다. ^^ 멋진 작업 만나게 되면 잘 보이려구요.

  • 우야꼬  2008.03.04 22:36 신고 ADDR 수정/삭제 답글

    와 멋지네요^^
    이렇게 멋진걸 회의때만 쓰기에 아까운거 같네요 ㅎㅎ

  • 문군 2008.03.28 13:47 ADDR 수정/삭제 답글

    대단하십니다 역시 형님;;;
    진짜 흠잡을곳이 없네여 ^^

[AS3] CurveMotion

Project/Programming 2008.01.18 17:49
기존에 만들었던 라인 모션 클래스에서 생성된 이후 모션처리기능을 추가하였다.















    

설정

트랙백

댓글

  • jin_u 2008.01.19 11:55 ADDR 수정/삭제 답글

    너 심심하구나!! ㅋㅋ

    • jasu 2008.01.21 11:18 신고 수정/삭제

      ㅎㅎ 예전에 만들었던 것을 정리하다가 포스팅을 너무 하지 않은 것 같아서 올렸더만 심심해 보이나? 놀아줄텨? 쿠쿠

[AS3] Components

Project/Programming 2008.01.17 13:09
Keith Peters가 만들었던 미니컴포넌트를 Event형태로 변형하고 기능적인 요소들을 추가해 보았다. 기존의 RadioButton의 경우 static array에 등록하고 사용을 하게 만들었는데 한 플렛폼에서 여러 개의 그룹 RadioButton이 있을 수 있어서 RadioButtonContainer로 생성한 인스턴스를 통해서 그룹핑 하도록 하고 RadioButtonContainer.addEventListener(ComponentMouseEvent.MOUSE_DOWN, handler)를 통해서 클릭한 RadioButton을 evt.data로 넘겨 받도록 하였다.

기본 Style 클래스 내에서 컴포넌트 스킨을 적용하고 모든 컴포넌트 스킨 일괄 적용을 위해서 Component 클래스의 setStyle를 override 하도록 하였다.

심플한 Display 형태와 구조이지만 컴포넌트를 통해서 구조적 접근 방법을 좀더 다양화 할 수 있지 않을까 싶어서 만들어 보았다.





사용자 삽입 이미지


    

설정

트랙백

댓글

[AS3] CurvePointMotion

Project/Programming 2007.11.30 00:55

Point 클래스의 x, y 값을 통해 curve 라인 모션을 적용해 보았다.





http://dicaland.cafe24.com/blog/StarlingStartup.swf

http://dicaland.cafe24.com/blog/Startup3.swf

http://dicaland.cafe24.com/blog/custom01.swf

http://dicaland.cafe24.com/blog/custom02.swf

http://dicaland.cafe24.com/blog/Visual3_1360x768.swf





    

설정

트랙백

댓글

  • 궁금이 2007.11.30 09:53 ADDR 수정/삭제 답글

    멋지십니다. 그려진 커브따라 움직이는 것은 라인을 가이드라인으로 잡아주는 클래스라도 생긴것인지.. 아님 커브 그리는데에 먼가가 새로운게 있는 건지.... ㅎㅎ 도무지 감을 못잡겠네요. 신기하네요 ^^ 힌트 좀 주세요 ^o^

    • jasu 2007.12.03 00:17 신고 수정/삭제

      curve를 그려주는 것은 caurina tweener의 _bezier 속성을 사용한 것입니다. http://jasu.tistory.com/264 포스팅을 해 놓았으니 참고하세요... ^^

[AS3] BasicButton 테스트

Project/Programming 2007.11.18 02:07
테스트 파일을 만들 때 버튼을 많이 사용하게 되는데 기본 적으로 사용하는 버튼이 없어서 만들어 봤다. 클릭시 나타나는 숫자들의 의미는 없다.


function getString():String{
var str:String = "";
var intLen:int= Math.random()*30;
for(var i:int;i<=intLen;i++){
str +=String(int(Math.random()*9));
}
return str;
}







    

설정

트랙백

댓글

[AS3] 텍스트 넘버링....

Project/Programming 2007.11.04 05:38
오랜만에 개인 작업물을 포스팅 하는 것 같다. 이번에는 3개의 클래스를 테스트하는 과정에서 만들어 진 것이다. 하나는 caurina Tweener를 통해 모션 효과를 주었고, 두 번째는 실무 작업에 쓰였던 DZeroNumber 넘버링 클래스, 그리고 세 번째는 이미지를 틀어서 사각 박스 모션을 적용하는 클래스를 사용했다.

화면에서 클릭을 하면 넘버링 효과와 함께 클릭한 위치로 텍스트필드가 이동을 한다. 이동 좌표 모션은 랜덤한 4 point 좌표에 해당하는 Bezier 곡선으로 이동을 하며,  DropShadow 필터의 blurY, blurX, distance, angle 속성 또한 랜덤으로 적용하였다.

텍스트필드가 위로 올라가는 느낌이 나도록 distance와 blurX, blurY속성은 같은 값이 되도록 하였다. 텍스트 모션이 끝나는 시점에서 화면을 BitmapData로 저장하여 사각 박스의 한 면이 떨어지는 효과를 넣었는데 up, down, right, left는 랜덤으로 그때마다 적용을 달리 해봤다.

별 의미 없는 작업이지만 재미있게 놀았던 것 같다…





    

설정

트랙백

댓글

  • 서연아빠 2007.11.04 05:44 신고 ADDR 수정/삭제 답글

    자수님 드뎌 블로거뉴스 진출? ㅋㅋ

    • jasu 2007.11.04 19:22 신고 수정/삭제

      쿠쿠 포스팅 할때마다 등록은 하고 있지만 관심사 밖이라서 최근 올라온 글에서만 볼 수 있을 것 같네요 저도 언제 한번 트레픽 신화를...쿠쿠

  • 사자머리 2013.07.10 17:02 ADDR 수정/삭제 답글

    넘버링 어떻게 하는지 궁금해서 그러는데 부탁 좀 드려도 될까요...? ^^;

[AS3] 다이나믹 넘버링...

Project/Programming 2007.10.14 04:13
업무상 다이나믹하게 숫자가 바뀌는 형태가 필요해서 만들어 보았다. 이제 어느덧 내 나이 31살 이다 보니 예전처럼 머리가 잘 돌아가지 않는 것 같다. 정도를 밟아서 코드를 작성하면 될 것을, 에러나면 귀찮다는 핑계로 trace로 대충 찾아 헤매다 보니, 체크해야 할 시작 점과 끝 점을 제대로 파악하지 못하고 건성이다.














    

설정

트랙백

댓글

  • 소다수 2007.10.15 08:41 ADDR 수정/삭제 답글

    와우~~

  • moonkoon 2007.10.15 21:50 ADDR 수정/삭제 답글

    소름 쫚;;;; 멋져여 ㅠㅠ

    • jasu 2007.10.15 23:27 신고 수정/삭제

      ^^; 왜 소름이 ;; 아무튼 감사합니다.;

[AS3] CenterPoint 클래스 예제

Project/Programming 2007.10.05 18:39
표시 오브젝트들이 상속하고 있는 DisplayObject 클래스에는 globalToLocal(point:Point):Point 와 localToGlobal(point:Point):Point 메소드를 지원하고 있다. 이를 통해서 DisplayObject의 특정 좌표로 중심점을 이동하는 클래스를 테스트 해 보았다.

아래 예제에서는 rotation을 하고 있는 rectangle의 특정 좌표 점을 클릭하게 되면 DisplayObject의 중심점을 이동하며 한번의 클릭당 해당 오브젝트의 scaleX, scaleY를 각각 0.05 값만큼 증가시키도록 해 놓았다.

이는 실질적으로 표시 오브젝트의 중심점이 이동하는 것이 아니라 local 좌표와 global 좌표간의 gap에 따라서 위치 이동하는 것으로, 생성한 CenterPoint에 있는 get, set 메소드인 rotation 메소드를 통해서 로테이션이 컨트롤 되며, scaleX, scaleY의 값 또한 CenterPoint 클래스에 작성한 메소드를 통해서 컨트롤 되도록 되어 있다.


    

설정

트랙백

댓글

  • moonkoon 2007.10.06 00:42 ADDR 수정/삭제 답글

    읔;;; 저 단순한 모션이 왜케 머찐거징 --;;;

    자수님 암튼 자꾸 좌절하게 만드시면서 불끈거리게 만드셔성 감사 ㅋㅋㅋ

  • 이니셜Z 2007.10.09 11:19 ADDR 수정/삭제 답글

    회전공식을 사용하지 않고도 중심점을 기준으로 회전이 되니.
    참 편리합니다.^^
    어쩜 기하학 적인 알고리즘이
    localToGlobal, globalToLocal이라는 메서드에
    숨어있을지도 모르겠내요.

    • jasu 2007.10.10 09:39 신고 수정/삭제

      globalToLocal(point:Point):Point 와 localToGlobal(point:Point):Point 메소드에서 지원하는 기능은 아니고 그들 메소드를 이용해서 CenterPoint라는 클래스를 만들어서 테스트 예제로 올려 놓았습니다.

  • JHKIM 2008.01.03 14:43 ADDR 수정/삭제 답글

    안녕하세요 자수님.
    displayObject 의 포인트를 어떻게 옮겨야 하는가 한참 고민하던터에 찾게되었습니다..
    포인트를 이용하여 displayObject 의 중심점을 이동한다.. 이해가 잘 안되네요..;;
    조금 쉽게 설명을 들을 수 있을까요..? - wltn222@naver.com

    • jasu 2008.01.03 20:15 신고 수정/삭제

      만약 sprite라는 Sprite가 있을 경우, 이것 자체의 중심점을 이동하기는 어렵습니다. 위 결과물과 같이 sprite를 감싸는 parentSprite를 만들어서 sprite.rotation 값을 적용하는 것이 아니라 parentSprite에서 설정한 get, set rotation 함수를 통해서 컨트롤 할 수 있습니다. parentSprite 안에 있는 sprite의 x, y 좌표를 이동하는 것으로 sprite가 중심점을 이동하는 것처럼 표시할 수 있습니다. 플래시 스테이지 상에서 무비클립을 만들때 Shape의 위치를 이동하는 것과 같은 효과로 보시면 될것 같네요

  • JHKIM 2008.01.04 11:03 ADDR 수정/삭제 답글

    아... 그런 힌트가 있었군요~ 자수님께 한수 배우고 갑니다 ^^

    • jasu 2008.01.09 16:58 신고 수정/삭제

      힌트라고 하기도 좀 뭐한 방법이에요 ^^;

[AS3] 웹페이지에 코드를 이쁘게 보여주는 AScodeViewer

Project/Programming 2007.09.13 06:43

AScodeViewer 1.0 Beta

개인적으로 플래시 코드를 웹상에 올릴 때 하이라이트를 적용하여 편하게 보기 위해서 만들었다. 만들다 보니 플래시 코드뿐만 아니라 다른 코드의 경우도 xml 파일을 수정하는 것으로 적용할 수 있다.

기능적인 요소
기능적인 요소로는 swf에 외부 변수값(코드파일url, 라이라이트 xml, 스타일 xml, selectable) 값을 전달하여 불러들인 xml과 코드, 그리고 코드를 선택 및 복사가 가능하도록 할 것인지를 지정하는 sable 값을 전달하게 된다. 이로서 AScodeViewer.swf 파일에서 코드 하이라이트 및 스타일이 적용된 AScodeViewer를 볼 수 있다.

외부 변수 값을 전달할 때 주의할 점은 크로스도메인 정책에 따라 도메인이 다른 url 경로에 있는 코드나 xml를 불러올 수 없다는 것이다. AScodeViewer.swf 파일이 있는 위치와 같은 도메인 상에 있는 파일을 불러들여야 한다.


사용성에 따른 기능적인 요소로는 오른쪽 하단에 보면 FullScreen mode로 전환할 수 있는 버튼이 있다. 클릭을 할 경우 전체 풀사이즈 화면으로 코드를 볼 수 있는 기능이다.

사용 방법
AScodeViewer을 사용하는 방법은 아래 제공하는 파일을 다운 받아서 사용하고자 하는 계정에 업로드를 하고 아래와 같이 코드를 웹페이지 html상에 넣어주면 된다.

<object width="700" height="400" >
<param name="bgcolor" value="#242424" />
<param name="allowFullScreen" value="true" />
<param name="FlashVars" value="code=TintColor.as&format=as3.xml&style=style_dark.xml&sable=true" />
<param name="movie" value="AScodeViewer.swf" />
<embed src=" AScodeViewer.swf"  flashvars="code=TintColor.as&format=as3.xml&style=style_dark.xml&sable=true" type="application/x-shockwave-flash" allowFullScreen="true" width="700" height="400" bgcolor="#242424" /></embed>
</object>

위에서 보이는 바와 같이 FlashVar에 해당하는 부분의 변수들에 각각의 파일 및 설정 값을 넣어주면 된다. 위 코드의 경우는 swf파일이 있는 같은 폴더 안에 code, format, style 에 해당하는 파일들이 있는 것으로 가정한 것이다.

하이라이트 및 스킨 적용 방법
코드 하이라이트는 플래시 스크립트 에디터로 많이 사용하고 있는 FlashDevelop 프로그램의 language폴더에 있는 xml 데이터를 그대로 사용하였다. FlashDevelop 프로그램을 사용하는 분은 아래 경로에서 사용하고 있는 하이라이트 xml 파일을 취득할 수 있다.

C:\Program Files\FlashDevelop\FirstRun\Settings\Languages

위 경로에서 보면 AS3.xml, AS2.xml, Jscript.xml 등을 볼 수 있는데 AScodeViewer 1.0 Beta에서 지원하는 xml 형태는 AS3.xml, AS2.xml, Jscript.xml, HaXe.xml 이다. 다른 C++ 이나 Java 등의 코드 하이라이트를 사용할 경우에는 위 4개의 파일 중에 아무 파일이나 열어서 해당 언어에서 사용하는 하이라이트 단어들을 등록하고 다른 이름으로 저장하여 사용하면 된다.

AScodeViewer의 스킨 적용은 제공하는 Style_dark.xml 파일이나 style_light.xml 파일을 열어서 해당 부분의 RGB 색상을 변경하여 스킨을 바꿀 수 있다. 아래 이미지를 보면 style.xml 파일에서 지정할 수 있는 부분들을 표시해 놓았다.

사용자 삽입 이미지


아래는 파일로 제공하는 두 가지 스킨을 적용한 예이다. Style_dark.xml 이나 style_light.xml 파일을 수정하여 원하는 색상을 만들어 낼 수 있기 때문에 적용하는 페이지상의 디자인에 맞게 수정하여 사용하면 된다.
왼쪽은 style_dark.xml을 적용한 예이고 오른쪽은 style_light.xml을 적용한 예이다. 왼쪽의 경우 코드 선택이 안되도록 sable = false 값을 적용하였다.


아래 파일을 다운로드 하여 위에서 설명한 대로 원하는 페이지에 적용하면 된다. 블로그 서비스에서는 “외부 멀티미디”어 등에서 youtube 동영상을 임베드 하는 형태로 적용하면 된다. 주의할 점은 위에서 언급한 바와 같이 AScodeViewer.swf 파일이 있는 곳과 불러오는 파일들의 도메인이 같아야 한다는 것이다(같은 도메인 내의 폴더 구분은 상관없다.)

앞으로 버전업의 경우도 FlashDevelop의 기능을 적용할 생각이다. 시간이 허락하는 대로 업데이트 버전을 올려 놓도록 하겠다. 사용하다가 문제점이 있거나 버그 발견 시에는 아래에 댓글로 남겨주시면 많은 도움이 될 것 같다.


AScodeViewer1_0Beta.zip

    

설정

트랙백

댓글

  • 지돌스타 2007.09.13 09:53 ADDR 수정/삭제 답글

    이야~ 아이디어 정말 훌륭하군요~

    • jasu 2007.09.13 15:28 신고 수정/삭제

      감사합니다. ^^ 외국분이 2005년도 경에 작업했던 것이 모티브가 되었습니다.

  • 공씨 2007.09.13 10:12 ADDR 수정/삭제 답글

    >ㅁ< 형님 브라보~ 멋져요~

    • jasu 2007.09.13 15:29 신고 수정/삭제

      고마우이...쿠쿠 사용해보고 문제 있으면 알려주라

  • 뚜기~ 2007.09.13 14:04 ADDR 수정/삭제 답글

    ^-^ 멋지네요~ ㅋ

    • jasu 2007.09.13 15:30 신고 수정/삭제

      감사합니다. ^^ 유용한 자료가 되었으면 좋겠네요

  • 금봉이 2007.09.13 14:53 신고 ADDR 수정/삭제 답글

    너무 멋집니다.. ^^
    제가 SQL파일에 적용하던 중에 커맨트안에 '가 들어가니까 이후 문장이 다 스트링값의 색으로 변경되어 버리더라고요. /* This lock is global, so we can't tell */ 라는 커맨트에서 can't의 '이후가 다 스트링으로 인식해버리더라고요.. can not으로 바꿔버려 해결했지만... 다음 버젼에는 가능하면 수정해 주시면 감사하겠습니다. 혹시 제가 잘못했을지도 모르니 테스트한번 해보시와요.
    멋진 tip을 올려 주셔서 감사드립니당~!

    • jasu 2007.09.13 15:32 신고 수정/삭제

      감사합니다. 확인해 본 결과 ActionScript 코드나 여타 언어에서는 문제가 발생하지 않았는데 sql 코드에서는 언어 구조에서 약간 오류가 있었던 것 같네요 확인하고 수정하였으며 다시 파일을 업로드 하였습니다. 불편하시더라도 다시 다운로드 하셔서 swf 파일만 대체해서 사용하세요...

  • 사노이 2007.09.13 16:01 ADDR 수정/삭제 답글

    멋집니다^^ 언제나 말보다는 행동으로,결과물로 보여주시는게 정말 존경스럽습니다.
    저도 많이 노력해야겠네요^^

    • jasu 2007.09.13 17:30 신고 수정/삭제

      제가 말수가 좀 없어서 오해를 하신거 아닌가 하는 생각이 드네요^^ 아무튼 말씀 고맙습니다.

  • 금봉이 2007.09.13 16:41 신고 ADDR 수정/삭제 답글

    와우~! 빠른 응답속도를 보이시는 JASU님께 다시 한번 존경을 표합니다... ^^;
    고맙습니다.

    • jasu 2007.09.13 17:32 신고 수정/삭제

      ^^ 네... 유용하게 사용하세요...감사합니다.

  • 열이아빠 2007.09.14 08:31 신고 ADDR 수정/삭제 답글

    하루사이에 벌써 버전업까지 되었네요.
    멋진 기능 감사합니다.

    • jasu 2007.09.14 13:15 신고 수정/삭제

      버전업은 아니고 금봉이님께서 sql 코드를 넣었을 때 위와 같은 문제가 있어서 살짝 수정해서 몰래 엎어치기 해놨어요..쿠쿠 감사합니다.

  • fan 2007.10.07 07:08 ADDR 수정/삭제 답글

    너무 좋은데.. as 2.0 버전으로도 만들어주시면 더 좋겠습니다^^

    • jasu 2007.10.07 12:29 신고 수정/삭제

      안녕하세요.. flashDevelop 프로그램폴더에 있는 as2.xml 파일을 사용하시면 as2 버전 highligiht 기능을 사용할 수 있습니다. ^^

  • fan 2007.10.07 18:57 ADDR 수정/삭제 답글

    as2 버전 하이라이트가 아니구요.. AScodeViewe를 as2버전으로 제작하는것을 말씀드린겁니다^^
    다른무비에서의 로딩이 가능하도록 말이죠..^^

    • jasu 2007.10.08 10:01 신고 수정/삭제

      ^^; 요즘은 2.0보다 3.0이 친근한 것 같네요... fan님께서3.0을 접해보시는 것도 나쁘지는 않을 것 같습니다. 2.0으로 다시 제작하기에는 의미가 없는 것 같아서 어려울 것 같네요..^^ 아무튼 감사드립니다.

  • 동강 2007.11.10 04:58 ADDR 수정/삭제 답글

    와우 자기 소스 자료 관리 할때 유용하게 쓰일꺼 같아요, 잘 쓸께요.

    • jasu 2007.11.12 02:47 신고 수정/삭제

      좀더 편하게 만들고 싶었는데 그놈에 크로스도메인 때문에 소스 코드 업로드로 인해서 불편함이 있네요 서버에서 서비스를 한다면 좀더 편해지지 않을까 싶긴 하지만...;;

  • 원강민 2008.03.25 10:03 신고 ADDR 수정/삭제 답글

    http://airdev.tistory.com/226
    AIR로 SWF를 생성해주는 어플을 만들었습니다..트랙백 안걸려서 덧글로^^

    • jasu 2008.03.25 16:21 신고 수정/삭제

      오.. 편하겠네요 ^^ 스킨을 수정 가능한 기능을 추가하면 좋겠네요 ^^

  • 리베하얀 2008.05.09 13:33 ADDR 수정/삭제 답글

    정말 좋네요~
    한번 사용해야 겠습니다
    늘 좋은 정보만 얻고 가네요~

  • seo4234@hanmail.net 2009.02.05 17:18 ADDR 수정/삭제 답글

    한글이 깨져서 나오는건 왜 그런걸 까요?

    • jasu 2009.02.07 12:31 신고 수정/삭제

      제가 한글입력을 안해봤네요 잠시만요

    • jasu 2009.02.07 12:31 신고 수정/삭제

      위 게시물에 한글을 입력 해 봤는데 제대로 나오는것 같네요 아무래도 플래시 소스에서의 문제 보다는 적용한 코드 소스 파일의 인코딩에서 문제가 발생 하는 것 같습니다. 적용한 코드를 메모장으로 열어서 다른 이름으로 저장시 UTF-8로 저장해 보세요

    • seo4234@hanmail.net 2009.02.15 16:05 수정/삭제

      좋은 답변 감사합니다. 다시 한번 해보도록 할게요.

  • Flask 2009.07.03 12:46 신고 ADDR 수정/삭제 답글

    폰트는 바꿀수 없나요? // 그런데 저는 적용이 쉽지 않네요,,,, 티스토리 쓰는데 그냥 컬러값이 #242424인 박스(700x400)만 나오고 '동영상이 로드되지 않음'이라고만 떠요,,ㅠㅠ

    정말 사용하고 싶은데 어떻게 하면 될까요,,,(다운로드 받은 파일과 as파일을 스킨에 업로드 한뒤 html 코드를 html 에디터에 넣은뒤 as파일 이름만 바꿔서 저장했습니다..)

    • jasu 2009.07.05 22:55 신고 수정/삭제

      안녕하세요
      댓글이 좀 늦었네요 폰트는 사용하시는 style xml 데이터 아래에 보시면 폰트 관련 default 설정 노드가 있습니다. Courier New 부분은 원하시는 폰트명으로 바꾸시면 됩니다. 윈도우 설치시 기본으로 들어있는 시스템폰트를 이용하셔야 정상적으로 적용됩니다.

      동영상이 로드되지 않음 이라고 표시되는 것은 swf의 경로가 잘못되어 해당 경로에서 swf파일을 찾을 수 없을 때 방생합니다. swf파일 경로가 제대로 되어 있는지 확인이 필요합니다. 감사합니다.

    • Flask 2009.07.06 12:52 신고 수정/삭제

      답변 감사합니다,,ㅎ
      그런데요, 억지로 swf파일의 경로를 적어줘서 해두었는데 계속 동그라미만 돌아가네요,,,아마 다른 파일들(xml)을 읽어들이지 못하는것 같은데요,,,

      제가 한 방법이 맞는지 말씀해주세요,,ㅠ

      1. 다운로드 받은 파일을 압축을 풀고 티스토리 어드민에 들어간다음, 스킨 바꾸기에서 파일업로드를 눌러 파일들을 업로드 한다. 추가로 내가 작성한 TA.as파일도 업로드 한다. ( 자동으로 경로가 images/파일명 으로 되더군요,, )

      2. 자수님 블로그에 적혀있는 태그를 복사한뒤 글쓰기에서 html에디터로 들어간다음 붙여넣고 TintColor.as -> TA.as(제가 업로드 한것)로 바꿔준다.

      3. 글작성을 완료하고 확인한다 (-> 동영상이 로드되지 않음. 그래서 swf파일을 글에 업로드 한뒤 그 경로를 적어주니 swf파일은 로드되지만, 동그라미만 돌아감,,,)

      아 이거 제가 바보같아서 정말 죄송하네요,,,

    • jasu 2009.07.06 17:05 신고 수정/삭제

      안녕하세요
      제가 설명을 명확하게 해놓지 않은 것 같습니다.
      다른 문제는 없어 보입니다. 다만 FlashVars로 swf 파일에 전달하는 변수들의 값들을 모두 http://를 포함한 절대경로로 지정해 주시면 될것 같습니다. 플래시에서 파일 경로를 탐색할 때 swf가 임베드되어 있는 html파일의 위치에 따라 상대경로를 지정합니다. 샘플에서 작성해 놓은 것은 로컬에서 모든 파일이 한 폴더에 있을 때 가정으로 설명해 놓은 것이니 모든 파일 경로는 http://를 포함하는 절대경로를 지정해 보세요
      감사합니다.

    • Flask 2009.07.07 15:22 신고 수정/삭제

      우...와..... 드디어 성공했어요,,,,ㅠㅠ

      스킨에 업로드된 파일의 겅로를 찾아줘서 적어주면 되는군요! (제 경우는 http://cfs.tistory.com/custom/blog/24/246210/skin/images/ 이거 네요,,,ㅎㅎ)

      아, 정말 잘되요!! 정말 좋은 기능이에욧!! ^^

      답변 정말 감사드립니다!

      // 배경에 줄이 있으면 어떨까요? 그냥 선 말고 한줄씩 격줄로, 드래그 된 모양으로 줄구분이요;;ㅎ,,,,

    • jasu 2009.07.16 20:29 신고 수정/삭제

      라인으로 구분지어 놓으면 보기 편할거 같기는 하네요 ^^ 감사합니다.

  • -_-;; 2009.10.07 19:26 ADDR 수정/삭제 답글

    이런 아예 안되네요... 그냥 검은 화면만나오고..

    • jasu 2009.10.07 21:03 신고 수정/삭제

      안녕하세요~
      플래시가 나오지 않을 경우는 아마도 경로문제일 것 같습니다. swf 파일 경로와 xml, as파일 경로가 제대로 적용되어 있는지 확인해 보시는 것이 좋을 것 같습니다. 안되는 페이지 경로를 보내주시면 확인해 보도록 할께요 감사합니다.

  • -_-;; 2009.10.16 20:26 ADDR 수정/삭제 답글

    그래도 검은 박스만 뜨는데요;;
    스킨에 업로드된 파일 경로를 어떻게 알아내는지...
    주소표시줄 있는거 복사해도 안되는데요;;....-_ㅡ;;

    • jasu 2009.10.18 01:38 신고 수정/삭제

      일단 올리신 임베드 소스와 as파일 경로, xml파일 경로 등을 올려주세요 제가 확인해 보고 문제가 있는 부분을 알려드릴께요

  • 천우철 2010.10.15 10:26 ADDR 수정/삭제 답글

    자수님 안녕하세요 처음뵙겠습니다 ^^
    자료 잘 받아서 블로그에 처음 적용해보았습니다. 너무 이쁘고 쓰기 간편하네요.
    잘쓰겠습니다 공부도 열심히 하겠습니다.
    수고하십시요 ^^

    • jasu 2010.10.18 18:00 신고 수정/삭제

      안녕하세요 ^^ 네 하도 오래전에 올려놓은 스킨이라 현재 티스토리 환경과 잘 맞을지는 모르겠네요. 감사합니다.

[AS3] SelectArea, DrawShape and Sewing

Project/Programming 2007.08.31 18:30
예전에 http://www.tileui.com/ 사이트를 보면 스테이지 상에 있는 복수의 오브젝트를 선택할 때 직사각형으로 선택하는 것이 아닌 draw 형태를 이용하여 필요한 요소만 선택할 수 있다. 이 것을 보고 그려진 Shape를 통해서 선택할 수 있도록 하면 되겠다 싶어서 구현해 봤다.

일단은 클래스의 구조는 아래와 같이 작성했다.

DrawShape.as
이 클래스는 Point 요소를 가지고 있는 Array를 전달하고 그것을 통해 그려진 Shape를 돌려주는 클래스

Sewing.as
이 클래스는 Point 요소를 가지고 있는 Array를 전달하고 그것을 통해 외각선을 그려주는 클래스

SelectArea.as
이 클래스는 DrawShape와 Sewing클래스를 통해 그려진 Shape에 걸쳐진 오브젝트들을 Array로 반환하는 메소드를 가지고 있다. 여기에는 마우스를 UP을 했을 때 Event를 dispatch하게 되는데 이벤트를 받는 메소드에서 기존의 array 요소 중에서 선택된 오브젝트 요소를 가지고 있는 새로운 배열을 참조할 수 있게 하였다.

아래 예제에서는 랜덤한 위치에 생성한 오브젝트들을 마우스 down and drag, up을 통해서 선택을 하면 대각선 방향으로 정렬하게 해놨는데 대각선으로 정렬되는 것은 일정한 규칙이 있는 것은 아니고 디테일하게 하기 귀찮아서 그냥 되는대로 정렬해놨다…쿠쿠 목적이 없는 예제는 슬슬 힘이 빠진다는..;;

    

설정

트랙백

댓글

  • c.moore 2007.11.11 19:59 ADDR 수정/삭제 답글

    Any source going to be made available for this? I could really see this being useful to many :) thanks!

    • jasu 2007.11.12 02:48 신고 수정/삭제

      Sorry... I don't reveal the source code... but, if my source code is cleanup, i will... thank you for visit my blog...

  • SC 2008.10.02 16:53 ADDR 수정/삭제 답글

    JaSu님 제발. .다시한번만 볼수 없을까요 ..
    영역 선택문제 때문에 살이 쫙쫙 빠지고 있습니다.

    • jasu 2008.10.07 12:54 신고 수정/삭제

      이 게시물에 대한 소스는 오픈한 적이 없습니다. hitTest와 좌표계를 이용하시면 될것 같네요 소스는 예전에 만들어 놓은 자료에서 정리가 되지 않아서 정리가 되면 올려 놓도록 하겠습니다. 감사합니다.

  • SC 2008.10.09 07:31 ADDR 수정/삭제 답글

    JaSu님 ㅋㅋ 영역선택하는거 성공했습니다 .ㅋ
    차분히 생각하면서 하면 되는군요.ㅋ
    감사합니다 .ㅋ

APE : SpringConstraint의 이벤트는 왜...

Project/Programming 2007.08.23 05:50

Collide 이벤트를 가지고 형광등을 표현해 봤다. 형광등의 진공 유리관에도 collide 이벤트를 적용하려고 했었는데 SpringConstraint에서 이벤트 반응을 하지 않는다. 구조상으로는 SpringConstraint -> AbstractConstraint -> AbstractItem -> EventDispatcher 와 같은 상속관계를 갖고 있음에도 이벤트에 반응하지 않는 것이 좀 이상하다.

일단은 진공관에 대한 이벤트 반응과 collidable을 false로 해 놓았다.


    

설정

트랙백

댓글

APE(Actionscript Physics Engine) Class Diagram

Project/Programming 2007.08.16 10:05

기존에 만들었던 APE의 UML에서 Association 표기가 없었던 것을 추가하고 기존에 잘못 되었던 부분을 수정했다. 클래스 소스를 기준으로 작성된 class diagram이므로 정확하지 않을 수 있지만 대체적으로 package를 분석하는데 도움이 될 것 같다.

아래 풀사이즈 jpg이미지와 플래시로 만들어 놓은 파일을 올려놓는다.  






사용자 삽입 이미지





    

설정

트랙백

댓글

  • 지돌스타 2007.08.16 14:33 ADDR 수정/삭제 답글

    오~ 멋집니다. 아직 APE는 사용해보지 않았지만 올려주신 예제 들을 보면 실질적이면서도 동적인 것을 만드는데 큰 도움이 될 것 같습니다.

    • jasu 2007.08.16 17:37 신고 수정/삭제

      네...지금은 엔진 부분은 static으로 하나만 돌릴 수 있도록 되어 있는데 아무래도 안정성 문제 때문에 그런듯 싶네요.. 각 오브젝트별로 vectorForce를 따로 지정할 수 있다면 다용도로 사용할 수 있지 않을까 싶네요...^^ APE는 일단 심플해서 좋습니다.

  • 2007.08.17 09:26 ADDR 수정/삭제 답글

    비밀댓글입니다

  • 동강 2008.02.15 02:38 ADDR 수정/삭제 답글

    APE 를 공부 하는데 많은 도움이 되고 있습니다. 자료 감사합니다.ㅎ

    • jasu 2008.02.15 10:36 신고 수정/삭제

      도움이 되었다니 좋네요 ^^ 즐공하세요

[AS3] WheelParticle 상속

Project/Programming 2007.08.12 22:40
WheelParticle 클래스를 상속하여 Square 클래스를 만들어 봤다. WheelParticle 클래스에서는 angle 메소드를 원하고 있어서 paint 메소드를 오버라이드 할때 그리게 되는 graphics의 rotation에 적용하였다.

화면에서 마우스를 클릭하고 있으면 Square 오브젝트 들이 생성하며 일정한 범위(y값 450) 이상으로 넘어가는 오브젝트는 엔진에서 제외(and sprite 삭제) 하였다.

엔 진에서 제외할 때 더이상 사용하지 않는 sprite인 경우에는 delete 시켜줄 필요가 있다. removeParticle을 실행할 때 cleanup 메소드를 통해서 해당 sprite에 있는 오브젝트들을 removeChildAt 시켜주지만 sprite 그 자체는 메모리에 남아있게 된다.

왼쪽, 오른쪽에는 경계영역을 만들어 분산되는 오브젝트들을 어느정도 밀집시켰다.


    

설정

트랙백

댓글

  • jin_u 2007.08.13 19:50 ADDR 수정/삭제 답글

    cool~~

    • jasu 2007.08.13 22:44 신고 수정/삭제

      서늘하나? 쿠쿠 뭐 재밌는 일 없낭...

  • jin_u 2007.08.14 08:56 ADDR 수정/삭제 답글

    여친이랑 단땅 하는데 너도 할래? 지금 새롬98 버전으로 하니깐 자꾸 튕기네, 그래서 지머드 설치해보고 최신 새롬 설치해 보고 있다. 관심있으면 연락 하도록~

    • jasu 2007.08.14 11:09 신고 수정/삭제

      앙 그런거 말공...예를 들면 좀 전에 대전 친구한테서 문자가 왔는데 공주님이 탄생했다는....뭐 이런거 말이지..쿠쿠

  • moonkoon 2007.09.21 02:41 ADDR 수정/삭제 답글

    와웅 다시바도 놀랍네여 ㅠ_ㅠ 이거 하는게 요즘 소원이라능 -_-;;
    힌트좀 주세용 ㅋㅋㅋ

    • jasu 2007.09.21 18:23 신고 수정/삭제

      APE라는 물리엔진을 이용했습니다. wheelparticle 클래스를 상속해서 sprite를 사각으로 표시한 것이구요 포스트중에 ape관련 내용들이 있으니 참고하세요... 기본적인 사용 법은 ape 홈페이지에서 소스를 다운로드 하시면 어렵지 않게 응용하실 수 있을 것 같습니다.

[AS3] Revive 테스트

Project/Programming 2007.08.08 13:37
Circle 오브젝트를 클릭하여 드레그할 수 있다. 중앙 원은 ImmovableCircleInnerSegment(움직임이 없는 중력방향 Inner)이다.



 





 
 


 


    

설정

트랙백

댓글

[AS3] 무게 중심축과 질량

Project/Programming 2007.08.07 03:08
검은 바탕화면에서 마우스를 Down하고 있으면 CircleParticle을 생성하게 되는데 갯수는 16개로 한정하였다. 중력에 의해서 아래로 하강할 때 스테이지 밖으로 밀려나는 것들에 대해서는 삭제하였다. 
















    

설정

트랙백

댓글

  • jin_u 2007.08.06 18:28 ADDR 수정/삭제 답글

    재밌다 재미써~ 근데 파일은 오픈 안하냐??
    요즘에 물리에 빠져는거 같다? 맨날 물리에 관련된 것들이 올라오네? 재밌다. 소스 공개해라~ 그리고 이건 안터지는군...~

    • jasu 2007.08.07 03:02 신고 수정/삭제

      APE 엔진을 가지고 구조나 흐름을 분석해볼 목적으로 만든느거라 소스는 형편없다..쿠쿠 좀더 바람직한 뱡향으로 흐르게 되면 그때야.... 잘 만들어진 api나 엔진들을 보면 공부가 되는거 같다.
      뻑난건 내탓 아니랑께, 쿠쿠 임베드 코드 수정해서 다시 올려놓은 것들이니까 cpu도 그다지 많이는 안 올라갈거 같은데...

  • 지혜 2007.08.10 15:05 ADDR 수정/삭제 답글

    와~멋있어요~ㅎㅎ

[AS3] 물리엔진 중력의 관계

Project/Programming 2007.08.05 11:11
APE를 통해서 물리 엔진을 실험하기 위해 샘플을 만들어 봤다. 기본적인 클래스 기능에 대한 이해를 위해 비교적 간단한 오브젝트와 관계를 통해서 실험을 했다.

엔 진의 구동은 기본적으로 APEngine클래스의 영역 안에서 실행이 된다. init 메소드와 container 메소드 등으로 기본적인 세팅을 하게 되며 addGroup 메소드를 통해서 물리 역학에 대한 관계를 형성할 인스턴스들을 등록한다. 등록된 인스턴스들은 각각의 기능에 따라 서로 관계를 형성하게 된다.

충돌과 중력, 무게에 관련된 파라미터들을 볼 수 있었는데 자세한 것들은 클래스를 좀더 분석해 봐야 할 듯싶다. 만들어 놓은 위 결과물의 기능은 다음과 같다.

검은 화면에서 마우스 클릭을 할 경우 원형의 오브젝트를 생성하며 중력에 의해서 아래로 하강한다. 하강 과정에서 로프에 걸리게 된다. 생성한 각각의 오브젝트들도 서로 관계를 형성하며 탄성을 갖게 된다.

로 프의 원형을 클릭할 경우 CircleParticle 오브젝트가 가지고 있는 fixed(Boolean)의 값을 변경하게 되는데 true일 경우에는 고정이며 false일 경우에는 비 고정상태로 주변의 오브젝트의 반응에 의해서 역학 운동을 하게 된다. 이때 true일 경우 붉은색, false일 경우에는 노랑색으로 구분하였다.

* circle 오브젝트 생성을 6개로 한정.


    

설정

트랙백

댓글

  • jin_u 2007.08.05 10:37 ADDR 수정/삭제 답글

    자수야 circle을 많이 만들어서 움직임 보다가 우측에 고정되어있는 circle을 클릭해서 다 아래로 떨어트린후에 좀있다가 갑자기 파폭이 닫히는거야 그래서 다시 실행해서 파폭 섹션을 복구 하겠냐고 해서 하겠다고 하니깐 재부팅 대써... 메모리상에 문제인거 같다. 체크해봐라. ㅡㅡ

    • jasu 2007.08.05 10:58 신고 수정/삭제

      ㅇㅇ..쿠쿠 내 컴이 넘 좋은강..;; 몇개나 만들었길랭...

  • jin_u 2007.08.06 18:30 ADDR 수정/삭제 답글

    circle이 6개밖에 안만들어져서 테스트 못하겠다. 막아논거야?? 퇴근할 시간이다. 퇴근~

    • jasu 2007.08.07 03:04 신고 수정/삭제

      ㅇㅇ 그때 이야기 했을 때 6개로 제한해 놨다. 아무래도 무한하게 생성한다는 것이 좀 찝찝하기도 하고...

  • jin_u 2007.08.07 10:03 ADDR 수정/삭제 답글

    그럼 드레그라도 되게 해놔야 더 탄력적인걸 느끼지~ 그냥 떨어지고 나니깐 끝이네.. 먼가 아쉬움이.. ㅋㅋ

[AS3] SelectRectangleExample

Project/Programming 2007.08.02 11:47
예전에 마리오클링거만이 만들었던 Marching Ants Rectangle을 AS3 버전으로 수정하고 Object select 기능을 추가하여 MouseEvent.MOUSE_DOWN, MouseEvent.MOUSE_MOVE,MouseEvent.MOUSE_UP 이벤트를 통해서 오브젝트를 선택할 수 있도록 만들어 보았다. 윈도우 바탕화면에서 처럼 아이콘들을 선택하고 선택한 아이콘들을 이동하는 기능으로 확장 가능할 것으로 생각된다. 오늘은 여기까지만...;;













    

설정

트랙백

댓글

  • jin_u 2007.08.02 15:44 ADDR 수정/삭제 답글

    오호라~ 잼나네. 옮기는건 언제쯤? ㅋㅋ

    • jasu 2007.08.02 19:45 신고 수정/삭제

      옮길까 말까 생각중이다. 쿠쿠, 하던거 해야겠지...있다가...ㅎㅎ

    • jasu 2007.08.03 09:45 신고 수정/삭제

      아니다 다른거 할란다..쿠쿠 공부삼아 하기에는 불필요한 스펙이 생긴당..쿠쿠

[AS3] Create Number

Project/Programming 2007.07.28 17:34
웹상에서 본 효과가 재미있어서 확장하여 숫자 DisplayObject를 만들어 보았다...

















    

설정

트랙백

댓글

Flickr Searcher 1.8 업로드

Project/Programming 2007.05.13 13:49

사용자 삽입 이미지


사용자 삽입 이미지

사용자 삽입 이미지


Flickr의 Open API를 이용한 사진 검색 어플리케이션 'FlickrSearcher'
version 1.8

http://dicaland.cafe24.com/flickr/FlickrSearcher1_8.swf
====================================================================================================

FlickrSearcher1_8.exe

Version 1.8  Release date : 2007/05/13
Change log
1. photo 썸네일 클릭시에 나타나는 왼쪽 중앙에 있는 information 버튼의 가독성을 위하여 색 변경
2. Search history 기능 추가 : 특정 모드(tags, name, email, nsid)를 통해 검색한 history를 저장할 수 있도록 함.
(최근 검색한 검색어와 페이지 수를 통해서 되돌아 갈 수 있도록 함)
====================================================================================================


    

설정

트랙백

댓글

  • clotho 2007.05.13 22:22 ADDR 수정/삭제 답글

    와~ 멋지네요. +_+ 잘 쓰겠습니닷!!
    사진 저장이 된다면 조금 더 좋을 뻔 했는데.. 차차 버젼업 하시면서 하실듯? ^^

    • jasu 2007.05.14 07:09 신고 수정/삭제

      안녕하세요
      현재 버전(1.8)에서는 썸네일을 클릭후 큰 이미지를 로드할 때 왼쪽 중앙에 보시면 버튼이 나오고 그 버튼을 클릭할 시에는 해당 이미지 정보와 이미지 소유자의 정보가 나타납니다.

      그 정보에 보시면 해당 이미지를 다운로드 할 수 있도록 되어 있습니다. 큰 이미지의 경우는 불러들이지 못할 시에는 중간 이미지로 저장이 됩니다. 이미지 링크 주소로 바로가게 되어 있으니 그곳에 접근하시면 오리지날 이미지(큰 이미지)도 다운로드 할 수 있습니다. 감사합니다.

  • 하얀별 2007.05.14 07:56 신고 ADDR 수정/삭제 답글

    한글 검색어로 검색해도 되는 프로그램인가요!?

    • jasu 2007.05.14 10:01 신고 수정/삭제

      api로 받아올때 한글 테그로는 검색이 제대로 되지 않는 듯 합니다. 나중에 확인 후 가능하면 적용할 예정입니다. 감사합니다. ^^

  • brainchaos 2007.05.18 23:32 신고 ADDR 수정/삭제 답글

    프로그램 잘쓰고 있습니다.
    저의 첫번째 추천 블로그이십니다.^^;
    사진 잘보고 갑니다. 푸근하네요.

    • jasu 2007.05.19 00:03 신고 수정/삭제

      감사합니다. 첫번째 추천 블로그로 등록해 주셨다니 영광이네요...^^ 요즘은 개인적인 일, 회사일 등으로 바쁜 생활을 하다보니 버전업을 하지 못하고 있네요...몇가지 업그레이드 아이디어들이 있는데 시간 되는되로 업데이트 하겠습니다...^^

  • 황지욱 2007.05.19 09:46 ADDR 수정/삭제 답글

    정말 좋은 프로그램이네요^^
    우연히 이 프로그램을 득템해서 외국껀지 알았는데...

    잘쓰겠습니다. 이제 좋은 이미지 찾아 여기 저기 갈필요가 없네요.^^

    • jasu 2007.05.19 12:45 신고 수정/삭제

      감사합니다. 도움이 된다고 하니 기분이 좋네요...^^
      어디서 알게 되셨는지 궁금하네요...
      아무튼 감사합니다. 잘 사용하세요....^^

  • 2007.06.13 05:38 ADDR 수정/삭제 답글

    비밀댓글입니다

    • jasu 2007.06.15 04:22 신고 수정/삭제

      안녕하세요...
      flickr가 KR로 론치되었군요... 제 블로그를 어찌 아시고 오셨는지 모르지만 반갑고 감사합니다. flickr는 기능적인 부분에서는 이미 입증이 된 사이트지만 앞으로 한국 웹의 정서에 맞는 서비스로 보완할 필요가 있을 듯 싶습니다. 한글 테그 관련 사항도 반가운 소식이네요...^^ 아무튼 방문 감사합니다.

  • 정진호 2007.08.07 15:09 ADDR 수정/삭제 답글

    정말 쓰면 쓸수록 마음에 드는 멋진 툴 인것 같습니다.
    좋은 프로그램 만들고 공유해 주셔서 감사합니다. :)

    • jasu 2007.08.08 06:45 신고 수정/삭제

      안녕하세요...^^ 도움이 되신다니 기쁘네요 감사합니다.

  • 최호정 2007.08.09 20:57 ADDR 수정/삭제 답글

    음.. 많이 놀라고 턱빠지고,, 뭐 자멸감이랄까.. 자수님의 프로그램들을 보고 있으면 이런 것들이 떠오릅니다 정말 멋지네요 플래시는 단지 그림만 그리는 툴로만 알고있다가 액션스크립트를 안지 얼마 되지 않았습니다 정말 for, if, while 단순한 조건문 프로그램만 알다가 매소드니 클래스니 머리는 아프지만 자수님 덕분에 좋은 정보 많이 배웠습니다. 특히 이 프로그램은 제 턱길이를 좀더 늘릴만큼 놀랄만하군요.. 감사합니다.

    • jasu 2007.08.09 22:56 신고 수정/삭제

      일발 프로그래밍과 플래시의 다른 점이자 장점이라고 하면 기술보다는 아이디어가 많은 부분을 차지한다는 것이 개인적인 생각입니다. 기술은 하루에 하나씩 익히시는 것이 가장 빠른 방법인거 같구요 아이디어는 많이 보고 많이 생각하시면 될거 같네요 ^^ 크리에이티브적인 작업을 잘 한다는 것은 모방과 창조 사이의 구분을 잘 하는 사람이라고 생각합니다. 많이 보시고 직접 모방해 보시고 그것을 통해 파생되는 자신만의 생각에서 또 다른 창조에 귀기울여 보세요.. 어렵다는 것은 무엇인가를 알기 전에 느끼는 감정일 뿐이니까요...^^ 말씀 감사합니다.

  • jin_u 2007.08.10 14:27 ADDR 수정/삭제 답글

    자수 월? "어렵다는 것은 무엇인가를 알기 전에 느끼는 감정일 뿐이니까요"
    모두다 똑같은 생각을 하고 있나 보군.. ^^

    • jasu 2007.08.10 18:11 신고 수정/삭제

      쿠쿠 알면 보이고 보이면 느낄 수 있는거 아이강 다 비슷하겠지

  • jin_u 2007.08.10 18:29 ADDR 수정/삭제 답글

    '감정일 뿐이니까요' 보다 '공포일 뿐이니까요'가 더 맞는거 아이가? 더 섬뜩하게 -_-a

  • 바보라기★ 2007.08.18 13:51 ADDR 수정/삭제 답글

    정말 유용한 프로그램입니다^^
    정말 잘 쓰고있구요.. 혼자 쓰기 아까워서 그런데..
    링크를 걸거나.. 따로 자료 게시판같은데서 자유롭게 배포해도 되는건지
    여쭤봅니다 ^^

    • jasu 2007.08.18 14:16 신고 수정/삭제

      ^^ 감사합니다. 도움이 되신다니 기쁩니다. 프로그램은 링크를 거셔도 되고 따로 자료실에 올리셔도 됩니다. 자유롭게 이용하세요 ^^

  • ontop 2007.09.03 16:14 신고 ADDR 수정/삭제 답글

    안녕하세요!

    써보니 정말 좋네요~ ^^
    플리커는 요즘들어 가장 자주 가는 곳 중 하나인데~ 이렇게 멋진게 있었네요.. 감사합니다.

    플리커 사진을 좀 쉽게 보기 위해 야후 플리커 위젯을 사용했었는데, 좀 답답한 감이 없지않습니다만... 유용한 기능들이 좀 있습니다.

    - 로그인 -> contacts 사진들 보기, 사진 upload 등이 가능
    - interestingness slide show, tag search 결과 slide show 등...

    혹시 야후위젯 안써보셨다면 참조해보세요.. ^^

    • jasu 2007.09.03 19:05 신고 수정/삭제

      감사합니다. ^^ 야후위젯은 사용안해봤는데 한번 사용해 봐야 겠네요...고맙습니다.

  • binnamoo 2008.01.13 06:33 신고 ADDR 수정/삭제 답글

    플리커 이미지를 자주 검색하기때문에 저한테 상당히 유용한 프로그램이네요. 그런데 플리커에서는 매일 500개의 오늘의 사진 (INTERSTINGNESS) 이 선정이 되는 걸로 알고있습니다. 이 오늘의 사진만 별도로 볼 수 있는 기능은 없을까요? 그냥 INTERSETINGNESS 태그로는 오늘의 사진이 검색되지 않는군요. 부탁드립니다. ^^

    • jasu 2008.01.17 12:53 신고 수정/삭제

      안녕하세요 FlickrSearcher는 as2.0 버전으로 작업이 되었던 터라 다음에 기회가 되면 as3으로 좀더 다양한 형태의 검색프로그램으로 만들어 보도록 하겠습니다. 감사합니다.

    • binnamoo 2008.01.18 02:02 신고 수정/삭제

      그 날을 손꼽아 기다리겠습니다. ^^

  • papapac 2008.01.27 19:14 신고 ADDR 수정/삭제 답글

    디자인과 프로그래밍 두 분야를 조화롭게 다루는 분들을 만나기는 어려운데 대단하네요- 저도 외국 사람이 만든건줄 알았어요. 한가지 아쉬운 점은 CCL저작권 방식에 따라 검색되는 기능이 지원됐더라면 하는 것입니다. 이미지를 디자인 소스로 활용하려면 저작권 방식에 따라 검색하는 점이 매우 중요하다고 생각됩니다. 앞으로도 멋진 업데이트 기대하겠습니다 ^^

    • jasu 2008.01.28 19:14 신고 수정/삭제

      별말씀을요 전 둘다 아직 서툴러서 공부중입니다. 디자인계열이 아니여서 감각이 없네요 눈 동냥 중입니다. ^^;

  • 나그네 2010.01.20 17:41 ADDR 수정/삭제 답글

    컴퓨터 이미지 관리 프로그램을 찾다가 여기까지 왔습니다. 플릭커에서도 자주 검색하는데 좋은 프로그램 같네요. 혹시 컴퓨터 내에 이미지 검색 기능을 추가 하실 생각은 없으신지요...사용자 입장에서 글 적어 봤습니다. 좋은 프로그램 감사합니다.

    • jasu 2010.01.20 20:49 신고 수정/삭제

      안녕하세요 많이 흘러오실 듯 하네요 ^^ 말씀 감사합니다. 파이어폭스의 익스텐션으로 제공되는 tombloo도 좋은 것 같습니다. http://wiki.github.com/to/tombloo/

      그리고 웹상에서 검색한 이미지를 공유하고 정리하고자 하신다면 tumblr 서비스를 활용해 보시는 것도 괜찮을 것 같네요 감사합니다.

  • 나그네그 2010.04.12 23:07 ADDR 수정/삭제 답글

    한국사람이 만든거였군요