Flex2011. 2. 25. 15:27
얼마만의 포스팅인가...

Flex의 DataGrid를 사용하다 보면 데이터의 갯수대로 row의 수를 정해야 할 경우가 생긴다.

그럴땐 데이터 그리드를 만들어 놓고...

데이터 그리드에 dataProvide의객체가 ArrayCollection 이라면..

ArrayCollection의 수대로 rowCount를 설정해주면 된다.

ArrayCollection의 데이터를 데이터 그리드에 바인드 해줬을텐데..

그러면 ArrayCollection에 데이터가 들어올때

스크립트에

데이터그리드ID.rowCount = 데이터를담은배열이나객체.length;
데이터그리드ID.height = 데이터그리드ID.rowCount * 데이터그리드ID.rowHeight + 데이터그리드ID.headerHeight;

이러면 데이터의 수만큼 데이터 그리드를 만들어 준다.

그리고 데이터가 없을때엔 밑에 레이블에 데이터가 없습니다라고 표시한것을 만들어 두고...

데이터의 길이가 0일때 보여주게만 하면 된다.

쉽다..쉽다..쉽다...후우...젠장...
Posted by Z700zZz
Flex2010. 10. 28. 17:29
한화면안에서 여러 화면을 바꾸는 기술인 ViewStack과 States...!

ViewStack은 한화면안에 여러개의 화면을 준비 시켰다가 사용자가 원하는 화면을 보여준다.

States는 한화면안에서 화면을 사용자가 원하는 화면으로 항목등을 변경하여 보여준다.

음 말로 설명하려니 뭔가 좀 어설픈 감이 없지않아 있다...

<mx:ViewStack id="vs" width="100%">

<a:vs1 id="vs1" label="뷰스택1" />

<a:vs2 id="vs2" label="뷰스택2" />

<a:vs3 id="vs3" label="뷰스택3" />

</mx:ViewStack>


코드를 보면 각기 다른 페이지들을 작업하고 ViewStack안에 각자의 id와 함께 추가해주고...


vs.selectedChild = vs1;


이러한 코드를 화면이 바뀌고자하는 타이밍에 넣어주면 그화면으로 변경된다.


<s:states>

<s:State name="state1" />

<s:State name="state2" />

</s:states>


이번엔 states의 설명이다.


states안에 State들을 등록 시켜놓는다.


<mx:Button label="button1" includeIn="state1"/>

<mx:Button label="button2" includeIn="state2"/>


다음 코드를 보면 버튼안에 includeIn에 스테이트의 네임이 들어가있는것을 볼수 있다.


currentState = "state1";


역시 화면에 뭔가 변화를 주거나 할때의 이벤트에 이 코드를 넣어주면 된다.


스테이트의 선택을 state1으로 했으니 includeIn="state1"으로 한 button1만 보일것이다.


ViewStack과 States...


한화면 안에서 화면이 바뀌는건 비슷하지만...


전자는 화면 전체가 페이지 단위로 바귀는 것이고...후자는 한화면안에서 여러 구성요소들의 상태가 바뀌는 것이다.


여기서 원하는 화면으로 바뀌게 하는 명령어...


ViewStack은 ViewStack의ID.selectedChild = ViewStack에 등록한 페이지의 ID...


States는 currentState = "States에 등록해놓은 name"; 이것들을 기억해 두자.


아직 아는것이 없어서 설명을 요정도로 밖에 못하는게 아쉽다..-_-;;

Posted by Z700zZz
Flex2010. 10. 25. 15:14
오늘 일을 하다가 알게 된 것...

ToggleButtonBar에 DataProvider를 이용하여 배열 비슷 한것들을 묶어주면 버튼이 생성 되는것들은 다들 알고 있을것이다.

오늘 하려던 프로그래밍은 상단에 버튼이 1렬 횡대로 세개 정도가 존재하고 그 버튼을 누를때마다 버튼 밑 부분...

쉽게말해 해당하는 페이지가 변하는 그런것을 만들려고 하였다.

버튼은 그대로 이고 밑부분만 해당 내용으로 바뀌는 그런 페이지.

처음에 짜던 소스는...

<mx:HBox>

<s:Button />

<s:Button />

<s:Button />

</mx:HBox>

<mx:ViewStack>

<notice:NewsList />

<notice:NewsList />

<notice:NewsList />

</mx:ViewStack>

버튼을 세개 만들고 그 밑에 ViewStack을 위치하게 하여 버튼 클릭시 마다 ViewStack이 바뀌며 원하는 정보를 보여준다.

여기서 좀더 간단하게 만드는 방법(?)을 배웠다...

<s:VGroup gap="0">

<mx:ToggleButtonBar dataProvider="{vsNotice}" />

<mx:ViewStack id="vsNotice">

<number:One label="one" />

<number:Two label="two" />

<number:Three label="three" />

</mx:ViewStack>

</s:VGroup>


첫번째 소스는 버튼을 세개 만들어 줘야 했지만...두번째 코드는 뷰스택의 수 만큼 ToggleButtonBar를 만드는 코드이다.


버튼의 Label에는 각각의 ViewStack의 label이 들어가게 된다.


훨씬더 간단하지 않은가??ㅋ


이런 것들을 보면 Flex...음....


Flex시작 4주차 첫날...!

'Flex' 카테고리의 다른 글

Flex Button에 대하여..  (0) 2013.04.01
Flex DataGrid rowCount를 데이터의 갯수대로 생성하기.  (0) 2011.02.25
Flash Builder 컴파일 시 에러...!  (0) 2010.11.05
Flex의 ViewStack과 States...!  (0) 2010.10.28
Flex ComboBox CSS...!  (0) 2010.10.22
Posted by Z700zZz
Flex2010. 10. 22. 15:55

Flex에서 ComboBox에 CSS로 스타일 입히는 과정에서 알게 된 것...


ComboBox에 스타일을 줄려고 CSS에 속성등을 적어넣고 적용 시켰다.


이때 적용 하려했던건 font-family와 font-size...


.comboBox{

alternating-item-colorswhite, #EEEEEE;

 font-family"_sans";

 font-size11pt;

}


왜 적용이 안될까 하다가 찾아보니...


따로 지정을 해줘야 한다...



.filterComboBox{

alternating-item-colorswhite, #EEEEEE;

drop-down-style-name"comboBoxDropDownStyle";

text-input-style-name"comboBoxTextInputStyle";

}


.comboBoxDropDownStyle{

font-family"_sans";

font-size11pt;

}


.comboBoxTextInputStyle{

font-family"_sans";

font-size11pt;

}


이런식으로 말이다.


drop-down-style-name 이건 ComboBox 클릭시 밑에 나오는 리스트에 해당하는 스타일이고,


text-input-style-name 일반 상태의 ComboBox 해당하는 스타일이다.


그리고 한가지더 alternating-item-colors 대한 설명...


ComboBox클릭시 리스트가 나오게 되는데 리스트에 줄마다 배경색을 달리 주고 싶을때 사용하는 속성이다.


두가지 이상의 색을 넣어주면 적용이 된다.

Posted by Z700zZz