우선 6장까지 따라해봤습니다.
내용은......매우 그레이트합니다!!!
놀랍습니다 ^^

이 실전 트레이닝 북을 6장까지 따라한 결과 이 책에 나온 내용 대로 그대로 코딩을 하면서 플렉스의 기능들을 익히는 방식으로 진행합니다. 그래서 어떤 식료품 구매 사이트를 만드는 것 같은데, 아직 좀 더 해봐야할 듯 합니다.
오직 6장까지 따라했을 뿐인데, 제가 모르는 내용이 수두룩 했습니다 ㅠ
사용자 삽입 이미지

이런 기능이 있었구나 하는 부분이 매우 많았고, 디자인모드에서 state가 편집이 가능한지도 몰랐습니다 ㅠ
이런 손쉬운 방법으로 state를 편집하는 기능을 알게 되어서 매우 기쁩니다 ㅠ

XML 컨트롤 하는 부분이 세세한 부분까지 잘 나와있으며, 많은 사람들이 헷깔려하는 ArrayCollection에 대해서도 많은 예제와 설명으로 이해를 쉽게 도왔습니다.

그리고 이 책의 번역이 이상하다고 하는 사람들이 많은데, 물론 번역이 잘 되어야 책의 원문의 내용을 살리겠지만, 이 책의 내용은 번역이 좀 어색하긴 하지만 의미전달의 미스가 있는 부분은 많지 않았습니다. 물론, 아직 책을 끝까지 읽지는 않았습니다만, 6장까지 읽으면서 이해는 잘 되었습니다. 하지만, 영어 독해능력이 뛰어나신 분들은 원서를 권해드립니다.
사용자 삽입 이미지

문제의 그부분? 스티커로 처리해놨네요^^


번역은 외국 정서에 맞게 사용한 언어를 한국 정서에 맞게 의역을 해야하는 작업입니다. 그래서 그 의역이 참 힘들기 때문에 번역을 하면서 어색한 부분이 많고 그런 것 같습니다. 대부분의 원서가 그런 책이 좀 많았습니다. 예전에 켄트백의 구현패턴이라는 책도 매우 훌륭한 책이라고 하는데, 번역이 좀 이상한 관계로 매우 읽기 힘들었던 책이였습니다. 이런 이론위주의 책이라면 정확한 번역이 필요로 했겠지만, 지금 이 플렉스3 실전 트레이닝북은 거의 대부분이 실습인 책입니다. 책 내용도 그냥 여기다가 이렇게 코딩하라 이런 말이 거의 대부분이고, 중간중간 설명이 좀 있기는 하지만 이해할 수 있는 수준이었습니다 ^^

그래서 구입을 좀 꺼려하시는 분은 안심하고 구매하셔도 좋습니다 ^^ 그 위키북스에서도 잘못된 내용을 검토하여 재판을 내놓을 생각이 있는 듯합니다. 지금 구매하시는 게 좀 그러시면 그 때 구입하셔도 될 듯 합니다.

PS. 전 절대....위키북스 알바가 아닙니다-_-; 책을 선물로 받았을 뿐?-_-;
사용자 삽입 이미지

감사합니다 ^^

사용자 삽입 이미지

채....책이....OTL...벌써 이렇게 찢어졌어요 ㅠ 너무 열심히 공부해서(설마-_-;)



 
Posted by 머드초보
,
 
이건뭐....프레임워크를 왜 쓴거지-_-;
소스코드만 더 길어졌네.
어쨌든 저의 삽질의 결정체를 공개할랍니다-_-; 나름 열심히 만든거라...ㅠㅠ
보시면 이것저것 신경을 많이 쓴걸(?) 볼 수 있을겁니다-_-;
타이머의 zerofill...-_-;
이걸 분석하면 Mate Flex Framework에서 제공하는 Injector에 대해서 이해하실 수 있을겁니다.

invalid-file

소스파일입니다.

아래에 INSTALL NOW클릭하시면 설치가 될 겁니다.
설치가 안되신다면 http://www.adobe.com/go/getair/ 여기서 AIR를 다운로드하세요.

Alternative content

Get Adobe Flash player

 
Posted by 머드초보
,
 
버전을 올렸군요. 오늘 플렉스로 삽질을 하는데, Adobe Reader가 업데이트하는 것처럼 시스템트레이 오른쪽아래에 뜨더라구요. 망할 놈의 Adobe Reader가 또 업데이트하나 봤더니 Flex Builder더군요-_-;
이 놈도 업데이트를 심어놨구놔! 라는 생각에 왠지 이번에는 Eclipse3.4를 지원할 것 같았어요.

그래서 찾아보니 역시나군요.
http://www.adobe.com/devnet/flex/articles/sdk3_fb301.html

여기에 가보니 잘 작성이 되어있군요.
덕분에 이제 Eclipse3.3 + Flex Builder를 버리고-_-; Eclipse3.4로 통일을.....

http://www.adobe.com/cfusion/entitlement/index.cfm?e=flex3email
여기서 그냥 받으시면 3.0.1로 받아집니다.

깔끔하게 다시 설치하기 위해 Flex Builder를 지우고 다시 받아서 설치를 해보니, 경고창도 안뜨고 잘 되네요.

Flex SDK 3.1

  • Numerous bug fixes including fixes provided by the community. A complete list of bug fixes can be found here.
  • Introductory support for Flash Player 10 (currently in beta); note that final support is expected in a future release. Despite our support, we do not include Flash Player 10 Beta in the actual SDK as we try not to ship beta software in official releases. You can however retrieve the matching 3.1 SDK with Flash Player 10 included from our Flex 3 open source downloads page.
  • Final support for AIR 1.1

Flex Builder 3.0.1 (including the data visualization components)

  • Numerous bug fixes. A complete list of bug fixes for the IDE can be found here and the data visualization components here.
  • Support for AIR 1.1
  • Support for Eclipse 3.4

대충 영어를 보니............................
조.....좋아진거겠죠?-_-;
Flash Player 10어쩌구 하는 거보니...그걸 지원하는건가-_-; AIR 1.1도 지원하고, Eclipse 3.4도 지원하네요 ^^


 
Posted by 머드초보
,
 
http://mudchobo.tomeii.com/tt/303
Javascript로 만든 위젯이 여러분의 매우 관심없음의 힘입어....Flex용으로 만들어봤습니다.
우선 HTTPService가 안돼서......Javascript를 이용하여 만들어봤습니다.
조합은 아래와 같습니다.

Flex 3 + Javascript(Prototype 1.6.0.2) + swfobject2.1 + FABridge입니다.

블로그에 넣으려고 하니 FF에서만 안보이네요-_-;
IE에서도 보이는데... 뭐하고 충돌하는거지-_-;
링크입니다.
http://mudchobo.tomeii.com/swf/GoogleWeatherWidget.html

야후에서는 API를 제공해서 다른 방법으로 해보려다가 이렇게 까지 해버렸네요-_-;
완전 삽질-_-;
아래는 저의 삽질의 결정체 소스파일입니다.

이런식으로 할바에는 안쓰겠다라고 말하고 싶군요.
하지만, FABridge의 엄청난 능력에 대해서 감탄하고 말았군요.
Flex객체에 대한 addEventListener가 완벽하게 지원하는 듯합니다. Timer이벤트도 한번 걸어봤는데 잘 되더라구요.
 
Posted by 머드초보
,
 
자바스크립트와 Flex와 통신을 해주는 FABridge라는 놈은.....
우선 처음에 접하게 되면 혈압을 약 50%를 상승시켜주는 효과를 가져다 줍니다.

그 이유는 로컬에서는 테스트를 할 수 없습니다-_-;
즉, file:///D:/workspace/flex/~~~ 요런 경로에서는 실행할 수 없습니다.
처음에 그냥 flex builder에서 실행할 때에는 아무런 경고가 뜨지 않습니다. 하지만, export해서 build release를 한다음에 bin-release에 있는 html파일을 실행하면 요런 에러가 뜹니다-_-; 이걸로 혈압이 10%상승했죠.
SecurityError: Error #2060: 보안 샌드박스 문제가 발생했습니다. ExternalInterface 호출자 file:///D:/workspace/flex/FABridgeTest111/bin-release/FABridgeTest.swf은(는) file:///D:/workspace/flex/FABridgeTest111/bin-release/FABridgeTest.html에 액세스할 수 없습니다.
    at flash.external::ExternalInterface$/_initJS()
    at flash.external::ExternalInterface$/addCallback()
    at bridge::FABridge/initializeCallbacks()
    at bridge::FABridge()
    at FABridgeTest/_FABridgeTest_FABridge1_i()
    at FABridgeTest()
    at _FABridgeTest_mx_managers_SystemManager/create()
    at mx.managers::SystemManager/initializeTopLevelWindow()
    at mx.managers::SystemManager/http://www.adobe.com/2006/flex/mx/internal::docFrameHandler()
아놔...그렇구나....-_-; 그래서 꼼수로....톰캣과 blazeds를 이용합니다-_-;
프로젝트를 생성할 때 ProjectName에 FABridgeTest로 하고, Web application으로 하고, Application ServerType을 J2EE로합니다. 톰캣을 사용하는 겁니다. 이렇게 생성한 놈은 실행할 때 http://localhost:8080/프로젝트명/프로젝트명.html로 실행해주기 때문에 테스트를 할 수 있습니다.
Next를 하고, Target runtime에 tomcat을 설정해주고, Flex War파일에는 blazeds.war파일을 선택합니다. Finish를 선택하여 프로젝트를 만듭니다.

기존에 있던 index.templete.html은 FABridge사용에 문제가 좀 있어서 다시 생성만들어야합니다.
http://olegflex.blogspot.com/2008/06/swfobject-2-flex-template.html
여기에 가면 templete을 만들어 놓은 것이 있는데 다운받고 압축을 풀면, html-template폴더가 있는데, 기존의 html-template폴더 날려버리고, 이걸로 대체합니다.

이제 필요한 것은 FABridge.js파일인데, 이 파일은 기존의 것을 사용하면 swfobject 2.1에서는 사용할 수 없습니다. 그래서 수정한 버전이 필요합니다. 기존것으로 하려다 혈압이 약 20%상승한 듯 합니다.
http://www.swffix.org/swfobject/swfobject_flex3/
이곳에 가면 예제와 FABridge.js와 history.js파일이 있는데 이걸 html-templete폴더와 ./history폴더에 각각 복사합니다.
예제를 만들어봅시다.
index.templete.html파일을 열어서 bridgeName을 지정해줍니다.
[code]
var flashvars = {
    bridgeName: "mudchobo"
};
[/code]
지정해주지 않으면 flash가 디폴트가 됩니다.
html-templete폴더에 test.js파일을 만들어서 테스트를 만들어봅시다.
test.js
[code]

var flexApp;

FABridge.addInitializationCallback( "mudchobo", function() {
    flexApp = FABridge.mudchobo.root();
    var callback = function() {
        alert('flex로 호출한 javascript메소드');
    }
    flexApp.getMyButton().addEventListener("click", callback);
});

function callFlexFunction() {
    flexApp.flexFunction('javascript로 호출한 flex메소드');
}
[/code]
FABridge.addInitializationCallback함수는 birdge이름이 mudchobo인 flash가 초기화가 다 되면 호출이 되는 듯합니다. 로드가 다 된 상태면 저 뒤에 함수를 호출하게 되는 듯합니다.
window.onload에다가 때려박으면 FABridge.mudchobo가 undefined가 되더라구요. 이걸로 혈압이 약 10%상승했습니다.
javascript에서 flex버튼 이벤트가 발생했을 때 이벤트를 걸 수 있습니다. getMyButton()네이밍 룰은 flex에서 버튼 id가 myButton이면 getMyButton으로 해당 컴포넌트를 가져올 수 있습니다. id가 mudchobo면 getMudchobo()가 되겠죠. addEventListener에 click시 callback함수를 호출하도록 이벤트를 추가합니다.

그리고, callFlexFunction이라는 메소드를 추가해서 이것은 flex메소드를 호출하는 겁니다.
flexApp객체를 통해 그냥 함수명을 호출하면 호출이 됩니다.

index.templete.html에다가는 head부분에다가
[code]
<script type="text/javascript" src="FABridge.js"></script>
<script type="text/javascript" src="test.js"></script>
[/code]
body부분에다가 button을 추가
[code]
<div>
    <input type="button" id="javascriptButton" value="callFlex" onclick="callFlexFunction();"/>
</div>
[/code]
이제 flex코드로 가봅시다. 우선 FABridge.as파일이 필요합니다. 이 파일은 C:\Program Files\Adobe\Flex Builder 3 Plug-in\sdks\3.0.0\frameworks\javascript\fabridge\src에 있습니다. 아주 꼭꼭 숨겨두셨어요-_-;
[code]
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
    xmlns:bridge="bridge.*" width="300" height="150">
   
    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            public function flexFunction(data:String):void
            {
                Alert.show(data);
            }
        ]]>
    </mx:Script>
   
    <mx:Button id="myButton" label="callJavaScript" />
   
    <bridge:FABridge />
</mx:Application>
[/code]
중요한 점은 xmlns:bridge="bridge.*"랑 <bridge:FABridge /> 입니다.
이제 실행을 해봅시다.
아...여기서 이제 html-templete내용의 js파일을 고쳤는데 파폭에서 열고 소스보기하면 안바뀌어 있을 때가 있습니다. 그때는 Flex메뉴에서 Project -> clean을 해주면 되더라구요. 이걸로 혈압 10%상승!

실행하면 localhost로 뜨기 때문에 잘 될 겁니다. 소스파일입니다.

다음시간엔 실제 ajax를 요청해봐야겠다-_-;
 
Posted by 머드초보
,