'flex'에 해당되는 글 47건
2010.03.09 02:00
정말 오랫만에 글을 쓰는 것 같네요. ;) 먹고 살기 바쁜터라 통 블로그에 신경을 못썼습니다. 그래도 꾸준히 찾아주신 분들께 감사드립니다.

이번 포스트에서는 ASDoc을 위한 작업에 대한 Tip 과 MXML 에서 ASDoc 을 작성하는 것에 대해 알아보려고 합니다. 많은 분들이 아실 만한 내용입니다만, 정리하는 차원에서 작성해보겠습니다.

우선 ASDoc 을 생성하는 방법은 지용호님의  Flex 프로젝트 문서화 - ASDoc 사용하기 라는 포스트로 알아보시면 되겠습니다. 한번 작업해보시면 아시겠지만, 콘솔에서 asdoc.exe를 실행시켜 작업하는 것이 여간 불편한 것이 아닙니다. 이미 지용호님이 그에 따른 해법으로 ANT[각주:1]를 이용하는 방법에 대해 Flex Builder 3에서 ANT 사용하기 포스트를 해두셨습니다. (짝짝짝) 저희는 그대로 읽기만 하면 됩니다. :)
 
위의 2개의 포스트을 읽고 실습해보셨다면 '이렇게 좋은 기능이!!!' 라고 감탄하셨지 모르겠지만, ASDoc Comment를 입력하는 것 자체가 사실 좀 귀찮기는 합니다. 물론 'Ctrl + Shift + D' 를 눌러 ASDoc Comment 구문을 자동생성 할 수 있는 있습니다만, @param, @return 등을 일일이 입력하는 것 자체가 상당히 귀찮습니다. 이때 유용하게 쓸 플러그인을 하나 소개합니다.

Flex Formatter 입니다. 이미 알고 계신분이 많을 것 같습니다. 예전에 sugo님 블로그인 Apollo9 에서 Flex Builder MXML/AS Code Formatter 라는 포스트로 소개되었던 플러그인인데요, Flex Builder 3에서 가장 아쉬운 기능인 소스코드 포멧팅을 지원해주는 매우 나이스한 플러그인입니다. 이 Flex Forrmatter가 upgrade 되면서 ASDoc 관련 기능들이 추가되었습니다. 자동으로 ASDoc Comment 를 추가해주는 기능입니다.  설치방법은 우야꼬님의 블로그에 Flex Formatter - FlashBuilder Plugin 라는 포스트로 소개가 되어있으니 참고하시면 되겠습니다. (Flex Formatter는 현재 글 쓰는 시간을 기점으로 0.7.1 버전이 최신입니다.)

Flex Builder 3에서 Flex Formatter를 설치한 화면

Flex Builder 3에서 Flex Formatter를 설치하면 위와 같이 좌측상단에 아이콘들이 추가됩니다.


총 5개의 버튼이 나타나게 되는데 간단히 설명해보면 왼쪽에서 오른쪽으로 각 버튼들은 다음과 같은 기능을 합니다.

1. 파일 내에 설정값에 따라 ASDoc Comment 생성
2. 커서가 위치한 열에 ASDoc Comment 생성
3. 코드 포멧팅 적용
4. 들여쓰기 적용
5. 코드 재배치

1번 'Generate ASDoc comments for file' 버튼을 클릭하여 ASDoc Comment를 생성하여보도록 하겠습니다.

위와 같은 테스트코드를 작성 후 'Generate ASDoc comments for file' 버튼을 클릭하게 되면 아래와 같이 주석이 자동으로 생성되게 됩니다.

여기에 ASDoc 문서에서 볼 수 있게 설명을 아래와 같이 적어보도록 하겠습니다.


이렇게 작성된 클래스는 아래와 같이 ASDoc 파일이 생성됩니다.


위의 AS을 참고하여 생성된 ASDoc

위의 AS을 참고하여 생성된 ASDoc


하지만 아쉽게도 AS 파일에서만 지원되고, MXML에서는 아직 지원되지 않네요. ;-(


이번에는 MXML에서 ASDoc 를 생성하는 것에 대해 알아볼텐데요, MXML에서도 ASDoc Comment를 입력하면 ASDoc을 생성할 수 있습니다만, AS와는 달리 Class 수준의 Comment를 달수 없었다는 것이 문제였습니다.  (위에서 '간단한 테스트용 클래스인 MyClass'라고 출력되는 부분) 부끄럽게도 그간 ActionScript로 작성된 라이브러리에만 ASDoc을 만들었터라 MXML에서는 ASDoc을 생성해보지 않아서 해결책 찾을 생각도 안해보았는데, 이번에 한번 해보려고 열심히 구글링~ 해보았더니 떡하니 이런 문서가 있더군요!
Flex 4 에서 해당 기능이 추가되었네요. 기존의 MXML의 Comment 방식이었던 <!-- --> 과 구별하기 위해 <!--- --> (dash 3개)를 사용하게 정의하고 있네요. Flex Builder 3를 사용하시는 분들께서도 Flex 4 sdk 를 내려받으셔서 Flex 4의 asdoc.exe 를 사용하시면 위와 같이 MXML에서 Class 수준의 Comment를 입력할 수 있습니다. ;)

위의 MXML을 참고하여 생성된 ASDoc

위의 MXML을 참고하여 생성된 ASDoc


Flash Builder 가 정식발매 된 후에는 당연한 듯 사용할 지도 모를 정보입니다만, 기록의 차원에서 정리하여보았습니다. ASDoc 관련 정보는 LiveDoc의 Using ASDoc에 잘 나와있으니 참고하시면 좋겠네요. ;)
  1. 자바기반의 빌드 자동화 툴. (http://ant.apache.org/) [본문으로]
저작자 표시 비영리 변경 금지
신고
공룡 | 2010.03.09 02:24 신고 | PERMALINK | EDIT/DEL | REPLY
좋은글 잘보고 갑니다~~~~ ^^
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.03.09 13:07 신고 | PERMALINK | EDIT/DEL
덧글 감사합니다 ;^)
Favicon of http://me2day/tangbba BlogIcon 꼬출든남자 | 2010.03.09 12:59 신고 | PERMALINK | EDIT/DEL | REPLY
저도 이넘을 쓰기는 하는데..
이것 때문인지는 모르겠지만 코드 어시스트가 삑싸리나기도 하고..
괄호 한개 안닫은 구문이 코드 중간에 있으면 에러창 토하고.. ㅋㅋ Snippet과 적당히 섞어 쓰고 있어욤
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.03.09 13:07 신고 | PERMALINK | EDIT/DEL
ASDoc 은 민감하니 부드럽게~ ㅎㅎ
Favicon of http://koko8829.tistory.com BlogIcon 열이아빠 | 2010.03.09 14:25 신고 | PERMALINK | EDIT/DEL | REPLY
저도 이제 슬슬 주석질을 좀 해야될텐데요. ^^
스크립트 내용 분석해서 알아서 주석도 달아주고 하면 좋겠어요.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.03.12 08:22 신고 | PERMALINK | EDIT/DEL
진정한 자동화문서!!! ㅋ
Favicon of http://vulcan9.tistory.com BlogIcon vulcan | 2010.03.09 15:55 신고 | PERMALINK | EDIT/DEL | REPLY
mxml에서 클래스주석 다는 방법 유용하게 잘쓰겠습니다..ㅎㅎ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.03.12 08:22 신고 | PERMALINK | EDIT/DEL
더 유용한 것들 알게되시면 공유를 좀.. ^^
Favicon of http://blog.jidolstar.com BlogIcon 지돌스타 | 2010.03.17 13:02 신고 | PERMALINK | EDIT/DEL | REPLY
ㅋㅋㅋ 이제 mxml에도 주석질!
Favicon of http://tawool.tistory.com BlogIcon 타울 | 2010.03.24 19:04 신고 | PERMALINK | EDIT/DEL | REPLY
오...이젠 Flex4를 사용해야할때인가봐요 ㅋㅋ
검쉰님 좋은 내용 감사합니다~ ㅎ
Favicon of http://hazbola.tistory.com BlogIcon 뿌꾸 | 2010.03.24 21:22 신고 | PERMALINK | EDIT/DEL | REPLY
좋은글 너무 잘 보았습니다 ^^ 트래붹 걸었습니다 ..^^
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.10.30 10:52
오랫만에 블로그 유입경로를 보다가 코리아몽키라는 분의 블로그를 알게 되었습니다.  [Actionscript 3.0] 간단하게 만들어 본 XML to arrayColection 함수 라는 글에서 제 글을 인용하셨더라구요. ;) 위의 글 말미에 코리아몽키님이 가진 의문이 있으셔서 덧글을 달다가 덧글이 좀 길어질 듯 하여, 간만에 포스팅을 하려고 합니다. ;)

'왜 XML을 Object로 파싱하여 그 데이터를 처리하고 이용하는 방법에 대해서 정리된 자료가 없는 것인가?' 라는 의문은 다른 각도로 접근해봐야 할 것 같습니다. '왜 방법이 없는가'에서 'XML을 Object로 파싱하지 않고 사용할 방법이 있는가?' 라는 것으로 말이죠. 단도직입적으로 말씀드리자면, XML 을 받은 것을 Object 로 변환해야할 필요성이 크지 않다는 것입니다(꼭 필요한 경우도 있겠습니다만). 게다가 XML 그대로 사용하는 것도 가능하고 HTTPService를 이용하면 XML을 Object로 변환 한 결과를 바로 받을 수도 있기 때문입니다.

그럼 먼저 HTTPService 를 이용하여 다양한 형태로 결과를 받는 방법에 대해서 알아보겠습니다.

HTTPService 의 resultFormat
HTTPService에는 resultFormat 이라는 속성이 존재합니다. 이는 HTTP를 호출하여 받은 결과값을 어떤 식으로 파싱할 것인지에 대해서 설정하는 속성인데, 아래의 표와 같이 총 6가지로 설정 가능합니다.

  object   ActionScript의 Object 들의 트리형식으로 XML 을 파싱하여 반환합니다. (기본값)
  array   ActionScript의 Object 들의 트리형식으로 XML 을 파싱하여 반환되나, 최상위의 Object가 Array가 아니라 새로 생성된 Array의 첫 번째 아이템이 됩니다. 만약 makeObjectsBindable 속성이 true로 설정되어 있을 경우 최상위 Array는 ArrayCollection으로 반환됩니다.
  xml   ActionScript 의 XMLNode Object로 이루어진 XML로 XML을 파싱하여 반환합니다.
  flashvars   ActionScript Object로 name과 value가 쌍으로 되어 있는(page=1) 텍스트를 파싱하여 반환합니다.
  text   받은 그대로를 text로 반환합니다.
  e4x   ECMAScript for XML(E4X)를 이용할 수 있는 ActionScript 의 XMLNode Object로 이루어진 XML로 XML을 파싱하여 반환합니다.

resultFormat를 object나 array로 설정하면 Object로 변환된 XML 데이터(서버측이 전달해준)를 전달받게 됩니다. 따로 파싱할 필요가 없는 것이죠. 물론 e4x나 xml로 설정하여  XML로 받아와서 사용할 수도 있습니다. 또는 특정 프로토콜에 의해 생성된 데이터라면 text로 설정하여 String 으로 받은 다음 프로토콜에 맞게 파싱하여 사용할 수도 있을 것입니다. (마치 구분자를 이용하여 소켓통신시 데이터 전달하는 것과 같이)

Object로 파싱하여 사용
rss 구조

rss 구조 (이미지 클릭하여 보세요.)

object로 resultFormat을 설정하여 데이터를 받아오는 예제를 한번 보겠습니다.
본 블로그의 rss를 읽어서 DataGrid에 넣어주는 예제인데, 우선 RSS 정보를 읽기 위해 구조를 먼저 보면 (우측이미지 참조) channel이라는 노드의 하위에 블로그의 정보들(타이틀, 주소, 이미지정보 등)이 있고 포스트의 정보는 item 이라는 노드들에 들어있습니다.

예제에서는 이 item 노드들을 가져다가 DataGrid에 넣어줄 것입니다.




위의 예제에서 resultHandler 메소드를 잠시 보시면 위에서 말한 item 노드들을 찾아서 DataGrid 에 넣어주는 구문을 보실 수 있으십니다. 위의 rss의 트리구조와 같이 Object 로 파싱되어 있기 때문에 동일하게 rss.channel.item 이런 식으로 item 을 읽어오고 있습니다. (하단 이미지 참조)

Object로 받아온 데이터

Object로 받아온 데이터



XML 그대로 사용하기
Flex의 DataGrid, Tree 와 같이 자주 사용하는 컴포넌트의 설계적 특성상 Object 혹은 XML 중 어떤 하나가 더 빠르다는 이야기는 둘째 치고라도 위의 예제같은 경우는 XML을 그대로 사용하시는 것이 오히려 개발 시에는 편할 수도 있습니다. 왜냐하면 resultHandler에 구현된 로직때문인데, resultFormat 속성을 e4x로 설정하여 결과로 받은 XML은 E4X를 사용할 수 있기 때문입니다. E4X에 대한 설명은 생략하도록 하겠습니다. 간단한 E4X에 대한 예제는 여기를 참고하세요.




resultFormat 속성을 e4x로 설정하고, resultHandler 메소드에서 e4x를 사용하여 간단하게 item을 DataGrid에 넣도록 구현하였습니다. 위의 예제와 비교하여 보셔도 크게 다른 것은 느끼지 못하실 것입니다. 오히려 위의 예제에서는 item 노드를 찾기가 훨씬 쉽게 되어있죠.

XML로 받아온 데이터

XML로 받아온 데이터



개발자 마다 스타일에 따라 차이는 있겠습니다만, 저의 경우는 HTTPService를 이용하는 어플의 경우 XML을 기반으로 데이터를 운용하고 있고, RemoteObject의 경우에는 VO를 기준으로 데이터를 운용하고 있습니다. 아무래도 HTTPService를 사용하는 경우는 서버와 주고받는 데이터를 XML기반으로 움직이는 것이 E4X 때문에 무지 편한 느낌이라.. ;^)

다른 분들은 어떻게 데이터를 운용하시는지 저도 궁금하네요. ;^) 트랙백 부탁드립니다.

신고
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.10.30 16:22 신고 | PERMALINK | EDIT/DEL | REPLY
난 이 의견 반댈세
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.10.30 17:07 신고 | PERMALINK | EDIT/DEL | REPLY
외부 서버로부터 받은 데이터를 가공하지 않고 그대로 쓰는 건, 결합도를 높이는 지름길..
(이 주제는 예전에 구글톡에서도 한 번 의견을 나누었던것 같은데.. -_-;)

물론, 테스트용 어플리케이션, 프로토타입 등에선 나도 저런식으로 그냥 E4X로 긁어다 쓰긴 하는데, 딱 그 범위만 넘어서도, 기능이 한두가지만 엮여도, 별도의 객체 구조를 가져가는게 사용하기 편함..

결합도 vs 간편성은 항상 논란의 여지가 많은 부분이긴 한데,
최근 몇 년간의 추세는, 간편성도 매우 중요하지만, 결합도가 우선시되어야, 또는 선행되어야 한다는 쪽 우세하니까..

또 내 경험으로도, XML을 가공하는데 드는 비용은 그리 크지 않은 편이고, 반면에 깨끗한 코드를 유지할 수 있다는 이점은 참 버리기 아까운 부분..
Favicon of http://blog.handkstory.net BlogIcon 제주소년 | 2009.10.31 14:35 신고 | PERMALINK | EDIT/DEL
아.. DB와의 종속성을 없애기 위해 ORM을 사용하는 원리와 비슷한건가요?ㅎ
하긴 외부 서버의 데이터를 바로 사용한다면 결합도가 크게 상승하겠네요..
Flex용 ORM이 나와도 좋을듯.. =ㅅ=ㅋ
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.11.08 06:26 신고 | PERMALINK | EDIT/DEL
예, 비슷한 맥락입니다. :')
내용을 조금 더 보태자면, 결합도 문제는, 일반적으로 일정 기간이 지난 후에야 불거지는 성향이 있어, 개발 시에는 잘 고려하지 않는 부분이기도 합니다.
또한, 개발이 된 후 한참 뒤에야 발견되는 문제이기에, 오히려 심각성이 더 크기도 하지요. 이슈가 될 시점 즈음에는 코드를 잘 알고 있는 사람이 아무도 남아있지 않기 때문에.. ㅎㅎ
Favicon of http://minsangk.com BlogIcon 민상k | 2009.11.01 10:25 신고 | PERMALINK | EDIT/DEL | REPLY
저도 찬익님 의견처럼 결합도 때문에 Object-XML / XML-Object 간 변환 루틴을 힘겹게 만들었던 기억이 납니다.
그러나 결국 만들어보니 xml feeder 가 제 자신이라면 저런 결합도를 위한 노력이 아무 짝에도 쓸모 없음을 깨달았습니다 ㅋ
resultFormat 을 object 로 하는건 생각못했네요. resultFormat="e4x" 에 너무 익숙해져 있었나 봅니다.

좋은 글 잘 읽고 가요.
ps: 얼마전까지도 RSS 에서 찾아 들어오면 올블릿이 바로 떠서 주소를 찍어와야 했는데 오늘은 제대로 글이 뜨네요ㅋ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.11.08 10:48 신고 | PERMALINK | EDIT/DEL
제 블로그 rss 주소는 http://blog.flashplatform.kr/rss 입니다. 아마 올블릿쪽 rss 을 참조하고 계신듯 하네요 ;)
방문 감사합니다.
최재영 | 2009.11.03 10:04 신고 | PERMALINK | EDIT/DEL | REPLY
결합도가 높아진다는건 이해하기 힘든 부분인데...
어차피 화면 구성은 해당 Application 에 의존적인 부분이고,
재사용 가능한 컴포넌트에서는 ICollectionView 의 사용으로
결합도하곤 상관없는듯...
결론: 그냥 e4x 를 사용한다
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.11.09 03:36 신고 | PERMALINK | EDIT/DEL
재영형 하이 ㅎㅎ
위에 언급한 결합도는 Service Architecture와의 coupling을 얘기한 것임.
예를 들면, RSS 리더라면 ATOM 등의 다른 포맷들도 지원해야하는데, 위 구조로는 추후에 포맷을 추가할 때마다 다소 진통이 있을 듯.
물론 국내의 기업용 어플리케이션들의 경우엔, '클라이언트를 위한 서버'를 개발하는 방식으로 클라이언트/서버 개발을 묶어서 진행되는 경우가 대부분이라 거부감이 없겠지만서도.. 이는 애초에 클라이언트/서버의 결합도를 100%로 놓고 시작하는거니까..

결론 : (아키텍처 상의) 컴포넌트 간 결합도에 대한 얘기였음.
Favicon of http://me2day.pe.kr BlogIcon 이태호 | 2009.11.03 21:06 신고 | PERMALINK | EDIT/DEL | REPLY
우선 뭐.. 저는. 위 최재영님 스타일과 같구요. 단, XML데이터를 별도의 class가 raw한 데이터(xml)를 머금고 있도록 하고, 밖에서는 일종의 factoring을 해다 쓰는 편입니다. 어찌보면 절충안이라고 할 수 있죠. 한마디로 1 xml에 대한 명세를 1 data container class 만 가지고 있게 합니다. 그냥 갠적인 스타일~
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.11.08 10:41 신고 | PERMALINK | EDIT/DEL | REPLY
추가적으로, 코드의 가독성도 문제가 될 수 있다는 생각..
물론 문서화로도 해결 가능하나, 모든 가독성 문제는 문서화로 해결이 가능한 반면, 아무도 문서를 읽으려하지 않으므로..

추후 서비스의 운영/유지/보수 시, 위 RSS 리더의 경우, BlogPost 라는 Class를 두고 파싱하는 경우, 클래스명만으로도 대략의 로직을 이해할 수 있으나, rssData..item과 같은 경우, 해당 로직을 이해하기 위해서는 RSS의 Specification에 대해서도 추가적인 지식이 있어야 함. 물론, RSS는 널리 알려진 포맷이라 많은 개발자들이 내용을 숙지하고 있겠지만, FOAF이나 DOAC이라면 또 다를 것이고, XMPP나 또는 기업 내부에서만 사용하는 데이터 포맷이라면 더욱 그 차이가 심해짐.

단, 유지 비용과는 관계 없이 저럼한 개발 비용을 추구하는 국내 소프트웨어 개발 업계의 실정에는 본 답글 내용이 맞지 않을 수는 있다는 의견..
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.11.08 10:46 신고 | PERMALINK | EDIT/DEL
코드의 가독성의 문제에 대해서는 동의.
위의 RSS spec 을 숙지한 경우에는 상관 없겠으나 spec 을 모르는 상태에서의 저 코드는 대략난감이겠군.
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.11.09 04:15 신고 | PERMALINK | EDIT/DEL
흠.. 난 결합도 문제가 더 큰 문제라고 생각하는데..
최재영 | 2009.11.09 08:58 신고 | PERMALINK | EDIT/DEL | REPLY
음.. 방금도 대화했지만
이미 사용데이터는 Collection류로 추상화되어 있는데다,
서버(혹은 데이터)와의 coupling point 는
소스 데이터의 변화가 있는 경우 어차피 다시 작성되어야 함.
VO 가 있는 경우 소스데이터가 변하면 VO 도 수정해야하고..
(가독성 차원에서는 잘 생각해봐야 함. 어느 쪽이 비용이 더 적은지)
coupling point 에서의 추상화 레벨이 높아질수록,
코드 복잡도가 증가할 수록 쓸데없는 버그발생률만 높이게 되는 듯...
차라리 다른 곳에서의 재사용성을 높이는게
훨씬 더 이득이라는 생각...
(결합도 낮추기는 재사용성을 위해서 생각한거 맞지?)
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.11.15 17:01 신고 | PERMALINK | EDIT/DEL | REPLY
음.. 역시 방금 다시 대화했지만.. (메신저가 편리하긴 편리한 듯.. 로그 정리가 안되는게 흠이지만)

재사용성하고 일부 겹치는 부분이긴 한데, 일단 결합도는 Flexibility를 염두에 두고 이야기 한 것..
아직은 실력이 부족으로.. 재사용성의 이점을 누리진 못하고 있어서..

개발 단계, 또는 운영 단계에서 기능의 추가/수정이 빈번히 일어나는 경우,
코드의 깨끗함을 유지한 채 지속적으로 기능을 추가할 수 있는 구조..라면
아무래도 VO 쪽에 조금 더 점수를 줄 수 있을 것 같다는 생각.

또, 역시 메신저에서 이야기 했듯이, 하나의 예로,
외부에서 가져온 한 가지 데이터를 다수의 Visual Component에서 사용하는 경우,
만약 특정 데이터의 노드명이 변했다면 (ex. pubDate->publishDate)
데이터를 그대로 가져와서 쓰는 경우, 모든 Visual Component에서 해당 값을 바꿔줘야 하지만,
VO는 파서에서 단 한 번만 수정해주면 되니..

코드 복잡도 문제는 나중에 다시 토론..
Favicon of http://vulcan9.tistory.com BlogIcon vulcan | 2009.12.05 17:15 신고 | PERMALINK | EDIT/DEL | REPLY
저두 걘적으로다가 [외부데이터-VO 클래스] 이렇게 항상 짝으로 사용합니다. 외부데이터를 파싱해서 적절하게 변형시켜주눈 Adapter 역할을 VO 클래스에 맡기는거죠. 아직까지는 데이터가 변하더라도 Vo클래스 밖으로 변경사항이 전파되는 일은 없었던거 같네요. 홍수났을때 물길 막아주는 칸막이 역할 - VO에 한표!
카시우스 | 2010.02.03 17:49 신고 | PERMALINK | EDIT/DEL | REPLY
글잘보고있습니다 ㅋㅋㅋ 근데너무어려움... ㅠㅠ 회사괜히와써.....나에게너무많은걸바래 ㅠㅠ
marie | 2011.11.23 11:24 신고 | PERMALINK | EDIT/DEL | REPLY
flex로 .. 검색해서 블로그들왔는데 잘봤습니당~ 10%정도 알아 들었나?ㅠ _ㅠ 어려워요 엉엉 ㅠㅠ
gottdanken | 2014.11.18 18:00 | PERMALINK | EDIT/DEL | REPLY
관리자의 승인을 기다리고 있는 댓글입니다
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.09.11 11:51
간만에 책 추천해드리려고 합니다 ;)

'Creating Visual Experiences with Flex 3.0' 이 '비주얼 플렉스 UX 디자인' 라는 이름으로 번역되어 예약판매중입니다. 저는 이 책을 읽다가 난감함에 빠져버렸습니다. '어 이건 나만 알고 있었던 것 같은데...' 같은 생각들이 계속 들더라고요. ;-( 혼자만의 테크닉이라고 생각했던 것들이 책에 나오고 있으니 책은 좋은데, '이거 왠지 아깝다' 라는 생각도 들고요. :-)  (물론 대단한 것들은 아닙니다 ㅎㅎ)
생각지도 못했던 테크닉들도 있고 참신한 방법들도 많아 책을 읽는 내내 재미있었던 기억이 나네요.

번역은 '열이아빠'라는 닉네임으로 활동중이신 이준하님께서 고생해주셨어요. 저는 별로 도움 안되는 베타리더로 활동할 수 있어서 번역하신 원고도 재미있게 읽고, 원서도 선물 받았답니다. (감격!)

Flex 라는 것이 아무리 지지고 볶고 하더라도 Client Side 라는 사실은 변함이 없습니다. 아무리 내부코드가 멋지고 훌륭하게 작성되었다고 하더라도 사용자가 느끼는 것은 UX라는 것이죠. (약간의 처리속도 차이도 있겠군요) 운영체제인 Windows (95,ME, XP,Vista, 7)가 새로나올때마다 사용자들은 '우와 이쁘다' 라는 감탄사를 내뱉었을뿐 실제 내부는 어떻게 되었는지 궁금해하지는 않았죠 ;)

Flex 또한 마찬가지, UX 로 평가받는 것이기때문에, 이 책이 아주 훌륭하다고 할 수 있겠습니다.  보다 훌륭한 UX를 가진 어플리케이션을 작성하는데 있어서 필수적으로 알아야 될만한 것들로 가득차 있습니다. 베타리더로 읽어본 것이 전부라, 실제 책의 편집상태 등의 상황은 제가 알 수 없으나, 에이콘 출판사에서 나오는 책이니 만큼 깔끔하게 해주실 꺼라 믿어 의심치 않습니다.


번역서를 받고 궁금해하실 분들이 있으실 것 같아서 원서와 비교사진을 찍어봤습니다. (노이즈는 양해를..) 원서처럼 깔끔하게 나와서 좋네요. 레이아웃도 깔끔하니 잘 나온 것 같습니다. 다음에 Flex 디자인 관련 강의를 이 책으로 해보려고 합니다. 깔끔하니 참 좋게 나왔더라고요 ;)

번역하신 열이아빠님께서 블로그에 예약판매 이벤트를 하고 있으시니 도전해보시는 것도 좋을 것 같습니다 ;)  예약판매 이벤트는 종료되고 서평 이벤트를 계획중이시다고 하시네요 :) 책 구매하셔서 읽어보시고 서평이벤트를 노려보시는 것도...

번역하신다고 고생하신 열아아빠님께도 감사의 인사를 드려요~ 책을 번역한다는 자체는 일종의 '봉사정신'이 없고서는 힘든 일이죠. (영어에 무척 약한 저로써는 감히 손대지도 못할 일이지만,) 그 많은 페이지들을 읽고 고민하면서 번역한다는 것. 게다가 직장생활하시면서 주업무도 바쁘실텐데, 퇴근후 시간을 쪼개서 열정을 가지고 하셨다는 것. 정말 '봉사정신'이 없다면 못할 일입니다. 정말정말 고생하셨습니다 ;)

신고
Favicon of http://koko8829.tistory.com BlogIcon 열이아빠 | 2009.09.11 12:58 신고 | PERMALINK | EDIT/DEL | REPLY
검쉰님이 리뷰가 아니었다면 이 책이 나오지 못했을지도 모르겠네요.
바쁜 시간을 쪼개 어설픈 번역을 잘 정리해주셔서 감사합니다.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.09.11 14:45 신고 | PERMALINK | EDIT/DEL
제가 뭘요ㅎㅎ
워낙에 번역 잘해두셔서 오타찾기나 했었는데요 ;)
정말정말 축하드리고 감사드립니다.
Favicon of http://mckdh.net BlogIcon 산골 | 2009.09.20 20:36 신고 | PERMALINK | EDIT/DEL | REPLY
와..열이아빠님이 책도 내셨군요..
슬슬 플렉스 쓸지도 모르는데..참고해야 겠습니다.
열이아빠님 참으로 멋지시다는..검쉰님도 책한권 내셔야죠~! ^ ^;
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.09.22 18:14 신고 | PERMALINK | EDIT/DEL
전 지식이 습자지 만큼 얇아서;;
기회가 된다면 꼭 써보고 싶네요 ;)
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.10.12 17:35 신고 | PERMALINK | EDIT/DEL | REPLY
우듯메일 확인하삼 -o-
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.10.12 22:02 신고 | PERMALINK | EDIT/DEL
패스워드 기억 안난다.. ㄷㄷㄷ
Favicon of http://tawool.tistory.com BlogIcon 타울 | 2009.10.13 11:59 신고 | PERMALINK | EDIT/DEL | REPLY
몇일전부터 갈등하다가 검쉰님 리뷰보고 바로 질렀습니다 ㅋㅋ
기대되네요 흐흐.. 열이아빠님도 수고하셨습니다 ^^
Favicon of http://leejangsuk.tistory.com/ BlogIcon 이장석 | 2011.04.13 10:12 신고 | PERMALINK | EDIT/DEL | REPLY
UX에 관심있는 분들에게 도움이 될만한 내용이군요.
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.09.04 00:26
안녕하세요? 그동안 블로그에서 한참을 인사를 못드렸네요.
다들 잘 지내셨을꺼라 생각합니다 ;)

그동안 프로젝트 막바지여서 상당히 정신이 없었던 관계로 블로그에 신경을 못썼습니다 :-(
얼마전 프로젝트 종료 후 이제 아주 Free 해 졌어요 ;) 마음이 편해지니 세상이 맑아보이는 효과가 있더군요 ㅎ


강의를 진행합니다. 부족한 실력이지만 한달전에 Flex 강의를 맡아서 진행하였는데, 이번에도 동일하게 다음주 주말부터(12일) 동일하게 주말강의를 진행합니다.  (지난번 강의때 열심히 들어주셔서 감사했습니다. 질문이 있으시면 메일로 꼭 연락주세요!)
그리고 주말에 시간을 못내시는 분들을 위해 21일부터 주중 저녁 7시부터 10시까지 저녁강의를 하나 더 진행하게 되었어요. 구로 근처에 직장다니시는 분들이 들으시면 좋을 것 같네요 ;) 자세한 내용은 위의 링크를 눌러서 확인해주시면 되겠습니다.

저는 여러모로 더더욱 열심히 준비하고 강의하겠습니다 ^^;

Distributable Player SoultionAdobe Flash Collaboration Service

남는 시간에는 그동안 못했던 위의 Flash Builder4와 Flex4, 그리고 Catalyst 공부도 좀 하고, 여행도 다녀올 생각입니다.
아쉽게도 기술 포스팅은 지금까지 마찬가지 당분간 쭈욱 없을 것 같아요 :) 죄송합니다 ^^;;;
열심히 Flex4 공부해서 아는게 생기면 그때 포스팅 하도록 하겠습니다.

그리고 염장소식. 다음주에는 제주도로 떠납니다! ;)

김녕 해수욕장 근처 어디~ photographed by 연월



푹 쉬고~ 돌아오겠습니다 ;)


신고
Favicon of http://koko8829.tistory.com BlogIcon 열이아빠 | 2009.09.04 10:32 신고 | PERMALINK | EDIT/DEL | REPLY
저 풍력터빈 보이는 바닷가 한번 가보았던거 같은데...
물고기들이 겁없이 뛰어다닌다는...ㅎㅎ
즐거운 여행 다녀오세요.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.09.04 16:11 신고 | PERMALINK | EDIT/DEL
김녕 해수욕장 근처 어디라고 친구가 알려주더군요 ;)
http://durl.kr/5ihc
저도 다음 로드뷰로 대강 위치만 확인했어요 ㅎㅎ

재미있게 놀다 오겠습니다 ㅎㅎ
Favicon of http://randorno.tistory.com BlogIcon 란도르노 | 2009.09.04 17:37 신고 | PERMALINK | EDIT/DEL | REPLY
떠나요 둘이서 모든 것 훌훌 버리고 제주도 푸른밤 그 별 아래~~ 부럽습니다 ㅠㅠ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.09.05 23:37 신고 | PERMALINK | EDIT/DEL
많이 부러워해주세요~ ㅎㅎㅎ
Favicon of http://7zelkova.tistory.com BlogIcon 성주 | 2009.09.05 22:31 신고 | PERMALINK | EDIT/DEL | REPLY
제주도 작년에 자전거일주를 꿈꾸고 갔더랬죠.
중간에 피치못할 사정으로 서울로 다시 올라왔지만, 다시한번 도전하고싶어요.
즐거운 여행되시고 사진 많이 찍어서 올려주시면 그것으로나마 대신 위안삼을께요
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.09.05 23:38 신고 | PERMALINK | EDIT/DEL
나두 군대가기전에 제주도 자전거 일주 해본 적이 있지 ㅋ
아주 그냥 힘들어 죽을뻔 ㅋㅋ
그래도 그때가 좋았는데 ㅎㅎ
Favicon of http://egg.pe.kr BlogIcon egg | 2009.09.06 03:27 신고 | PERMALINK | EDIT/DEL | REPLY
오랜만에 뵙습니다. 검쉰님. ^^
다만 이런 염장 포스팅으로 안부를 전해주시는 것은.... orz
Favicon of http://7zelkova.tistory.com BlogIcon 성주 | 2009.09.06 22:56 신고 | PERMALINK | EDIT/DEL
어!! 어어?! 어어어??!!
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.09.11 14:43 신고 | PERMALINK | EDIT/DEL
반가워요~ egg님 ㅎ
요즘은 어떻게 지내세요? ㅎㅎ
구짜 | 2009.10.22 14:25 신고 | PERMALINK | EDIT/DEL | REPLY
하악하악
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.07.01 10:16
Flex3 in Action 이미지 출처 : 강컴

Flex3 in Action 이미지 출처 : 강컴

ActionScript에서 배열은 Array 를 사용하게 됩니다.
Java 와 달리 동적배열이어서 크기를 정하지 않고 임의대로 push, pop 등의 메소드를 통해 편리하게 사용할 수 있습니다. (Java에서는 ArrayList를 사용하시면 편리하죠!)

얼마전에 읽었던 Flex3 in Action 에 보면 'Working with ActionScript' chapter에 Array에 대해서 설명하고 있는데요, 여기에 다름과 같이 배열에 대해서 정의를 하고 있습니다.

1. Indexed arrays
2. Associative arrays

1번 Indexed arrays 는 우리가 흔히 사용하는 Array를 말합니다. 숫자 인덱스를 가지고 다음과 같이 값에 접근을 하게됩니다.

그리고 2번 Associative arrays는 흔히 연관배열 또는 해시(Hash)라고 부르는 배열로 key 값을 가지고 접근하게 됩니다. 책의 예제는 다음과 같습니다.


위의 예제는 이상없이 잘 동작합니다만, ActionScript 에서 연관배열(해시)를 위와 같이 사용하면 안됩니다.
그 이유는 Livedocs 에 잘 나와있습니다.

Array 클래스를 사용하여 번호가 매겨진 요소 대신 명명된 요소가 들어 있는 데이터 구조인 연결 배열(해시) 을 만들지 마십시오. 연결 배열을 만들려면 Object 클래스를 사용해야 합니다. ActionScript에서 Array 클래스를 사용하여 연결 배열을 만들 수는 있지만 이렇게 하면 연결 배열에 Array 클래스 메서드나 속성을 사용할 수 없습니다.
Livedocs 에서 발췌

ActionScript 에서는 Object 클래스를 이용하여 해시를 구현하라고 설명하고 있습니다. 물론 Object가 모든 클래스의 기본이 되기때문에, Array를 이용하여 연관배열(해시)를 만들 수는 있습니다. 하지만 해당 클래스를 만든 의미가 없어지죠. Array는 index를 이용한 배열로 설계된 것이기 때문입니다. 예를 들어 임의로 인스턴스화 시킬 수 있는 Sprite 객체를 연관배열로 사용한다는 것은 정말 황당한 일이라고 할 수 있겠습니다. 해당 목적에 맞게 사용해야 된다는 것이죠 ;)
아래에 Object로 연관배열을 사용하는 방법에 대해서 발췌했습니다.
Object 클래스를 사용하여 연결 배열을 만들 수 있습니다. 기본적으로 연결 배열은 Object 클래스의 인스턴스이며 키-값 쌍은 각각 속성과 속성 값으로 표현됩니다. 결합적 배열을 Object 데이터 유형을 사용하여 선언해야 하는 또 다른 이유는 이 경우 객체 리터럴을 사용하여 결합적 배열을 채울 수 있기 때문입니다. 단, Object 데이터 유형으로 선언하는 경우에만 가능합니다. 다음 예제에서는 객체 리터럴을 사용하여 연결 배열을 만들고 도트 연산자와 배열 액세스 연산자를 사용하여 항목에 액세스한 다음 새 속성을 만들어 키-값 쌍을 새로 추가합니다.

Livedocs 에서 발췌

위와 같이 Object를 이용하여 연결배열(해시)를 만들수 있습니다.
그리고 추가적으로 해당 값의 키(Key)값을 다른 객체로 하기 위해서 ActionScript 3.0에서는 Dictionary 클래스를 제공합니다.

Dictionary 클래스를 사용하면 키 비교에 완전 항등 연산자(===)를 사용하는 동적 속성 컬렉션을 만들 수 있습니다. 객체를 키로 사용하는 경우 객체에 toString()을 호출하여 반환되는 값이 아니라 객체의 ID가 객체를 찾는 데 사용됩니다.

다음 명령문은 Dictionary 객체와 키 객체 사이의 관계를 보여 줍니다.

Livedocs 에서 발췌


실제 해당 클래스의 구현 목적대로 사용하여야 오동작을 막을 수 있습니다.  게다가 협업시에 큰 걸림돌이 될 수 도 있습니다.
이 글을 읽으시는 분들은 사용하시는 클래스가 구현된 목적대로 사용하고 계신가요?

좋은 하루 되세요 :-)

ps. 책이 한글판으로 발간된다는 소식은 없는데, 만약 된다면 위의 오류에 대해서는 수정해서 나왔으면 좋겠네요.
ps2. AS 한글문서에는 연관배열이 아닌 연결배열로 번역이 되어있더군요. 정확하게 무엇이 맞는지는 저도 잘 모르겠네요 :)

신고
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.07.13 12:01 신고 | PERMALINK | EDIT/DEL | REPLY
난 개인적으로 Dictionary 선호..
그나저나.. key.toString = function() { ... }
AS 3.0 이후로, 다른 사람이 쓰는 건 정말 간만에 보는 듯..
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.13 23:11 신고 | PERMALINK | EDIT/DEL
난 AS 3.0 부터 해서 어색한 사용법 ㅎㅎ
Favicon of http://as3.kr BlogIcon 우야꼬 | 2009.07.13 18:17 신고 | PERMALINK | EDIT/DEL | REPLY
맞아 연관배열을 배열의 기능으로 아는 사람 정말 많더라.
굿 포스팅~
마지막에 "클래스의 구현 목적대로 사용하여야"에 공감 100표 >.<)b
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.13 23:11 신고 | PERMALINK | EDIT/DEL
엉뚱하게 쓰면 곤란하단말야 :)
Favicon of http://hangunsworld.com BlogIcon Han Sanghun | 2009.07.13 21:15 신고 | PERMALINK | EDIT/DEL | REPLY
처음부터 배열을 연관배열로 사용하지 못하도록 막아 놓았으면 되는 것을,
정작 뒷문은 만들어 놓고 정문으로만 다니라는 것은 좀 프로답지 않은데요 ㅎㅎ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.13 23:13 신고 | PERMALINK | EDIT/DEL
제가 보기에는 dynamic 클래스라서 맘대로 속성을 넣을 수 있었는데, 그게 어쩌다보니 연관배열처럼 쓸 수 있게 된건지도.;;
그래서 Array를 연관배열로 쓰지말아라.. 라고 LiveDocs에 넣은 것 같기도 ㅎㅎ
Favicon of http://blog.jidolstar.com BlogIcon 지돌스타 | 2009.07.13 22:28 신고 | PERMALINK | EDIT/DEL | REPLY
난 Dictionary를 커스터마이징한 HashMap을 만들어 사용하고 있음~~ ^^
정말 필요할때 Dictionary의 부족한 점을 말끔히 해결해준다는 ~~
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.13 23:14 신고 | PERMALINK | EDIT/DEL
형님 그런건 공개하셔야죠! ㅋㅋㅋ
차차 | 2009.07.14 20:55 신고 | PERMALINK | EDIT/DEL | REPLY
ㅋㅋ오빠 메인사진 바꼈네요..깜놀-,.-
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.22 18:31 신고 | PERMALINK | EDIT/DEL
뭘 또 깜놀까지야 ㅋ
Favicon of http://jjaeko.tistory.com BlogIcon 째코 | 2009.07.15 00:02 신고 | PERMALINK | EDIT/DEL | REPLY
유익한 내용이네요.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.22 18:31 신고 | PERMALINK | EDIT/DEL
감사감사 :)
Favicon of http://douglas9.pe.kr BlogIcon douglas9 | 2009.07.20 12:16 신고 | PERMALINK | EDIT/DEL | REPLY
그런데 한가지 좋은 점은 아주 미묘하지만 Array가 조금 빠르 더군요.
다들 그래서 쓰는 건 아닌지... 하지만 그 정도의 미묘한 차이 보다는
안정성이 더 중요하겠죠^^
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.03.27 22:34 신고 | PERMALINK | EDIT/DEL
맹기완님이 좋은 글 적어주셨어요 ;)
http://www.diebuster.com/?p=690
치우비 | 2009.07.25 01:47 신고 | PERMALINK | EDIT/DEL | REPLY
음...... 잘보고 갑니다..
Favicon of http://7zelkova.tistory.com BlogIcon 성주 | 2009.08.02 00:20 신고 | PERMALINK | EDIT/DEL | REPLY
아아.. 내공 부족을 뼈저리게 느끼고 갑니다.
| 2010.04.25 06:35 신고 | PERMALINK | EDIT/DEL | REPLY
그렇다면... Object로 했을때 특정 KEY에 VALUE를 추가로 넣고싶을땐 어떤 명령을 써야하나요? Array라면 push를 쓰면 되는데.
저도 저 문구때문에 Object로 할려고 했는데...아 괴롭네요 벌써 5시간째 씨름하다가 걍 Array로 완성하긴했습니디만...음... 굽신굽신 조언좀부탁드립니다.
참고로
obj[x].key = value; 또는 obj.key[x] = value; 등등 뭐 이런것들은 안됩니다.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.04.25 17:24 신고 | PERMALINK | EDIT/DEL
obj[x].key = value; 라는 코드가 있을 때, x가 String 이 아니라면 일종의 객체키가 될 것입니다.
이럴 경우 Dictionary 를 사용하시면 될 것 같네요.

저는 본문에서 다루었던 것 처럼 연관배열로 사용할 경우가 아닌 경우에는 Object를 직접 사용하는 것을 꺼립니다. 예를 들어 obj[x].key 라고 정의하셨다면, x라는 키를 통해 받은 객체가 key라는 키를 이용해 값을 가지고 있게 될텐데, 이런 코드는 컴파일러 수준에서는 값이 존재하지 않다거나 하는 문제를 잡을 수 없게되죠. 런타임시에 문제가 발생하게 되므로 곤란해집니다. 특정 속성들을 사용하시는 경우에는 따로 클래스를 만드셔서 사용하시기를 권해드립니다.
울랄라 | 2010.07.30 16:16 신고 | PERMALINK | EDIT/DEL | REPLY
그럼 Object를 연관배열(해쉬처럼)처럼 사용할때,, 전체를 비우거나 일부만 비우려고 할때 어떤식으로 해야 하나여?
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.08.02 15:10 신고 | PERMALINK | EDIT/DEL
'Object가 연관배열로 사용하기 위해서 작성되었다기 보다는 연관배열로 사용이 가능하다.' 라고 생각하시면 쉽겠습니다.
말씀하신 기능은 추가로 구현하여야할 것 같네요.
Favicon of http://storyjava.tistory.com/ BlogIcon KevinKim | 2013.01.18 15:11 신고 | PERMALINK | EDIT/DEL | REPLY
검쉰님 좋을 글 너무 감사합니다. 생초보에 사수없이 혼자 개발하다보니 항상 어려운 점이 많은데, 좋은 글 너무 큰 도움이 되고있습니다.
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.06.29 09:00

감사하게도 오라클자바교육센터에서 Flex 주말 강의를 진행하게 되었습니다. :^)
과목명은 '전문가와 함께하는 Flex' 입니다. 제목이 너무 거창합니다만 ^^;; Flex를 처음 배우고자 하는 분들을 위한 강의입니다.
기본적인 Flex Builder 사용법에서 부터 각종 컴포넌트의 사용, 커스텀 컴포넌트 제작. 그리고 서버와의 통신등 Flex로 개발을 하기 위한 기본적인 지식과 노하우를 전해드리고자 합니다. 가능한한 실습위주로 강의를 진행하여 처음 Flex를 접하시는 분들께 많은 도움이 될 수 있게 하겠습니다.

자세한 일정 및 내용은 아래의 링크를 참고하시면 좋겠네요.
http://www.oraclejava.co.kr/oraclejavanew/curri/curri-45.html

오라클자바교육센터와는 제가 부매니저를 맡고 있는 Flex 동영상 강의 카페인, Flex4U 와의 인연으로 이렇게 강의까지 진행할 수 있게 되었습니다.  강의장이 구로디지털단지 쪽이라, 구로나 가산쪽에 근무하시는 분들이 수강하시기에 편하실 듯 합니다.

누군가에게 자신이 알고 있는 지식을 전한다는 것은 참 즐거운 일인 것 같습니다. 설명을 하면서 오히려 제가 더 도움이 되기도 하고, 강의 준비를 통해 잊고 있었던 것이나 몰랐던 사실들도 알게 됩니다. '배워서 남주나' 라고 하는 말이 있습니다만, '배워서 남주는' 일은 참 즐거운 일이죠.
2008년 초 'Adobe RIA World 2008' 행사때 ACC이신 엄진영님께서 세션을 진행 도중에 무대위에서 발표를 하는 건 정말 '짜릿짜릿' 하다는 말씀을 하셨었죠. 저도 강의장에서 많은 분들에게 강의할 것을 생각하니 벌써부터 '짜릿짜릿' 합니다 ;) 정말 기대되네요 ;-) 즐거운 경험이 될 것 같습니다.

좋은 하루 보내세요~ ;)
신고
Favicon of http://koko8829.tistory.com BlogIcon 열이아빠 | 2009.06.29 10:46 신고 | PERMALINK | EDIT/DEL | REPLY
사진보고 깜짝 놀랐습니다.
날씨에 따라 바뀌는 스킨인가요. ^^
멋진 강의 기대하겠습니다.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.29 10:51 신고 | PERMALINK | EDIT/DEL
사진이라도 웃고 있는게 좋을 것 같아서 바꿨습니다 ;)
기분따라 바뀌는 사진위젯 하나 만들어야겠군요 ㅎ
Favicon of http://randorno.tistory.com BlogIcon 란도르노 | 2009.06.29 11:25 신고 | PERMALINK | EDIT/DEL | REPLY
우왕 굳 멋지십니다!!
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.29 15:00 신고 | PERMALINK | EDIT/DEL
감사합니다 ;)
Favicon of http://7zelkova.tistory.com BlogIcon 성주 | 2009.06.29 11:45 신고 | PERMALINK | EDIT/DEL | REPLY
아 형님 멋지십니다!!
저도 사진보고 깜놀!!
곧 위자드API 공개되는데 그걸 이용해서 사진위젯 만드심은 어떠시려는지.. (홍보 아님다 ㅡ_ㅡ)
강의하시는건 플포유에서 강의하시던 것과는 다른 내용으로 하시는거 같은데...(겹치는게 있어보이기도 하고)
그나저나 커리큘럼이 영어라 무서워요.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.29 15:01 신고 | PERMALINK | EDIT/DEL
뭘 깜놀까지야 ㅋ
오홍. API공개라. ㅎㅎ 고려해볼께! +_+
꾸씩스 | 2009.06.29 16:18 신고 | PERMALINK | EDIT/DEL | REPLY
아잉~ -_- 강사님 이쪽으로~ 굽신굽신... 제가 모시겠습니다 (-_-)/ 손번쩍!
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.29 17:37 신고 | PERMALINK | EDIT/DEL
ㅎㅎ 주말에 보자고 ㅋ
Favicon of http://blog.jidolstar.com BlogIcon 지돌스타 | 2009.06.29 17:00 신고 | PERMALINK | EDIT/DEL | REPLY
멋진 사람. 멋진 강의. ㅎㅎㅎ
발전해나가는 검쉰 멋지다.
사진도 발전하는구나... ㅋㅋㅋ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.29 17:37 신고 | PERMALINK | EDIT/DEL
사진 많이 발전했죠? ㅋㅋㅋ
Favicon of http://www.i-rince.com BlogIcon rince | 2009.06.30 09:05 신고 | PERMALINK | EDIT/DEL | REPLY
와... 누군가를 가르칠 수 있다는 경지...부럽습니다. ^^
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.30 10:16 신고 | PERMALINK | EDIT/DEL
감사합니다 ;)
사진 감사히 보고 있습니다 ;) 삶의 활력소? ㅎㅎ
Favicon of http://blog.chanik.com BlogIcon 찬익 | 2009.06.30 17:02 신고 | PERMALINK | EDIT/DEL | REPLY
나도 갈챠도..
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.30 18:32 신고 | PERMALINK | EDIT/DEL
ㅋㅋㅋㅋ
사진 찍는거 가르켜줄까? ㅋ
무명소녀 | 2009.07.02 09:52 신고 | PERMALINK | EDIT/DEL | REPLY
한동안 블로그 업댓이 안되는거 같더니... 다시 꾸준하게 하고 있었고나. ㅎㅎㅎ
인사가 늦었지만, 결혼식 와줘서 고마워. ^^ 여자친구 이쁘더라.
다시 자주 놀러오겠음. ㅋㅋ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.02 11:39 신고 | PERMALINK | EDIT/DEL
넵~! 행복하게 사시길 ㅎㅎㅎ
Favicon of http://hazbola.tistory.com BlogIcon hazbola | 2009.07.05 04:33 신고 | PERMALINK | EDIT/DEL | REPLY
- 덧글 좀..(굽신굽신)
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.06 09:52 신고 | PERMALINK | EDIT/DEL
긁어 넣지마 ㅋ
심뽀 | 2009.07.06 10:46 신고 | PERMALINK | EDIT/DEL | REPLY
홧팅!!!
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.07 21:40 신고 | PERMALINK | EDIT/DEL
:^)
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.06.23 09:57
DataGrid는 다음과 같이 간편하게 표형식의 데이터를 화면에 출력할 수 있습니다.


이런 DataGrid은 위의 코드에서 보실 수 있듯, DataGridColumn 을 이용하여 화면에 각 열을 생성하여 보여지게 됩니다. 데이터가 아무리 많이 들어오더라도 DataGridColumn이 지정되어 있지 않으면 출력되지 않죠. DataGridColumn은 가장 기본적으로 headerText, dataField 속성을 필요로 합니다.

headerText : DataGrid의 헤더(Header)에 출력될 문자열. 값이 지정되지 않을 경우 dataField의 값으로 사용합니다.
dataField : DataGrid에 입력된 데이터(DataProvider)에서 해당 열에 출력될 데이터를 지정.

위의 코드와 같이 MXML로 정의된 DataGridColumn의 정보(headerText 나 dataField, 혹은 넓이정보 등)를 변경하고자 한다면 어떻게 해야할까요? 방법은 여러가지일 수 있으나, 크게 본다면 1. DataGridColumn에 ID를 지정하여 해당 ID로 접근하거나 2. DataGrid의 columns 속성을 이용하여 DataGridColumn 모음을 받아와 처리하는 방법이 있을 수 있겠습니다.
이 포스트에서는 2번째 방법인 columns속성을 이용하는 것을 알아보도록 하겠습니다.

columns 속성은 DataGrid의 화면에 출력될 수 있는 하나 이상의 DataGridColumn들을 모아놓은 배열입니다. 이 배열에 담겨있는 DataGridColumn들을 수정하면 DataGrid의 모습도 바뀌게 된다는 것이죠.  특정 컬럼을 변경하고자 하면 이 배열의 해당 DataGridColumn에 대해 변경을 하면 반영이 되게 됩니다.

만약 위의 MXML처럼 ActionScript로 DataGridColumn을 설정하려 한다면 columns 속성에 직접 다음과 같이 DataGridColumn을 넣어주면 됩니다.

makeDataGridColumn 이라는 DataGridColumn 객체를 반환하는 메소드를 이용하여 DataGrid의  columns 속성에 원하는 DataGridColumn을 배열로 담아 넣어주게 되면 처음에 보셨던 MXML에서 DataGridColumn을 지정하는 것과 같이 처리할 수 있게 되죠.

마지막으로 원하는 컬럼의 headerText 를 변경하는 예제를 만들어보고 이 포스트를 끝내도록 하겠습니다.
우선 원하는 컬럼을 선택하는 용도로 사용할 ComboBox를 생성 후, 컬럼에 대한 정보를 columns 속성을 이용하여 ComboBox에 넣도록 하겠습니다.


거기에 TextInput 과 Button을 생성하여 변경하고자 하는 문자열을 입력받고 동작할 수 있게 changeLabel 메소드를 추가합니다.


완성된 코드 및 SWF 파일입니다. ;)


좋은 하루 보내세요~ ;)
신고
Favicon of http://dbilove.com/tt BlogIcon 블랜즈 | 2009.06.23 14:07 신고 | PERMALINK | EDIT/DEL | REPLY
항상.. Flex Component에서 많이 배웠는데.. 직접 트랙백도 해주시고..^^
감사합니다..^^ 덕분에 좋은 기능 알게 되었습니다...
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.23 14:13 신고 | PERMALINK | EDIT/DEL
덧글 감사합니다 ;)
좋은 하루 되세요!
네오랑 | 2009.06.23 18:06 신고 | PERMALINK | EDIT/DEL | REPLY
오~~~감사합니다~~~ID 로 접근했었지만, 뭔가 찜찜한 기분이 들었었는데...
속이 뚫리는 기분이네요~~감사합니다...
앞으로도 자주 오겠습니다...잘 부탁드립니다~~
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.24 11:23 신고 | PERMALINK | EDIT/DEL
ID로 접근하는 것도 하나의 방법입니다만,
동적으로 생성되었을 때는 곤란하니까 해당 객체에서 원하는 것들을 받아내는 식으로 접근하시면 편리하실 겁니다. ;)
Favicon of http://blog.jidolstar.com BlogIcon 지돌스타 | 2009.06.24 07:38 신고 | PERMALINK | EDIT/DEL | REPLY
아~ 멋쩌라~ 저런 방법이~
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.24 11:24 신고 | PERMALINK | EDIT/DEL
ㅎㅎ 형님 ㅋㅋ
Favicon of http://adnaru.com BlogIcon 희희덕덕 | 2009.06.25 14:07 신고 | PERMALINK | EDIT/DEL | REPLY
우와 정말 멋진정보네요~
재밌게 잘 읽고갑니다.
감사합니다~ ㅋㅋ 조만간 뵈어야죠!
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.26 00:11 신고 | PERMALINK | EDIT/DEL
네~ 다음주에 뵈어요~ ;)
Favicon of http://blackiz.tistory.com BlogIcon Blackiz | 2009.07.02 15:48 신고 | PERMALINK | EDIT/DEL | REPLY
헛, 어느새 사진이 바뀌셨네요. ㅎㅎ
이번에 캠프에서 못뵈서 아쉽습니다. ㅋ
토요일에 !!
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.02 18:11 신고 | PERMALINK | EDIT/DEL
저도 못가서 너무 아쉽다는.. ㅜㅜ
남석이 | 2009.07.15 05:16 신고 | PERMALINK | EDIT/DEL | REPLY
어떤 브라우져를 쓰시는지... 자동으로 안티엘리어싱처리가 되는 건지.. 가독성이 떨어지네요. 전 크롬과 익스6를 쓰고 있습니다.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.15 09:56 신고 | PERMALINK | EDIT/DEL
파폭을 쓰고 있습니다.
다른 브라우저를 거의 안써서 테스트를 못해봤네요.
한번 테스트해보겠습니다.

혹 ClearType 설정되어있으신지요?
기본폰트로 '맑은 고딕'을 쓰고 있어서 ClearType 설정되어 있지않으시면 이쁘게 안보이십니다 ^^;
네오랑 | 2009.07.20 18:06 신고 | PERMALINK | EDIT/DEL | REPLY
안녕하세요??
질문을 어디에 해야할지 몰라서 여기에 글을 남깁니다..

웹에서 경로설정을 위해 Directory 창을 띄우고 선택하게 하고 싶은데요...
어떻게 하면 좋을지 몰라서 질문 올립니다.

웹에서는 보안 정책때문에 flash.filesystem 패키지를 사용못한다고 하더라구요..
방법을 찾고 있는데, 잘 검색이 않되서 이렇게 염치불구하고 여쭤봅니다..

방법이 뭐가 있을까요?? 답변 부탁드립니다..

그럼, 즐거운 하루보내세요~
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.22 18:30 신고 | PERMALINK | EDIT/DEL
폴더선택창은 안되는 것으로 알고 있습니다. 저도 잘 모르겠네요 ^^;;
도움이 못되어서 죄송합니다.
알려주세요 ! | 2014.11.10 16:17 | PERMALINK | EDIT/DEL | REPLY
관리자의 승인을 기다리고 있는 댓글입니다
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.06.18 23:28
오랫만에 블로그로 인사드립니다. (__)

최근에 BMP 파일을 Flex 에서 읽어다 쓸 일이 생겼습니다.
Flex에서 이미지를 보여주는 컴포넌트인 Image 컴포넌트는 JPEG, PNG, GIF, SWF, SVG 같은 확장자만을 지원하고 BMP은 지원하고 있지 않기 때문에 BMP을 바로 넣을 수는 없습니다.(웹에서 BMP 를 쓰는 무식한 짓을 하면 안되겠죠.. ㅜㅜ 크기도 큰데 말입니다.)  JPG 파일이면 Image 컴포넌트에서 바로 읽어다 쓸 수 있을텐데 참 난감합니다.

그럼 방법이 없느냐? 아닙니다.
어떤 멋진 분께서 BMPDecoder 를 만들어놓으셨네요! :) 이미 FlexComponent 카페에서도 공유되었던 내용입니다.


위의 블로그에 들어가보시면 간단한 사용법에 대해서 나오고 BMPDecoder 라이브러리도 보입니다. 다만 BMPDecoder.as 파일이 다운로드가 안되네요. BMPDecoder.as 파일은 '삶의 향기'라는 블로그에  간단한 예제와 함께 업로드 되어 있으니 다운받아 사용하시면 되겠습니다.

간단하게 FP10 에서 추가된 FileReference의 load() 메소드를 이용해, BMP파일을 불러다  Image 컴포넌트에 넣는 예제를 만들어봤습니다.  예제 구성은 위에서 소개해드린 '삶의 향기' 블로그에 소개된 코드를 이용했습니다.


BMPDecoder.as 보기


BMP 파일을 선택하시면  Image 컴포넌트에 깔끔하게 출력되는 것을 보실 수 있습니다.

하지만 다음과 같은 버그가 존재합니다.
170픽셀 16bit BMP

170픽셀 16bit BMP

171픽셀 16bit BMP

171픽셀 16bit BMP 파일


위의 이미지에서 볼수 있는 것 처럼 BMP을 로드했을 때 이미지가 뒤틀려버리는 버그가 존재합니다.
왜 그럴까 한참을 고민했는데, 저희 팀장님이 힌트를 주시더군요. '윈도우어플에서도 비트맵 크기가 홀수일 경우 이미지가 저렇게 깨진다'고 말이죠. 실제로 테스트해보니 위와 같이 16bit이고 이미지의 너비가 홀수일 경우 위 처럼 이미지가 뒤틀려버리는 버그가 있습니다. (24bit, 32bit에서는 괜찮더군요)

이 버그에 해결책으로 저는 아래와 같이 decode() 메소드에서 이미지 너비를 결정해주는 로직 밑에 너비가 홀수일경우 강제로 1픽셀 늘리는 방법을 사용했습니다. 더 좋은 방법이 있을 것 같은데, 아시는 분은 알려주세요 :)


그럼 좋은 하루되세요!


예제파일 다운로드 :

신고
Favicon of http://hangunsworld.com BlogIcon Han Sanghun | 2009.06.20 08:25 신고 | PERMALINK | EDIT/DEL | REPLY
잘 뒤져보면 자주 쓰이는 파일 포멧들에 대한 인코더/디코더들이 많이 공개되어 있더라고요. 정말 좋은 세상인것 같아요. ^^
그렇지만 플래시 플레이어 성능의 한계상, 용량이 좀 큰 파일인 경우 스크립트 실행이 멈추는 문제가 종종 있더군요.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.20 14:25 신고 | PERMALINK | EDIT/DEL
정말 고마우신 분들이 많으십니다 ;)
예전에 JPEG의 EXIF 정보 읽어보려서 스펙뒤지고 했는데, 이미 만들어서 공개해두신 분이 계시더라는;;;;
용량 큰건 안습이죠... ㅜㅜ
Favicon of http://siking.tistory.com BlogIcon 윤연식 | 2009.06.23 20:53 신고 | PERMALINK | EDIT/DEL | REPLY
아하.. 그렇군요... 잘보고 갑니다 감사합니다...^^
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.24 11:24 신고 | PERMALINK | EDIT/DEL
생유~
차상욱 | 2009.06.24 11:43 신고 | PERMALINK | EDIT/DEL | REPLY
좋은 자료 감사합니다.
그런데 제가 flex3 빌더를 사용하는데 여기서는 FileReference 안에 load() 메소드가 지원되지 않더군요
혹시 위에 빌더가 flex 2인가요??
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.24 15:02 신고 | PERMALINK | EDIT/DEL
저는 Builder 3를 사용하고 있습니다.
기본적으로 Builder 3에서는 FP 9가 기본인데요, 위에 설명에서 보시면 알 수 있듯, Flash Player 10 에서 load() 메소드가 추가되었습니다.
FP10 의 API를 이용하기 위해서는 프로젝트 생성 후 프로젝트 속성에서 Flex Compiler 선택해보시면 하단에 HTML wrapper 가 있습니다. 거기에 요구되는 Flash Player 버전을 10.0.0 이상을 맞춰주시면 정상적으로 실행됩니다. ;)
나그네 | 2010.01.12 18:34 신고 | PERMALINK | EDIT/DEL | REPLY
1픽셀 늘리는 패치를 사용할 경우 에러가 나는 경우가 있습니다. 24비트 bmp 디코드 시에 decode24BitBMP() 메소드에서 "파일의 끝입니다" IOError 가 발생하더군요.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2010.03.04 08:36 신고 | PERMALINK | EDIT/DEL
1픽셀 늘리게 수정한 뒤에 테스트는 못 해봤는데 ^^;;;
감사합니다! ^^
Favicon of http://blog.jidolstar.com BlogIcon 지돌스타 | 2010.01.29 19:00 신고 | PERMALINK | EDIT/DEL | REPLY
좋은 정보야~~~~
Favicon of http://stemp.tistory.com BlogIcon 문정환 | 2010.03.03 12:51 신고 | PERMALINK | EDIT/DEL | REPLY
좋은정보가 많이 있네요 ^^
많은 도움이 될것같습니다 좋은정보 감사드립니다^^
| 2012.09.11 11:34 | PERMALINK | EDIT/DEL | REPLY
비밀댓글입니다
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.06.02 10:26
안녕하세요? 검쉰입니다.
얼마전 한국어도비측에 제출한 기술문서가 드디어 공식사이트에 등록이 되었네요.
기술문서의 제목은 '팝업매니저를 이용한 사용자 정의 컴포넌트의 제작' 입니다.
간단하게 팝업매니저에 대해서 알아보고, 팝업매니저를 이용하여 사용자 정의 컴포넌트를 제작하여 보는 것을 골자로 하고 있습니다.어쩌면 다른 개발자분들이 욕하실지도 모를(?) 퀄리티를 자랑합니다; 욕만 하지 말아주세요. ㅜ_ㅜ


여기를 누르시면 보실 수 있습니다만, 로그인이 필요합니다. ^^;
한국어도비 측의 정책이 그렇다네요. ^^;
올해 안에는 로그인이 필요 없도록 변경될꺼라는 ACC 분들의 말씀도 있으셨으니 조금만 참아주세요 ;)

본문은 소스가 좀 읽기 불편하실텐데, 첨부되어 있는 pdf 파일을 다운받으셔서 보면 더 좋을 것 같습니다.

ps. 리뷰해주신 다른 개발자 분들과 담당자분께 감사드립니다.

ps2. 기념품을 보내주셨네요. :) 큼직한 어도비 마크가 좋군요 ㅎㅎ
잘쓰겠습니다~ :)
신고
Favicon of http://blog.jidolstar.com BlogIcon 지돌스타 | 2009.05.20 23:31 신고 | PERMALINK | EDIT/DEL | REPLY
멋진 글~~~
아주 잘봤습니다.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.05.24 10:00 신고 | PERMALINK | EDIT/DEL
쪼금 부끄럽네요 ㅋ
actionshin | 2009.05.21 00:49 신고 | PERMALINK | EDIT/DEL | REPLY
좋은 글 감사합니다.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.05.24 10:00 신고 | PERMALINK | EDIT/DEL
오랫만입니다. ;)
잘 지내시죠? ^^
Favicon of http://7zelkova.tistory.com BlogIcon 성주 | 2009.05.25 00:13 신고 | PERMALINK | EDIT/DEL | REPLY
좋은 정보 배우고 갑니다~!
역시 형님 블로그 다녀가는 보람이 있어요
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.05.26 10:12 신고 | PERMALINK | EDIT/DEL
잘 지내지? ^^ 조만간 얼굴 한번 보자고~
Favicon of http://www.jinhokim.com BlogIcon 찌노 | 2009.05.25 09:16 신고 | PERMALINK | EDIT/DEL | REPLY
ㅎㅎ 내심 작년생각이 나네요
처음으로 도움을 받았던게 저녀석이었는데 말이죠 ㅎㅎ 벌써 1년이 ~
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.05.26 10:12 신고 | PERMALINK | EDIT/DEL
그러게요~ 벌써 1년~
Favicon of http://jjaeko.tistory.com BlogIcon 째코 | 2009.06.03 16:04 신고 | PERMALINK | EDIT/DEL | REPLY
글 잘봤습니다.
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.15 18:31 신고 | PERMALINK | EDIT/DEL
오홋. 째코님!
Favicon of http://7zelkova.tistory.com BlogIcon 성주 | 2009.06.16 18:31 신고 | PERMALINK | EDIT/DEL | REPLY
기념품은 손톱깎이인가요..
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.17 10:53 신고 | PERMALINK | EDIT/DEL
USB 메모리.. -ㅁ-;;;
Favicon of http://butterguy.tistory.com BlogIcon 버터백통 | 2009.06.18 09:32 신고 | PERMALINK | EDIT/DEL | REPLY
와우~~ 축하합니다~~
기술문서속 사진을 보니...왜 제가 숨이 찰까요...;;;
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.18 22:29 신고 | PERMALINK | EDIT/DEL
사진이 실물과 달라 답답하신가요? ㅎㅎㅎㅎㅎ
BlogIcon 윤석진 | 2009.06.30 02:03 신고 | PERMALINK | EDIT/DEL | REPLY
popup할때 왜 var window:IFlexDisplayObject =

PopUpManager.createPopUp(this, MyLoginForm, true);
IFlexDisplayObject 가 필요한 건가요?

그냥 createPopup하니까 드래그가 안되던데요 이것때문인가요?
아니면.. 디스플레이개체가 필요한데
DisplayObject가 최상위 객체니까 그래서 인터페이스를 받는건가요?? 알려주세요 ㅠ.ㅠ;
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.30 10:15 신고 | PERMALINK | EDIT/DEL
PopupManager 에 createPopUp 메소드가 반환하는 타입이 IFlexDisplayObject 인터페이스를 상속하는 객체이기 때문입니다. 왜냐하면, Flex 에서 사용되는 화면에 보이는 컴포넌트(Visual Component)는 모두 UIComponent를 상속하고 있고 이 UIComponent가 IFlexDisplayObject 인터페이스를 구현하고 있기때문입니다. 이 IFlexDisplayObject 인터페이스에는 width, height, x, y, visible 등이 정의되어 있습니다.
물론, createPopUp 메소드에서 2번째 파라미터로 넣으시는 클래스의 객체로 반환됩니다만, 어떤 클래스를 넣던지 동일하게 사용하기위해서 IFlexDisplayObject 로 받았습니다.
var window:MyLoginForm = PopUpManager.createPopUp(this, MyLoginForm, true) as MyLoginForm;
이렇게 사용도 가능하죠.

그리고 팝업매니저를 통해 팝업하였더라도, 무조건 드래그가 되는 것은 아닙니다. 팝업매니저는 화면에 띄워주는 역할을 할뿐, 드래그기능은 컴포넌트 자체의 기능입니다. TitleWindow의 부모클래스인 Panel 안에 보시면 팝업이 된 경우에 드래그할 수 있도록 기능이 구현되어 있습니다.
Canvas는 아무리 팝업해도 드래그 안된다는 이야기죠. ;)
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.06.30 10:19 신고 | PERMALINK | EDIT/DEL
한참 타이프 하다보니 이전에 관련 글을 적은 적이 있네요 ;)
[Flex] TitleWindow를 이용한 팝업(Popup)에 대한 간단한 설명과 Tip ( http://blog.flashplatform.kr/174 )
이 글 참고해보세요.
BlogIcon 윤석진 | 2009.07.01 01:47 신고 | PERMALINK | EDIT/DEL | REPLY
예.. 감사합니다.. 참고하라고 하신 글은 저번에 읽었는데도 불구하고,, 인터페이스에 대한 이해가 부족해서요..
저는 교육기관을 통해 플렉스를 배우고 있는데. 대부분.. 인터페이스는 아니 완전히 사용안해서요 ..
말씀해주신 것처럼 api를 보듯 차근 차근 상속관계를 짚어주면 좋을텐데
자바수업은 그렇게 api를 권하며 설명해주시는데.. 플렉스는 view 라는 인식이 너무 강해서인지
뭐랄까요.. 원조 디지털 유목민이라고 할까요?
대부분의 강사님들이 C언어부터 마스터하시고.. 많은 경험과 막강한 내공으로 새로운 교육과정을 거침없이
소화하시며 진도나가시지만.. 그 스타일들이 워낙 강하셔서..

답변 감사합니다.
네오랑 | 2009.07.04 11:35 신고 | PERMALINK | EDIT/DEL | REPLY
안녕하세요?? 우선 강의를 진행하신다니, 축하드리구요~~
저도 가서 듣고 싶지만, 시간이....ㅠ.ㅠ

질문을 어디에 써야할지 몰라 염치불구하고 여기에 덧글로 올립니다.
플렉스에서 DataGrid 의 데이터 들을 어떻게 하면 Excel 로 저장할 수 있을까요??
지금 제가 Flex3.0, .Net 3.5(C#을 사용하고 있구요), WebORB 를 사용하고 있어요...
JavaScript 를 이용해서 어떻게 해볼려고 했는데....잘 않되더라구요...ㅠ.ㅠ
그래서 이렇게 도움을 청하고자 찾아왔어요...참고할 예제가 없을까요?? 부탁드립니다...
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.07.06 09:51 신고 | PERMALINK | EDIT/DEL
서버의 도움을 받으셔야됩니다. 검색해보니 다른 방법이 있는 듯 합니다만, 서버측 도움을 받는게 가장 괜찮은 일인듯 하네요.

http://persiacat7.egloos.com/2268496
http://on1456.tistory.com/47
http://cafe.naver.com/flexcomponent/13782

위의 주소 참고하여보세요 ;)
네오랑 | 2009.07.06 11:07 신고 | PERMALINK | EDIT/DEL | REPLY
아직 내용을 보진 않았지만, 이렇게 신경써 주셔서 정말 감사합니다~~
그리고, 메인 사진요, 이전 사진이 더 멋있어 보이시던데..ㅎㅎㅎ 그냥 제 갠적인 생각요`~^^
즐건 하루 되세요~
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret
2009.04.17 01:58
[31가지 사용자 경험 시나리오로 배우는] 실전 UX 디자인

실전 UX 디자인

요즘 읽고 있는 책 중 재미있게 보고 있는 책인 [31가지 사용자 경험 시나리오로 배우는] 실전 UX 디자인 입니다. 구석구석 웹페이지의 디자인에서 '실전'적인 이야기들로 책을 꽉 채우고 있어서 재미있게 읽고 있습니다. 책 내용도 훌륭하고, 한국 실정에 맞게 예제들도 넣어 이해가 쉽게 해주는 번역또한 센스 굿!! +_+

대학교 재학 중 'HCI Lab'에 있으면서 인연이 되어 '사용성', 또는 '시나리오', '페르소나' 같은 단어들과 친숙해질 수 있었죠. 담당교수님께서 스웨덴에서 HCI 를 전공하신 분이라, 강의하시는 HCI 수업도 참 재미있게 듣게 되었고 랩원들과 함께 HCI 학회에 가서 다른 사람들과 이야기도 많이 해보고, 참 즐겁게 HCI 라는 학문과 만났던 것 같습니다.  덕분에, UX(User eXperience) 라는 것에도 관심이 많아진 것 같네요.

아무튼 책의 18장 '현명한 글쓰기창' 에 보면 사용자의 실수에 대한 이야기가 나옵니다. 사용자의 실수로 인한 오류메세지는 그 사용자를 자괴감에 빠지게 만들죠. 사용자를 좌절하지 않게 하기 위해서는 사용자의 실수를 미리 막아주라고 충고 하고 있습니다.  이러한 이야기를 하면서 포카요케 라는 단어를 언급하고 있습니다. (물론 9장 '자동완성의 위력과 함정'에서 먼저 언급하고 있습니다)

포카 요케라는 단어가 무엇일까요? 생소한 단어였습니다만, 책에서 포카 요케ポカヨケ, Poka-yoke는 원래 일본어로 '실수를 피하는'이란 뜻이다. 라고 설명을 하고 있어서 이해가 좀 더 쉬웠습니다. 아래는 위키피디아에서 찾은 포카 요케의 설명입니다.

포카 요케(ポカヨケ, Poka-yoke)는 원래 일본어로 '실수를 피하는'이란 뜻이다. 이 용어는 토요타시게오 신고에 의해 품질 관리의 측면에서 실수를 방지하도록 행동을 제한하거나 정확한 동작을 수행하게 끔하도록 강제하는 여러 가지 제한점을 만들어 실패를 방지하는 방법을 말하는 용어가 되었다.

예를 들어 자동차에서 기어를 주차 상태 위치인 “P”로 놓지 않으면 시동이 걸리지 않도록 만들어 운전자가 자동차를 안전하지않은 상태로 놔두고 나가는 것을 방지하도록 한다. 또한 컴퓨터에서는 USB 장치의 플러그를 꼽을 때 뒤집어진 상태로 꼽으려고하면 안돼도록 디자인 되어 있다. 인지 심리학인간과 컴퓨터 상호작용 분야에서도 이를 이용하여 여러 가지 실수를 방지하는 디자인 원리의 하나로 받아들여져서 이용하고 있다.

위키백과의 포카 요케에서 발췌


책에서 포카요케는 실수방지장치 오류탐색기 2종류가 있다고 이야기 하고 있습니다.

  • 실수방지장치 - 사용자가 실수하지 않도록 미리 오류를 막아주는 역할
  • 오류탐색기    -  사용자가 정보를 잘못 입력하는 즉시 바로 오류를 알려주는 역할

Flex 에서도 이러한 역할을 하는 것들이 존재합니다.

만약 회원가입 화면에서 사용자의 이름을 입력 받는다고 할 때에 사용자의 이름을 넣는 TextInput에 숫자가 입력될 필요는 없겠죠? 한글과 영어만 입력되도록, 또는 한국인만을 대상으로 한다면 한글만 입력받아야 하겠습니다. 이러한 것을 실수방지장치라고 부를 수 있겠네요.

상기 사항에 대해서는 입력받는 글자들에 대해 제한을 걸 수 있는 restrict 라는 속성이 있습니다.




또한 TextInput 컴포넌트를 상속해서 만든 PromptingTextInput 같은 유용한 컴포넌트 있습니다. 오픈소스 컴포넌트들을 모아놓은 FlexLib 에 있는 컴포넌트 중에 하나 입니다. 사용자가 입력하기 전에 프롬프트를 통해 무엇을 입력해야 되는지 입력할 수 있습니다. 개인적으로 매우 좋아하는 컴포넌트 입니다.





그리고 오류탐색기로는 Validator 가 있습니다. 사용자의 잘못된 입력을 메세지로 알려주는 방식입니다. JavaScript 에 익숙한 분들은 각 컴포넌트에 값이 비어있는지 확인하여 Alert을 출력하는 식으로 작성하는 경우도 많은데, 보다 직관적으로 유효성을 컴포넌트에 표시해주는 Validator가 상당히 더 좋은 방법임에 틀림 없습니다.이러한 Validator를 상속받아 새로운 Validator 를 작성하는 것은 제가 이전에 쓴 포스트인 [Flex] 주민등록번호 Validator 를 참고하시면 되겠습니다.

책의 15장 '불량 제로 실수방지장치'에 나오는 스프링노트의 회원가입페이지의 예제를 보면 아래와 같은 이미지가 있습니다.


사용하고자 하는 아이디를 입력 시 아이디로 쓰이기에 적합한지 알려주고 있습니다.  Flex에서는 Validator를 사용하면 비슷한 효과를 얻을 수 있습니다만, 사용자가 입력하는 도중에는 Validator가 작동하지 않습니다. 마우스를 오버해야지만 툴팁이 화면에 나타나게 되는데, 이를 제어할 방법은 없습니다.
이런 상황이 생기는 이유를 알기 위해 Validator 와 UIComponent 와의 동작방식에 대해 알아보도록 합시다.

Validator 에서 입력받은 데이터를 검증하여 ValidationResultEvent 를 발생시키게 되는데 이 때 Validator에 등록해 놓은 UIComponentvalidationResultHandler(event:ValidationResultEvent)로 리스너를 등록해놓아 결과를 전달해줍니다.
이 메소드가 받는 ValidationResultEvent에는 에러메세지가 들어있는데, 이를 UIComponent에서는 _errorString 이라는 변수에 담고 ToolTipManager의 mx_internal로 선언되어 있는 registerErrorString(target:DisplayObject, errorString:String) 메소드를 이용하여 에러메세지를 등록합니다. ToolTipManager에 에러메세지를 등록하게 되면 ToolTipManager에서 해당 컴포넌트에 MOUSE_OVER, MOUSE_OUT 이벤트 핸들러를 등록해놨다가,  해당 UIComponent에 마우스 오버시 에러메세지가 적힌 툴팁이 출력되게 됩니다.


이로인해 마우스를 해당 컴포넌트에 올려놓지 않으면 툴팁이 보이지 않는다는 문제가 생기게 됩니다. 해당 문제점은 어도비의 Bug and Issue Management System(이슈트래킹 시스템)이슈로 등록이 되어 있는 상태입니다. 꼭 해당 속성이 생겼으면 좋겠네요. (투표 많이 해주세요~)
해당 문제를 해결하기 위해 세계 각국의 Flex 개발자들이 내놓은 방안 중에는, CustomToolTipManagerImpl 를 작성하여 직접 속성을 추가한 분들도 계시고 간단하게 다음과 같이 해결한 분들도 계십니다.



하지만 저는 테스트 해보니 제가 원하는 동작은 되질 않네요 =ㅁ=;; 아마도 ToolTipManager 에서 해당 컴포넌트를 찾아 이전과 다른지 비교하는 구분에서 단순히 MOUSER_OVER 이벤트로는 정상적인 교체가 이루어 지지 않는 듯 합니다.

Validator 를 사용하지 않고, Flex 에서 유효성을 검사하는데 좋은 방법에 대해서는 Aral balkan의 블로그에 Better form validation in Flex 라는 포스트를 참고하시면 좋겠습니다. 글의 요지는 TextInput에 값이 비어있을때 경고메세지를 담은 ToolTip을 직접 화면에 생성해주는 식이네요. 참 좋은 아이디어 같습니다.

또 다른 Flex에서의 포카요케가 있다면 트랙백으로 남겨주시면 감사하겠습니다. ;)

ps. 왠지 쓸 때 없는 글을 쓴듯한.. ^^;;




신고
Favicon of http://koko8829.tistory.com BlogIcon 열이아빠 | 2009.04.17 09:26 신고 | PERMALINK | EDIT/DEL | REPLY
제목만 보고 포카 요케란 단어를 어디선가 들어본것 같은데..라고 생각했는데
책에 있는 내용이군요. 마침 그부분까지 보고 있습니다. ^^
그리고 위에 올려주신 샘플을 끄적거리다가 알게 된 새로운 사실..ㅠㅠ
티스토리에서는 키보드로 네비게이션이 가능한 코드가 있더군요.
Q, A, S, Z, X, C가 각각 다른 액션을 담당하고 있는데
이게 html 폼에 입력이 되는 경우에는 이벤트를 처리하지 않는데
swf폼에 입력하는 항목은 이벤트가 처리가 되네요. ㄷㄷ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.04.17 10:18 신고 | PERMALINK | EDIT/DEL
티스토리에 swf 파일 올리면 wmode 가 transparent 로 들어가서 문제가 되었던 듯 합니다.
파폭에서 한글입력이 안되어서 window 로 바꿨더니 swf 안에서 Q, A 같은 네비게이션 작동 안하네요 ㅎ
Favicon of http://okgosu.tistory.com BlogIcon okgosu | 2009.04.17 11:23 신고 | PERMALINK | EDIT/DEL | REPLY
인터렉션 디자인도 아직 못읽었는데...빨랑 봐야겠네요...^^

with okgosu (-..-)a
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.04.18 22:02 신고 | PERMALINK | EDIT/DEL
인터렉션 디자인은 회사 도서로 신청했는데 5월이나 되야 올듯 하네요 ㅎㅎ
위키북스에서 나온 UX 디자인 커뮤니케이션도 같이 샀는데 이제 읽어야될듯 ㅎ
Favicon of http://randorno.tistory.com BlogIcon 란도르노 | 2009.04.17 15:24 신고 | PERMALINK | EDIT/DEL | REPLY
프로젝트 중 맞닥뜨린 버그가 아직 해결이 안됐네요.
restrict를 이용해서 영문만 타이핑 가능하도록 제한을 둔 상태에서 영문을 작성한 후
한/영 변환키를 누르고 한글을 입력하면 백스페이스를 누른 것 같이
입력된 텍스트가 지워지는 버그가 있습니다.
결국 alwaysShowSelection으로 우회하기 신공를 시전해서 넘겼었지요.. ㅠ_ㅠ
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.04.18 22:03 신고 | PERMALINK | EDIT/DEL
저도 같은 버그를 겪어봤는데, 문제시 되지 않아서 그냥 넘어갔던 기억이 ^^;
버그 보고를 해야겠네요 ㅎㅎ
Favicon of http://hhjae84.tistory.com BlogIcon 모지씨 | 2009.04.20 06:10 신고 | PERMALINK | EDIT/DEL | REPLY
두번째 줄에 구석수석이란 오타를 보고...
잠시 구석이가 수석인가...멍때렸다는 -,.-
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.04.21 16:00 신고 | PERMALINK | EDIT/DEL
오타났네 ㅋ =ㅁ= ㅋㅋ
수정했음. 감사!!
Favicon of http://jidolstar.com/blog BlogIcon 지돌스타 | 2009.04.21 15:04 신고 | PERMALINK | EDIT/DEL | REPLY
아~ 글 멋쪄라
Favicon of http://blog.flashplatform.kr BlogIcon 검쉰 | 2009.04.21 16:00 신고 | PERMALINK | EDIT/DEL
형님이 더 멋지십니다. ㅎ
박스농사 | 2009.04.30 10:38 신고 | PERMALINK | EDIT/DEL | REPLY
아~ 글 멋짐
Favicon of http://cafe.naver.com/codestudy BlogIcon 이정칠 | 2009.04.30 12:17 신고 | PERMALINK | EDIT/DEL | REPLY
UX에 대해 무척 관심이 많은 1인 ^^
이미 예상되는 유저의 실수을 사전에 미리 차단해주는 배려가
요즘 개발자들이 고려해야할 필수 사항이죠 ^^

언제 시간되면 읽어봐야겠습니다.
감사합니다.
무명소녀 | 2009.07.02 10:06 신고 | PERMALINK | EDIT/DEL | REPLY
포카요케는 예전에 통계학강의 들을 때 품질관리 과목 들을때 나왔던 거였는디... (올해는 결혼땜시 1년 휴학 --ㅋ)
오랜만에 다시 보네. ㅎㅎ 나도 이책 한번 봐야겠다. 전산과 이수할때 4학년 과목에 있었는데. HCI 과목 넘 재밌음.
- 덧글 좀..(굽신굽신) : 장문의 덧글은 트랙백을 이용해주세요 ;^)
Name
Password
Homepage
Secret

티스토리 툴바