UDN
Search public documentation:
CLIKMultiColListKR
English Translation
日本語訳
中国翻译
Interested in the Unreal Engine?
Visit the Unreal Technology site.
Looking for jobs and company info?
Check out the Epic games site.
Questions about support via UDN?
Contact the UDN Staff
日本語訳
中国翻译
Interested in the Unreal Engine?
Visit the Unreal Technology site.
Looking for jobs and company info?
Check out the Epic games site.
Questions about support via UDN?
Contact the UDN Staff
열이 여럿인 목록 만드는 법
문서 변경내역: James Tan 작성. 홍성진 번역.
개요
ScrollingList 컴포넌트는 디폴트로 ListItemRenderer 를 사용하여 줄 콘텐츠를 표시합니다. 그러나 ListItemRenderer 는 textField 를 하나만 지원합니다. 그러나 목록 항목에는 표시할 textField 가 둘 이상인 경우도, 심지어 아이콘처럼 textField 리소스가 아닌 경우도 많이 있습니다. 이 예제에서는 목록 항목에 textField 를 둘 추가하는 법을 선보이겠습니다.
ActionScript
우선 필요조건부터 따져 봅시다. 목표는 textField 를 둘 지원하는 커스텀 ListItemRender 를 만드는 것이겠죠. 이 커스텀 ListItemRenderer 는 ScrollingList 와도 호환되어야 하겠습니다. 목록 항목별로 textField 가 두 개 있도록 할 계획이기에, 데이터는 string 하나로 된 목록 이상이 되어야 할 것입니다. 이 예제에는 다음 dataProvider 를 사용하도록 합시다:
list.dataProvider = [{fname: "Michael", lname: "Jordan"}, {fname: "Roger", lname: "Federer"}, {fname: "Michael", lname: "Schumacher"}, {fname: "Tiger", lname: "Woods"}, {fname: "Babe", lname: "Ruth"}, {fname: "Wayne", lname: "Gretzky"}, {fname: "Usain", lname: "Bolt"}];
import gfx.controls.ListItemRenderer; class gfx.controls.MyItemRenderer extends ListItemRenderer { public var textField1:TextField; public var textField2:TextField; public function MyItemRenderer() { super(); } public function setData(data:Object):Void { this.data = data; textField1.text = data ? data.fname : ""; textField2.text = data ? data.lname : ""; } private function updateAfterStateChange():Void { textField1.text = data ? data.fname : ""; textField2.text = data ? data.lname : ""; } }
플래시 변경
지금까지 복잡한 목록 항목을 가진 dataProvider 와, 그 목록 항목 렌더링을 지원하는 ListItemRenderer 클래스를 정의했습니다. 이 모두에 목록 성분을 연결해 주기 위해서는, 심볼을 만들어야 이 새로운 ListItemRenderer 클래스를 지원할 수 있습니다. 이 예제에서 그런 작업을 가장 빨리 이뤄낼 수 있는 방법은, 미리 빌드된 ListItemRenderer 심볼(C:\UDK\UDK-2010-12\Development\Flash\CLIK\components\ListItemRenderer.fla)이, 인스턴스 이름 'textField1' 과 'textField2' 로 textField 둘을 갖도록 변경하는 것입니다. 다음으로 이 심볼의 식별자와 클래스는 라이브러리에서 MyItemRenderer 로 변경해 줘야 합니다.
- 라이브러리에서 ListItemRenderer 에 우클릭한 후 Properties 를 선택합니다.
- Name 을 MyItemRenderer 로 바꿉니다.
- Identifier 를 MyItemRenderer 로 바꿉니다.
- Class 를 gfx.controls.MyItemRenderer 로 바꿉니다.
- OK 를 누릅니다.
- ListItemRenderer 에 다시 우클릭한 후 Component Definition 를 선택합니다.
- Class 를 gfx.controls.MyItemRenderer 로 바꿉니다.
- 심볼을 리스트가 들어있는 플래시 파일 라이브러리 속에 복사해 넣습니다.
새로 만든 열이 여럿인 목록 사용하기
목록을 가지고 MyItemRenderer 성분을 사용하려면, 목록 사본 역시 라이브러리에 존재해야 합니다. 목록 인스턴스의 itemRenderer inspectable 프로퍼티를 'MyItemRenderer' 로 바꿉니다. (CS4 의 Component Inspector 창이나 CS5 의 Component Parameters 롤아웃을 통해서요.) 이제 FLA 를 실행합니다. 목록에 dataProvider 에서 설정했던 프로퍼티 fname 과 lname, 그렇게 라벨이 둘 표시되는 것이 보일 것입니다.