반응형
저는 크롬플러스는 주 개발환경으로 사용하고 있는데요...
크롬플러스는 자동으로 업데이트가 돼서 편리하게 사용하고 있었는데...
얼마전에 업데이트가 되면서 디버그용 플래시 플레이어로 실행이 안되는 것이었습니다...
물론 플래시 플레이어 디버거를 설치했구요...

그래서 옵션에 들어가보니... 기본 내장된 플래시 플레이어로 컨텐츠를 표시하더라구여~
그 플러그인을 사용중지를 하니... 다시 잘 됩니다. ~ ^^;

설정하는 방법은 아래와 같습니다.

크롬에서...
크롬 옵션 > 고급설정 > 플러그인 > 개별 플러그인 사용 안함 
위와 같이 선택하면 아래와 같은 페이지가 열리고 아래 그림처럼 사용중지를 해주시면 OK~



그리고 다른 플래시 플레이어 플러그인은 아래처럼 활성화해 놓으면 됩니다.

반응형
반응형
브라우저 정렬시 가로정렬은 문제가 없는데 세로정렬이 문제가 됩니다.
정확하게 세로가운데 정렬을 지원하는 기능이 없기 때문인데요...
지금 알려드리는 소스는 IE6에서도 잘 작동하는 소스입니다.
삽질하며 알아낸 소스라서 다른 더 좋은 방법이 있는지는 모르겠지만 여튼 공유해봅니다.

일단 소스를 보시죠...





SWF Tag

삽입될 swf는 크기가 960 x 720으로 상정했는데요. 
크기가 고정된 swf가 있어야합니다. 그 크기를 기준으로 가운데 정렬시킬 위치를 알아내기 때문입니다.
그리고 swf 태그를 감싸는 <div> 태그가 있고 그걸 또 감싸는 <div> 태그가 있고,
swf 태그 위에 <img> 태그가 있는데요...
IE6 에서는 top 속성을 %로 지정하면 적용되지 않는 버그가 있습니다. 
그래서 img를 하나 두고 img 높이를 50%로 하면 그만큼 swf를 내리기 때문에 가운데 정렬되는 효과가 있습니다.

자~ 이렇게 하면 가운데 정렬되는 <div>를 얻을 수 있습니다. 그 안에 플래시를 삽입하던 다른 어떤걸 삽입하던 하면 되겠죠?

반응형
반응형
마우스를 향하는 화살표 예제입니다. 간단하니 일단 보시죠~


그럼 이제부터 제작 해보겠습니다~
일단 화살표를 그려야겠죠? 아주 간단히 하나 그립니다.
package shape
{
	import flash.display.Sprite;
	
	/**
	 * 화살표 클래스, 오른쪽을 향하는 상태로 그려진다.
	 */
	public class DArrow extends Sprite
	{
		private var m_nWidth:Number;
		private var m_nHeight:Number;
		private var m_uColor:uint;
		
		/**
		 * 생성자
		 * @param p_nWidth 화살표 가로크기(길이)
		 * @param p_nHeight 화살표 세로크기(두께)
		 * @param p_uColor 화살표 색상
		 * @param 
		 */
		public function DArrow( p_nWidth:Number = 50, p_nHeight:Number = 50, p_uColor:uint = 0xffff00  )
		{
			super();
			
			m_nWidth = p_nWidth;
			m_nHeight = p_nHeight;
			m_uColor = p_uColor;
			
			init();
		}
		
		private function init():void
		{
			graphics.clear();
			
			var nWidthHalf:Number = m_nWidth / 2;
			var nHeightHalf:Number = m_nHeight / 2;
			var nHeightQuarter:Number = m_nHeight / 4;
			
			graphics.lineStyle( 1, 0, 1 );
			graphics.beginFill( m_uColor );
			graphics.moveTo( -nWidthHalf , -nHeightQuarter );
			graphics.lineTo( 0, -nHeightQuarter );
			graphics.lineTo( 0, -nHeightHalf );
			graphics.lineTo( nWidthHalf, 0 );
			graphics.lineTo( 0, nHeightHalf );
			graphics.lineTo( 0, nHeightQuarter );
			graphics.lineTo( -nWidthHalf, nHeightQuarter );
			graphics.lineTo( -nWidthHalf, -nHeightQuarter );
			graphics.endFill();
		}
	}
}

이제 위에 만들어진 화살표를 담아서 실행항 메인 클래스를 작성합니다.
package sample.ex_03_trigonometric
{
	import flash.display.Sprite;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	
	import kr.uod.util.CCopyRightPosition;
	import kr.uod.util.FDrawCopyRight;
	import kr.uod.util.FDrawOutLine;
	
	import org.osmf.display.ScaleMode;
	
	import shape.DArrow;
	
	/**
	 * 마우스를 향하는 화살표 예제
	 */
	[SWF(backgroundColor="0xffffff", width="600", height="400", frameRate="30")]
	public class ArrowTowardMouse extends Sprite
	{
		private var m_dArrow:DArrow = new DArrow( 100, 50, 0xff0000 );
		
		public function ArrowTowardMouse()
		{
			super();
			
			stage.scaleMode = StageScaleMode.NO_SCALE;
			 
			init();
		}
		
		private function init():void
		{
			// 스테이지 외곽선 그리기
			FDrawOutLine( this );
			// 카피라이트
			FDrawCopyRight( this, "By LazyArtist" );
			
			// 화살표
			m_dArrow.x = stage.stageWidth / 2;
			m_dArrow.y = stage.stageHeight / 2;
			addChild( m_dArrow );
			
			this.addEventListener( Event.ENTER_FRAME, onEnterFrame );
		}
		
		private function onEnterFrame( e:Event ):void
		{
			var nPosX:int = mouseX - m_dArrow.x;
			var nPosY:int = mouseY - m_dArrow.y;

			// 화살표가 마우스를 향하게 하는 공식
			m_dArrow.rotation = Math.atan2( nPosY, nPosX ) * 180 / Math.PI;
		}
	}
}

여기서 가장 중요한 것은 53라인의 공식입니다. 
Math.atan() 처럼 비율을 파라미터로 전달하면 각도를 반환하는 것이 아니라
Math.atan2()는 y, x 파라미터를 받아서 각도(라디안)를 반환합니다. 플래시 좌표체계에 특화된 함수죠...
Math.atan2()를 사용하실때 주의할점은 Math.atan2( y, x ), 이렇게 y 값을 먼저 넣어준다는 점입니다. 
그렇지 않으면 플래시무비가 이상한 동작을 하게됩니다...

참~ 쉽죠잉~ ^^;

반응형
반응형
글 옮기는 과정에서 코드부분이 날아갔네요...
글 수정하면서 결론만 남깁니다~

코딩을 할 때 가끔 이런 코딩을 합니다.
if( isValid == true){ ... }
isValid가 Boolean 값이라면 "== true" 부분은 써줄 필요는 없지만 가독성을 위해서인데요...

갑자기 if(true)와 if(true == true) 중 어떤게 더 빠를까라는 의문으로 몇가지 좀 해봤는데요~

true 또는 객체를 비교연산하지 않고 그냥 쓰는 것이 가장 빠르게 나왔습니다.
오히려 true == true 연산이 객체를 그냥 써준것 보다 느리네요... 역시 비교연산을 한번 더 하기 때문인 것 같습니다.

그리고 비교연산 중에서는 같은 형끼리의 연산이 다른 형끼리의 연산보다 월등히 빠르게 나왔네요...
obj != null는 형변환이 필요없지만 obj == true는 형변환이 필요하죠...
Boolean(obj) == true는 강제 형변환 후 같은 형끼리 비교연산을 하기 때문에 빠른 것 같은데...
특이한 것은 Boolean(obj)입니다.
당연히 Boolean값이라 true를 써준것과 같지 않을까라고 생각했는데요... 그렇지가 않네요...
정확한 이유는 모르겠으나 Boolean은 원시타입이 아니라 Boolean이라는 객체이기 때문인 것 같습니다.
Boolean(obj) == true연산시에는 obj객체를 Boolean 타입으로 형변환 후 valueOf():Boolean 메서드를 사용해 true와 비교연산하는 것 같고,
Boolean(obj)만 써준 경우는 obj객체를 Boolean 타입으로 형변환 후 toString():String 메서드를 사용하기 때문에 다시 형변환이 필요해서 아닐까 추측해봅니다. ^^;;

결론적으로 다른 형끼리 비교연산을 하지 않는 다면 아무렇게나 써도 속도에 크게 지장을 주지 않는다는 거죠...
5십만번 연산을 해야 10밀리세컨드 정도 차이가 나네요... 하지만 다른 형끼리의 비교연산은 조심해야겠네요... 1초정도 차이가나니까요...

마지막으로 빠른 순서대로 정리해봤어요~ (왼쪽으로 갈수록 빠름니다.)
true <- obj <- true==true, Boolean(obj) == true <- obj != null <- obj == true <- Boolean(obj)



반응형
반응형
# Array
Array.sort(): 간단한 정렬
Array.sortOn(): 배열 요소가 객체일 경우 객체의 속성별로 정렬할 수 있음.
-> 정렬 방식을 지정하는 속성으로 여러 정렬방식을 선택할 수 있음.
 
# {} 객체 이니셜라이저 연산자
지정된 name 및 value 속성 쌍으로 새 객체를 만들거나 초기화합니다. 이 연산자를 사용하면 new Object 구문을 사용하고 대입 연산자를 사용하여 속성 쌍을 채우는 것과 동일한 결과가 됩니다. 새로 만들어진 객체의 프로토타입은 일반적으로 Object 객체로 이름이 지정됩니다.
 
var obj:Object = new Object();
obj.value1 = "a";
obj.value2 = "b";
 
//위의 내용과 동일 한 결과를 간단히 쓸 수 있다.
{value1:"a", value2:"b"} // 객체를 반환한다.
 
? - '이니셜라이저'가 무슨 뜻이지?
 
# for in
객체의 속성이나 배열 요소를 반복 실행
for(var value in Object) { trace(value) }
// 객체와 속성의 개수 만큼 반복실행하며 속성 이름을 value위치에 보내줌.
// 객체의 속성 개수 만큼 반복실행할 명령이 있는 경우 사용.
 
# _scale=0 과 _width=0
둘다 안보이는 것은 마찬가지지만 _scale로 크기를 조절하면 처음 크기를 저장해 놓을 필요가 없다. 상황에 따라 둘중 골라 사용...
 
# attachMovie()
attachMovie() 로 무비 생성하면 처음 좌표는? _x:0, _y:0
attachMovie(Id, name, depth, {속성:값}) // 네번째 매개변수로 객체를 넣으면 그 속성을 복사한다. 따라서 새로운 변수를 넣는것 뿐만이아니라 _x, _y, _xscale... 등등의 속성도 변화 시킬 수 있다.
 
# 플래시 템플릿 사용
자주 사용하는 양식을 '템플릿으로 저장'을 해 놓으면 계속 편리하게 사용할 수 있다.
 
# 배열과 객체
- 객체 내의 속성에 접근할 때는 .연산자를 사용해야 한다.
- 배열에 저장된 객체의 속성에 접근 할 때(다차원 배열과 비슷한 상태)는 .과 [] 둘다 사용가능하다.
- 연관 배열 생성
  - > 객체에서는 속성에 값을 입력하기 위해 .연산자를 이용
  - > 배열은  array["a"] = "a"; 이런식으로 가능함.
  - > 배열도 객체와 같이 생성가능
 
# 항상 this 참조하기
무비클립 첫 프레임에 var owner:MovieClip = this; 이렇게 자신의 참조값을 갖는 변수 설정하고
owner로 사용하면 편리하다.
 
# ?: 조건 연산자
var result = (x == y) ? ex2 : ex3 // x와 y가 같으면 ex2를 반환, 다르면 ex3반환
 
# substr(index, length)
index 위치에서 length만큼의 글자 반환
 
# charCodeAt(index)
index가 지정하는 문자를 나타내는 0에서 65535 사이의 16비트 정수를 반환합니다.
a: 97반환 , 이걸 이용해서 알파벳에서 인덱스 번호를 만들어 활용할 수 있다.
String.charCodeAt(index) - 97 // a==0, b==1 인 인덱스를 만들 수 있다.
반응형

'Flash Story' 카테고리의 다른 글

매일 플래시 액션스크립트 - 9  (0) 2007.08.14
매일 플래시 액션스크립트 - 7  (0) 2007.03.21
매일 플래시 액션스크립트 - 6  (0) 2007.03.20
반응형
# 이벤트 리스너 등록시 함수의 매개변수는 어떻게 사용하는가?
레퍼런스에 보면 이벤트 리스너 등록해야 하는 이벤트에 매개변수가 적혀있다. 그 매개변수는 사용자 함수와 다르게 이벤트가 발생하면 그에 따라 자동으로 전달 되는 매개변수로 그 매개변수의 위치에 이름을 적고 그 이름으로 활용하면 된다.
=> 이벤트 이스너의 파라미터는 내가 전달하는 것이 아니라 주어진 값을 사용하는 것이다.
 
# 이벤트 리스너 사용방법
1. 브로드캐스터 객체가 생성할 이벤트의 이름과 동일한 속성 이름을 가진 리스너 객체를 생성합니다.
2. 해당 이벤트에 응답하는 이벤트 리스너에 함수를 지정합니다
3. 이벤트를 발생시키는 객체에 addListener() 메서드를 호출하고 이 객체에 리스너 객체의 이름을 전달합니다.
=> 이벤트를 발생시키는 객체가 브로드캐스터 객체 이여야 한다.
 
# 브로드캐스터 객체는 어떤 것들이 있나?
이벤트 리스너를 이용할 수 있는 ActionScript 클래스의 객체로는
Key, Mouse, MovieClipLoader, Selection, TextField 및 Stage
 
# 각 브로드캐스터 객체의 이벤트들...
< Key >
onKeyDown = function() {} //키가 눌러지면 알려 줍니다.
onKeyUp = function() {} //마우스에서 키가 놓여질 때 알려 줍니다.
 
< Mouse >
onMouseDown = function() {} //마우스를 누를 때 알려 줍니다.
onMouseMove = function() {} //마우스를 이동할 때 알려 줍니다.
onMouseUp = function() {}  //마우스 버튼을 놓을 때 알려 줍니다.
onMouseWheel = function([delta:Number], [scrollTarget:String]) {} //사용자가 마우스 휠을 굴릴 때 알려 줍니다.
 
< MovieClipLoader >
onLoadComplete = function([target_mc:MovieClip], [httpStatus:Number]) {}
// MovieClipLoader.loadClip()을 사용하여 로드된 파일이 완전히 다운로드될 때 호출됩니다.
 
onLoadError = function(target_mc:MovieClip, errorCode:String, [httpStatus:Number]) {}
// MovieClipLoader.loadClip()을 사용하여 로드한 파일의 로드 작업이 실패했을 때 호출됩니다.
 
onLoadInit = function([target_mc:MovieClip]) {}
// 로드된 클립의 첫 번째 프레임에서 액션이 실행되었을 때 호출됩니다.
 
onLoadProgress = function([target_mc:MovieClip], loadedBytes:Number, totalBytes:Number) {}
// 로드 과정(즉, MovieClipLoader.onLoadStartMovieClipLoader.onLoadComplete 사이)에서 로드하는 내용이 하드 디스크에 기록될 때마다 호출됩니다.
 
onLoadStart = function([target_mc:MovieClip]) {}
// MovieClipLoader.loadClip()을 호출하여 파일의 다운로드가 시작될 때 호출됩니다.
 
< Selection >
onSetFocus = function([oldfocus:Object], [newfocus:Object]) {} // 입력 포커스가 변경될 때 알립니다.
 
< Textfield >
onChanged = function(changedField:TextField) {}
// 이벤트 핸들러/리스너; 텍스트 필드의 내용이 변경될 때 호출됩니다.
 
onKillFocus = function(newFocus:Object) {}
// 텍스트 필드에서 키보드 포커스를 잃을 때 호출됩니다.
 
onScroller = function(scrolledField:TextField) {}
// 이벤트 핸들러/리스너; 텍스트 필드 스크롤 속성 중 하나가 변경될 때 호출됩니다.
 
onSetFocus = function(oldFocus:Object) {}
// 텍스트 필드가 키보드 포커스를 받을 때 호출됩니다.
 
< Stage >
onResize = function() {}
// Stage.scaleMode가 noScale로 설정되어 있고 SWF 파일의 크기가 조절될 때 호출됩니다.
 
# 이벤트 리스너에서 경로는?
함수로 기술되기 때문에 작성한 곳이 기준이 된다.
작성한 곳에 있는 변수들은 바로 접근이 가능하고 이벤트 리스너 함수내에서 this를 호출하면 이벤트가 등록된 객체를 참조한다. 이벤트를 발생시키는(브로드캐스터 객체)가 아니다!!!
 
# 텍스트 박스내의 텍스트로의 접근
이제 더이상 변수이름으로 접근하는 방식은 잊어버리자.
텍스트 필드에 인스턴스 이름을 정해주고 .text라는 속성으로 접근하자
예) text_txt.text = "변경";
 
# 코드 힌트 표시
var a:Object 등으로 데이터 유형을 지정하면 다음에 a.을 사용하면 :Object에 맞는 매서드와 속성이 힌트로 표시된다.
var a:Object 이런 식으로 작성을 해야 다음에 a만 써도 힌트가 나온다.
a = new Object() 이런 식은 나오지 않는다. 반드시 var와 데이터유형을 지정해야 한다.
인스턴스명의 접미사는 데이터 지정없이 바로 힌트가 표시된다.
 
# Math.round
가장 가까운 정수를 올리거나 내려줌.
반응형

'Flash Story' 카테고리의 다른 글

매일 플래시 액션스크립트 - 8  (0) 2007.03.22
매일 플래시 액션스크립트 - 6  (0) 2007.03.20
매일 플래시 액션스크립트 - 5  (0) 2007.03.19
반응형
# 버튼화된 무비클립의 히트영역
-> 무비클립안에 있는 텍스트 상자에 따른 히트영역
  1. 텍스트 상자가 정적텍스트일 경우: 글자의 외곽선 기준으로 히트영역 설정 됨
  2. 텍스트 상자가 동적텍스트일 경우: 텍스트 상자 자체가 히트영역이 됨.
  3. 텍스트 상자가 입력텍스트일 경우: 상동.
  4. 무비클립안에 알파값 0인 상자있을 경우: 상자 영역만큼 히트영역 설정
      (단, _visible=false 이면 설정영역 없어짐.)
 
-> 히트영역이 무비클립의 좌표에 영향을 미치는가?
  : 무비클립의 좌표는 해당 무비클립의 기준점을 기준으로 설정되기에 히트영역이 좌표에 영향을 미치는지는 관계없다.
 
# (수학) 단위변경 방법
- 목표단위를 곱할때는 처음단위의 최소단위를 곱해준다.
- 양변의 단위를 통일한다.(단위를 곱하고 나눠서 통일한다.)
- 단위는 숫자에 기호숫자(단위)를 곱해준 형식이다.
- 단위 사이의 법칙(비율)을 알면 단위를 통일 할 수 있다.
 
# (수학) 호도법(radian)과 60분법(degree)의 관계
- 180˚ = Math.PI * radian
- 1radian = 180˚ / Math.PI
- 1˚ = Math.PI * radian / 180˚
- degree를 radian으로 나타낼 때는 Math.PI를 x˚의 180에 대한 비율을 곱하면 구할 수 있다.
- 그 반대의 경우 radian에 180/Math.PI(PI에 대한 180의 비율)을 곱하면 된다.

# (수학) 두 점사이의 거리 구하기
- Math.sqrt( (x2-x1) * (y2-y1) )
 
# (용어) 프로지저(procedure)
- 함수와 같지만 return 값을 반환하지 않는 것.
 
1. 프로그래밍에서, 프로시저는 루틴이나, 서브루틴 및 함수와 같은 뜻이다. 하나의 프로시저는 특정 작업을 수행하기 위한 프로그램의 일부이다.
2. 일반적인 의미의 프로시저란, 어떤 행동을 수행하기 위한 일련의 작업 순서를 말한다.
 
# (용어) Win32 API
Win32 API란 32bit 윈도우 운영체제 내에서 동작 가능한 프로그램을 개발하기 위해 기본적으로 제공되는 함수의 구조체, 타입 등의 집합을 의미합니다. 따라서, 어떠한 프로그램을 만든다는 의미는 곧 API내의 특정 함수, 타입을 이용하여 코딩을 하는 행위로 생각해 볼 수 있습니다.
 
# (용어) MFC
MFC(Microsoft Foundation Class)는 윈도우 어플리케이션을 생성하기 위해 만들어진 C++ 클래스 라이브러리입니다.
프로그램 개발 시간을 크게 단축시켜 줌으로써 기존의 Win32 API를 이용한 프로그램 제작시 개발자 스스로가 도맡아 해오던 수많은 실행 함수에 대한 코딩의 번거로움을 개선
반응형

'Flash Story' 카테고리의 다른 글

매일 플래시 액션스크립트 - 7  (0) 2007.03.21
매일 플래시 액션스크립트 - 5  (0) 2007.03.19
매일 플래시 액션스크립트 - 4  (0) 2007.03.18
반응형
# (용어) 코드 템플렛
코드를 간단하게 입력할 수 있는 단축키 같은 것. 보통 텍스트 에디터인 울트라 에디트나 에디트 플러스 등에서 코딩을 쉽게 하기 위해 지원한다.

# (HTML) <input>버튼으로 페이지 이동하기
<input type="button" value= "button"onClick="location.href= 'http://www.naver.com'">

# (용어) 패키지
플래시에서 제공하는 클래스 모음. 여러가지 효과들이 있다.

# 이벤트
이벤트는 컴퓨터 내부적으로 일어나는 사건 및 사용자의 반응(행동)에 따라 일어나는 사건을 말한다. 시간이 흘러간다, 마우스로 클릭했다, 마우스 이동했다, 키보드를 눌렀다. 무엇을 변경시켰다 등등을 이벤트라고 한다.

# 이벤트 핸들러
이벤트가 일어났을 때 지정된 행동(프로그램 코드)을 수행하도록 해당 이벤트에 행동을 지정하는 것이 이벤트 핸들러다.

# 이벤트와 리스너
이벤트 핸들러는 각 객체마다 이미 이벤트가 정해져 있고 그에 따른 행동을 개발자가 지정하는 방식인 반면 이벤트 리스너 방식은 객체에 직접 이벤트와 그 이벤트에 따른 행동을 지정하는 방식이다. 이벤트 리스너가 최근방식이고 동적인 이벤트 핸들러의 추가 및 같은 이벤트에 여러 행도을 지정할 수 있다. 빨리 익숙해져야 겠다.

-> 사용방법
1. 이벤트를 받을 객체를 생성하고
2. 객체에 이벤트와 그에 따라 실행될 함수를 콜백함수 형식으로 작성한다.
3. 이벤트가 일어나는 객체에 addListener로 등록한다.
반응형

'Flash Story' 카테고리의 다른 글

매일 플래시 액션스크립트 - 6  (0) 2007.03.20
매일 플래시 액션스크립트 - 4  (0) 2007.03.18
매일 플래시 액션스크립트 - 3  (0) 2007.03.17

+ Recent posts