과정
1.SWC 파일을 만들어 FLEX로 불러들인다.
2.WeatherWidget 클라스를 만든다.
3.WeatherWidgetTest를 만든다.
FLASH를 열어 사각형을 그리고 F8을 눌러 무비클립으로 만든다.
심볼 이름을 WeatehrWidgetClip으로 정하고 하단의 Export for ActionScript를 check 한 후 저장.
무비클립을 더블클릭하여 무비클립 안으로 들어가서
기존의 레이어는 bg로 이름을 변경. 새로운 레이어를 추가하여 main이라고 이름을 넣는다.
stage로 돌아가서 component 박스를 열어 ComboBox를 드레그하여 stage에 놓는다.
Stastic text로 각각 도시,온도,습도,풍속,압력이라고 네이밍하고 도시를 제외한 박스 옆에 Dynamic Text를 배치한다.
한쪽에 사각형을 만든 후 무비클립으로 만든다.
새로 만든 screen을 더블클릭하여 무비클립 안으로 들어가서
해당 그래픽을 삭제한다.
다시 WeatherWidgetClip으로 빠져나온 상태
library창을 열어 WeatherWidgetClip이 Linkage 상태를 확인한 후 (무비클립 생성시 Export as Actionscript 선택이 되어야만
Linkage가 됨)
WeatherWidgetClip를 선택하고 오른쪽 마우스를 클릭하여 하단의 Export SWC File로 저장함
저장할 이름을 넣고 목적 프로젝트의 libs 폴더에 저장한다.
저장 후 Flex로 돌아가서 해당 프로젝트의 libs 폴더를 보면 방금 저장했던 WeatherWidgetClip가 있음을 확인 할 수 있다.
libs 폴더는 property에서 연결설정을 해주어야 하는데 그 사항은 chapter 6을 참고하기 바람
Package:timo.widget Superclass:Sprite
package timo.widget
{
import flash.display.Sprite;
public class WeatherWidget extends Sprite
{
private var clip:WeatherWidgetClip= new WeatherWidgetClip();
public function WeatherWidget()
{
super();
this.addChild(this.clip)
var obj0:Object=new Object();
obj0.label="서울"
obj0.data="KSXX0037"
this.clip.city_cbo.addItem(obj0);
var obj1:Object=new Object();
obj1.label="제주"
obj1.data="KSXX0004"
this.clip.city_cbo.addItem(obj1);
}
}
}
Superclass: Sprite
package
{
import flash.display.Sprite;
import timo.widget.WeatherWidget;
[SWF(widthe="500", height="400", frameRate="36", background="0X23EEEE")]
public class WeatherWidgetTest extends Sprite
{
public function WeatherWidgetTest()
{
super();
var weatherWidget:WeatherWidget=new WeatherWidget();
this.addChild(weatherWidget);
}
}
}
콤보박스에 서울과 제주가 첨가되었다.
첫번째 WeatherWidget Class를 Arrey를 이용하여 수정/재구성한다.
package timo.widget
{
import com.yahoo.webapis.weather.WeatherService;
import com.yahoo.webapis.weather.events.WeatherResultEvent;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.Event;
import flash.net.URLRequest;
public class WeatherWiget extends Sprite
{
// UI와 코딩이 결함된 클래스
//UI
private var clip:WeatherWidgetClip=new WeatherWidgetClip;
private var loader:Loader=new Loader();
// 도시정보
private var arrCity:Array=["서울","제주","부산","대전"]
private var arrCode:Array=["KSXX0037","KSXX0004","KsXX0050","KSXX0027"]
// 생성자에서 할 일... 1. UI 구성, 2. 이벤트 설정
public function WeatherWiget()
{
super();
this.addChild(this.clip)
this.clip.screen.addChild(loader);
for(var i:int=0;i <this.arrCity.length;i++)
{
var obj:Object=new Object();
obj.label=this.arrCity[i];
obj.data=this.arrCode[i];
this.clip.City.addItem(obj); //데이터와 라벨을 합쳐서 아이템이라고 부른다.
}//for
this.clip.City.addEventListener(Event.CHANGE, onChange); //바뀔 때마다 변화가 일어나게 하는 것
}//weatherWiget
private function onChange(e:Event):void
{
//trace("콤보박스 선택....!!!")
trace(this.clip.City.selectedItem.label,this.clip.City.selectedItem.data); //바뀐 내용을 알 수 있도록 선택되도록 한다.
//데이터와 라벨을 합쳐서 아이템이라 하므로 셀렉티드아이템을 선택하는 것이다.
var weather:WeatherService= new WeatherService();
weather.addEventListener(WeatherResultEvent.WEATHER_LOADED, onComplete);
weather.getWeather(this.clip.City.selectedItem.data,"c");
}
private function onComplete(e:WeatherResultEvent):void
{
this.clip.humi_txt.text=e.weather.current.atmosphere.humidity+"%";
this.clip.press_txt.text=e.weather.current.atmosphere.pressure+"mb";
this.clip.tem_txt.text=e.weather.current.temperature+"c";
this.clip.sind_txt.text=e.weather.current.wind.speed+"m/s"
//받은 이미지 링크 정보로 부터 이미지 호출
this.loader.load(new URLRequest(e.weather.current.imageURL));
//this.loader.load(new URLRequest(e.weather.current.imageURL));
//e.weather.current.imageURL
//e.weather.forecast
}
}//class
}//package
WeatherWidget 클라스 중간에 초기 화면에도 정보가 뜰 수 있도록 코드를 더해준다 (붉은색 표시)
package timo.widget
{
import com.yahoo.webapis.weather.WeatherService;
import com.yahoo.webapis.weather.events.WeatherResultEvent;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.Event;
import flash.net.URLRequest;
public class WeatherWidget extends Sprite
{
// UI와 코딩이 결함된 클래스
// ui
private var clip: WeatherWidgetClip = new WeatherWidgetClip();
private var loader: Loader = new Loader();
// 도시정보
private var arrCity: Array = [ "서울", "제주", "부산", "대전" ];
private var arrCode:Array = [ "KSXX0037", "KSXX0004", "KSXX0050", "KSXX0027" ];
// 생성자에서 할 일... 1. UI 구성, 2. 이벤트 설정
public function WeatherWiget()
{
super();
this.addChild(this.clip);
this.clip.screen_mc.addChild(loader);
for(var i:int=0; i<this.arrCity.length;i++)
{
var obj:Object=new Object();
obj.label=this.arrCity[i];
obj.data=this.arrCode[i];
this.clip.city_cbo.addItem(obj);
}//for
//강제로 이벤트를 발생시키는 코드(붉은색)가 첨가되지 않았을 때는 default로 서울이 선택되고 어떤 정보도 나오지 않았다.
//처음 선택된 도시의 정보도 보여주도록 하기 위해 최초로 호출되는 배열을 2번으로 하고 그 변화를 호츨 하도록 디스페치이벤트를 사용한다.
//city_cbo가 CHANGE 이벤트를 듣고 있으므로 강제로 dispatchEvent를 써주는 것임
//함수로 처리하는 또다른 방법이 있 디스페치를 쓰는 것이 더 세련됨
this.clip.city_cbo.addEventListener(Event.CHANGE, onChange);
this.clip.city_cbo.selectedIndex=2;
this.clip.city_cbo.dispatchEvent(new Event(Event.CHANGE));
}
private function onChange(e:Event):void
{
trace(this.clip.city_cbo.selectedItem.label,this.clip.city_cbo.selectedItem.data);
var weather:WeatherService=new WeatherService();
weather.addEventListener(WeatherResultEvent.WEATHER_LOADED, onComplete);
weather.getWeather(this.clip.city_cbo.selectedItem.data,"c");
}
private function onComplete(e:WeatherResultEvent):void
{
this.clip.humid_txt.text=e.weather.current.atmosphere.humidity+"%%%%%";
this.clip.pressure_txt.text=e.weather.current.atmosphere.pressure+"mb";
this.clip.temp_txt.text=e.weather.current.temperature+"c";
this.clip.wind_txt.text=e.weather.current.wind.speed+"m/s"
//받은 이미지 링크 정보로 부터 이미지 호출
this.loader.load(new URLRequest(e.weather.current.imageURL));
}
}//class
}//package
2번 배열에 해당하는 부산이 초기에 뜨고 관련 정보가 릴리즈된다. (텍스트 색은 swc파일을 변경한 것임..무시하길 바람)
기능별로 함수로 정리하기(붉은색 부분)
package timo.widget
{
import com.yahoo.webapis.weather.WeatherService;
import com.yahoo.webapis.weather.events.WeatherResultEvent;
import flash.display.Loader;
import flash.display.Sprite;
import flash.events.Event;
import flash.net.URLRequest;
public class WeatherWidget extends Sprite
{
// UI와 코딩이 결함된 클래스
// ui
private var clip: WeatherWidgetClip = new WeatherWidgetClip();
private var loader: Loader = new Loader();
// 도시정보
private var arrCity: Array = [ "서울", "제주", "부산", "대전" ];
private var arrCode:Array = [ "KSXX0037", "KSXX0004", "KSXX0050", "KSXX0027" ];
// 생성자에서 할 일... 1. UI 구성, 2. 이벤트 설정
public function WeatherWidget()
{
super();
this.setLayout();
this.addEvents();
this.defaultsetting();
}// WeatherWidget
private function setLayout():void
{
this.addChild(this.clip);
this.clip.screen_mc.addChild(loader);
}
private function addEvents():void
{
this.clip.city_cbo.addEventListener(Event.CHANGE, onChange);
}
private function defaultsetting():void
{
for(var i:int=0; i<this.arrCity.length; i++)
{
var obj:Object=new Object();
obj.label =this.arrCity[i];
obj.data =this.arrCode[i];
this.clip.city_cbo.addItem(obj);
}// for
this.clip.city_cbo.selectedIndex=2;
// 강제로 CHANGE 이벤트 발생...
this.clip.city_cbo.dispatchEvent(new Event(Event.CHANGE));
// onChange( new Event( Event.CHANGE ) );
}
private function onChange(e:Event):void
{
// trace( this.clip.city_cbo.selectedItem.label, this.clip.city_cbo.selectedItem.data );
var weather:WeatherService= new WeatherService();
weather.addEventListener(WeatherResultEvent.WEATHER_LOADED, onComplete);
weather.getWeather(this.clip.city_cbo.selectedItem.data,"c");
}
private function onComplete( e: WeatherResultEvent ): void
{
this.clip.humid_txt.text = e.weather.current.atmosphere.humidity + "%%%%%";
this.clip.pressure_txt.text = e.weather.current.atmosphere.pressure + " mb";
this.clip.temp_txt.text = e.weather.current.temperature + " C";
this.clip.wind_txt.text = e.weather.current.wind.speed + " m/s";
// 받은 이미지 링크정보로 부터 이미지 호출
this.loader.load( new URLRequest( e.weather.current.imageURL ) );
}
}//class
}//package