UILoader 구성 요소는 SWF, JPEG, 점진적 JPEG, PNG 및 GIF 파일을 표시할 수 있는 컨테이너입니다. 원격 위치에서 내용을 가져와 Flash 응용 프로그램에 보내야 할 때마다 UILoader를 사용할 수 있습니다. 예를 들어, UILoader를 사용하여 회사 로고(JPEG 파일)를 양식에 추가할 수 있습니다. 또한 사진을 표시하는 응용 프로그램에서 UILoader 구성 요소를 사용할 수 있습니다.
load()
메서드를 사용하여 내용을 로드하고,
percentLoaded
속성을 사용하여 로드된 내용의 양을 확인하고,
complete
이벤트를 사용하여 로드가 완료된 시점을 확인할 수 있습니다.
UILoader의 내용 크기를 조절하거나 UILoader 자체의 크기를 조절하여 내용의 크기에 맞출 수 있습니다. 기본적으로 내용의 크기는 UILoader에 맞게 조절됩니다. 런타임에 내용을 로드할 수 있고 로드 진행률을 모니터링할 수도 있습니다. 그러나 내용을 한 번 로드하면 해당 내용이 캐시되기 때문에 진행률이 신속하게 100%에 도달합니다. UILoader에 내용을 로드할 때 위치를 지정하려면 0, 0(X 및 Y 좌표)과 같은 형태로 위치를 지정해야 합니다.
UILoader 구성 요소와 사용자의 상호 작용
UILoader 구성 요소 매개 변수
속성 관리자나 구성 요소 관리자에서 각 UILoader 구성 요소 인스턴스에 대해
autoLoad
,
maintainAspectRatio
,
source
,
scaleContent
등의 제작 매개 변수를 설정할 수 있습니다. 이러한 매개 변수에는 각각 같은 이름의 해당 ActionScript 속성이 있습니다.
각 UILoader 인스턴스의 실시간 미리 보기에는 제작하는 동안 속성 관리자나 [구성 요소 관리자]에서 변경한 매개 변수가 반영됩니다.
메서드, 속성 및 이벤트를 사용하여 UILoader 인스턴스에 대한 추가 옵션을 설정하도록 ActionScript를 작성할 수 있습니다. 자세한 내용은
ActionScript 3.0 Reference
for Flash Professional
에서 UILoader 클래스를 참조하십시오.
UILoader 구성 요소를 사용하여 응용 프로그램 만들기
다음 절차에서는 응용 프로그램을 제작하는 동안 UILoader 구성 요소를 추가하는 방법을 설명합니다. 이 예제에서 로더는 로고 GIF 이미지를 로드합니다.
-
새 Flash(ActionScript 3.0) 문서를 만듭니다.
-
[구성 요소] 패널의 UILoader 구성 요소를 스테이지로 드래그합니다.
-
속성 관리자에서 인스턴스 이름으로
aUI
를 입력합니다.
-
스테이지에서 로더를 선택하고 [구성 요소 관리자]에서
source
매개 변수 값으로
http://www.helpexamples.com/images/logo.gif
를 입력합니다.
ActionScript를 사용하여 UILoader 구성 요소 인스턴스 만들기
다음 예제에서는 ActionScript를 사용하여 UILoader 구성 요소를 만들고 꽃 이미지(JPEG)를 로드합니다. 또한
complete
이벤트가 발생하면 [출력] 패널에 로드된 바이트 수를 표시합니다.
-
새 Flash(ActionScript 3.0) 문서를 만듭니다.
-
[구성 요소] 패널의 UILoader 구성 요소를 [라이브러리] 패널로 드래그합니다.
-
[액션] 패널을 열고 기본 타임라인에서 프레임 1을 선택한 후 다음 ActionScript 코드를 입력합니다.
import fl.containers.UILoader;
var aLoader:UILoader = new UILoader();
aLoader.source = "http://www.flash-mx.com/images/image1.jpg";
aLoader.scaleContent = false;
addChild(aLoader);
aLoader.addEventListener(Event.COMPLETE, completeHandler);
function completeHandler(event:Event) {
trace("Number of bytes loaded: " + aLoader.bytesLoaded);
}
-
[컨트롤] > [무비 테스트]를 선택합니다.
|
|
|