다시 한번 시작해보자. 너무 오래 쉬었네..^^

LESSON 10: 액션스크립트 3.0으로 사용자 정의 컴포넌트 만들기

• [판도라HD: 1강, 2강, 3강, 4강, 5강, 6강, 7강, 8강, 9강, 10강, 11강]
• [VimeoHD: 1강, 2강, 3강, 4강, 5강, 6강, 7강, 8강, 9강, 10강, 11강]
  

LESSON 9: 사용자 정의 이벤트 사용하기

• [판도라HD: 1강, 2강, 3강, 4강]
• [VimeoHD: 1강, 2강, 3강, 4강]
  

LESSON 8: 데이터셋을 컨트롤과 Repeater에서 사용하기 

• [판도라HD: 1강, 2강, 3강, 4강, 5강]
• [VimeoHD: 1강, 2강, 3강, 4강, 5강]
  

LESSON 7: MXML로 컴포넌트 만들기

• [판도라HD: 1강, 2강, 3강, 4강, 5강]
• [VimeoHD: 1강, 2강, 3강, 4강, 5강]
  

LESSON 6: 컨트롤에서 리모트 XML 데이터 사용하기

• [판도라HD: 1강, 2강, 3강, 4강, 5강, 6강, 7강]
• [VimeoHD: 1강, 2강, 3강, 4강, 5강, 6강, 7강]
  

LESSON 5: 이벤트 핸들링과 데이터 구조

• [판도라HD: 1강, 2강, 3강, 4강]
• [VimeoHD: 1강, 2강, 3강, 4강]
  

--------------------------------------------------------------------
[Test1.mxml]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
 initialize="init();">
 <mx:Script>
  <![CDATA[
   
   public function init():void
   {
    MyButton.addEventListener(MouseEvent.CLICK, clickHandler);
   }
   
   private function clickHandler(event:MouseEvent):void
   {
    myL.text = "Hello";
   }
   
  ]]>
 </mx:Script>
 
 <mx:Label x="253" y="101" text="Label" id="myL"/>
 <mx:Button x="253" y="139" label="Button" id="MyButton"/>
 <!--<mx:Button x="253" y="139" label="Button" id="MyButton" click="myL.text='okok';"/>-->

 <!-- 속성중에 번개 표시는 이벤트라는것 -->
 
 <!-- 해당 버튼에게 Event을 등록시키는 방법은 addEventListener를 사용한다. 첫번째는 이벤트명, 두번째는 이벤트를 처리하는 function명 -->
 
 <!-- 이벤트 발생 순서 : initialize 이벤트 -> init 이벤트 -> MyButton addEventListener 이벤트 -> Click 이벤트 -->
 
 <!-- 이벤트를 등록하는 3가지 방법
  1. 바로 mxml tag내에  등록하는 방법  <mx:Button click="myL.text='okok'/>
  2. script function을 작성하여 function명을 등록하는 방법 <mx:Button click='clickHandler();'/>
  3. 객체에 addEventListener를 사용하여 등록하는 방법  MyButton.addEventListener(MouseEvent.CLICK, clickHandler);
 -->
 
</mx:Application>

-----------------------------------------------------------------------------------------
[Test2.mxml]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
 creationComplete="addToTextArea('Application');">
 
 <mx:Script>
  <![CDATA[
   
   private function addToTextArea(str:String):void
   {
    ta.text = ta.text + str + "\n";
   }
   
  ]]>
 </mx:Script>
 
 <mx:HBox x="74" y="38" width="163" height="29" creationComplete="addToTextArea('HBox')">
  <mx:Label text="Label" creationComplete="addToTextArea('Label')"/>
  <mx:Button label="Button" creationComplete="addToTextArea('Button')"/>
 </mx:HBox>
 <mx:TextArea x="74" y="102" height="227" width="209" id="ta"/>
 
 <!-- creationComplete 이벤트는 제일 안쪽(child)가 먼저 발생된다. Label -> Button -> HBox -> Application순으로 발생
  creationComplete는 컴퍼넌트가 출력된 후 발생된다.
  1. 배치완료(위치확정후)
  2. 컴포넌트가 출력된후
  3. creationComplete Event 발생-->
 
 <!-- initialize 이벤트는 자식 컴포넌트가 생성완료. 자식의 속성 초기화 완료후 호출된다.
  1. 자식 컴포넌트 생성
  2. 자식의 속성 초기화 완료
  3. initialize Event 발생
  4. 배치완료(위치확정후)
  5. 컴포넌트가 출력된후
  6. creationComplete Event 발생 -->
 
 
</mx:Application>

------------------------------------------------------------------------------------

LESSON 4: 간단한 컨트롤 사용하기

• [판도라HD: 1강, 2강, 3강, 4강, 5강]
• [VimeoHD: 1강, 2강, 3강, 4강, 5강]
  

-------------------------------------------------------------------------------------
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
 creationComplete="lab1.text=caption1;lab2.text=caption2;">

 <mx:Script>
  <![CDATA[
   /// Parse에게 CDATA 밑에 있는것은 해석 하지 말라고 알려 주는것
   
   [Bindable]
   public var caption1:String = "Caption1";
  
   [Bindable]
   public var caption2:String = "Caption2";
   
  ]]>
 </mx:Script>

 <mx:Label id="lab1" x="90" y="61" text="Label1"/>
 <mx:Label id="lab2" x="90" y="87" text="Label2"/> 
 <mx:Button x="90" y="113" label="Button" click="caption1='okok';caption2='nono'"/>
 
 <!--
 mx:Binding 태그는 해당 변수와 해당 레이블에 값을 연결할수 있다.
 구지 해당 값을 변경하지 않아도 mapping이 되어 있기 때문에 변수 값을 바꾸어도 레이블에 값을 변경할수 있다.
 단, 해당 변수의 [Bindable]로 선언 해주어야 된다. 
 -->
 <mx:Binding source="caption1" destination="lab1.text" />
 <mx:Binding source="caption2" destination="lab2.text" />
 
 <!--
 mx:Binding 태그를 사용하지 않아도 직접 선언할수도 있다.
 <mx:Label id="lab1" x="90" y="61" text="{caption}"/>
 중괄호를 사용하여 선언하면 Binding 한다는 의미가 된다.
 -->
  
 
</mx:Application>

------------------------------------------------------------------------------------------------------
[EComm.mxml]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

 <mx:Model id="groceryInventory">
  <groceries>
   <catName>Dairy</catName>
   <prodName>Milk</prodName>
   <imageName>assets/acc.png</imageName>
   <cost>1.20</cost>
   <listPrice>1.99</listPrice>
   <isOrganic>true</isOrganic>
   <isLowFat>true</isLowFat>
   <description>Direct from California where cows are happiest!</description>
  </groceries>
 </mx:Model>

 <mx:states>
  <mx:State name="cartView">
   <mx:SetProperty target="{products}" name="width" value="0"/>
   <mx:SetProperty target="{products}" name="height" value="0"/>
   <mx:SetProperty target="{cartBox}" name="width" value="100%"/>
   <mx:AddChild relativeTo="{cartBox}" position="lastChild">
    <mx:DataGrid id="dgCart" width="100%">
     <mx:columns>
      <mx:DataGridColumn headerText="Column 1" dataField="col1"/>
      <mx:DataGridColumn headerText="Column 2" dataField="col2"/>
      <mx:DataGridColumn headerText="Column 3" dataField="col3"/>
     </mx:columns>
    </mx:DataGrid>
   </mx:AddChild>
   <mx:AddChild relativeTo="{cartBox}" position="lastChild">
    <mx:LinkButton label="Continue Shopping" click="this.currentState=''"/>
   </mx:AddChild>
   <mx:RemoveChild target="{linkbutton1}"/>
  </mx:State>
  
  <mx:State name="expanded">
   <mx:AddChild>
    <mx:VBox x="200" width="100%">
     <mx:Text text="{groceryInventory.description}" width="50%"/>
     <mx:Label text="Certified Organic"/>
     <mx:Label text="Low Fat"/>
    </mx:VBox>   
   </mx:AddChild>
  </mx:State>
 
 </mx:states>
 <mx:ApplicationControlBar dock="true" width="100%" height="90">
  <mx:Canvas width="100%" height="100%">
   <mx:Label x="0" y="0" text="Flex"/>
   <mx:Label x="0" y="41" text="GROCER"/>
   <mx:Button label="View Cart" id="btnViewCart" right="90" y="0"/>
   <mx:Button label="Checkout" id="btnCheckout" right="10" y="0"/>
  </mx:Canvas>
 </mx:ApplicationControlBar>
 <mx:Label text="(c) 2006, FlexGrocer" bottom="10" right="10"/>
 <mx:HBox x="0" y="0" width="100%" height="100%" id="bodyBox">
  <mx:VBox width="100%" height="100%" id="products">
   <mx:Label text="Milk" id="prodName"/>
   <mx:Image source="assets/acc.png" scaleContent="true"
    mouseOver="this.currentState='expanded'" mouseOut="this.currentState=''"/>
   <mx:Label text="$1.99" id="price"/>
   <mx:Button label="Add To Cart" id="add"/>
  </mx:VBox>
  <mx:VBox height="100%" id="cartBox">
   <mx:Label text="Your Cart Total: $"/>
   <mx:LinkButton label="View Cart" click="this.currentState='cartView'" id="linkbutton1"/>
  </mx:VBox>
 </mx:HBox>
 
 <!--
  image 태크 사용시  source를 사용하면 해당 swf에는 같이 포함이 되지 않는다.
  그래서 해당 swf파일 실행시 이미지 다운로드 파일은 따로 다운로드 받는다.
  그런데 swf 컴파일시 해당 이미지를 같이 컴파일 하는 방법도 있다. source에 @Embed('assets/......')로 써주면 된다.
  <mx:Image source="@Embed('assets/acc.png')" />
  하지만 @Embed를 사용하면 해당 이미지에 대한 크기가 swf에 같이 포함이 되기 때문에 swf가 단순 source를 사용할때보다 이미지 파일만큼 커진다.
 -->
 
 
</mx:Application>

LESSON 1: Rich Internet Applications 이해하기

엄진영 님에 기술 나눔터로 링크 변경..

LESSON 1: Rich Internet Applications 이해하기 [판도라HD], [VimeoHD]