Flex의 Button을 쓰다가 알게 된 사실.
<s:ToggleButton id="moreBtn" name="moreBtn" x="347" y="282" width="43" height="50" mouseOver="upsizeBg(event)" mouseOut="downsizeBg(event)" click="showMorePoster(event)"......
버튼은 위와 같이 선언을 한다.
여기서 width와 height를 설정해준다.
<s:states>
<s:State name="up" />
<s:State name="over" />
<s:State name="down" />
<s:State name="disabled" />
<s:State name="upAndSelected" />
<s:State name="overAndSelected" />
<s:State name="downAndSelected" />
<s:State name="disabledAndSelected" />
</s:states>
<!-- 버튼 이미지 -->
<s:Image source.up="@Embed('../assets/images/default/vod_btn_01_n.png')"
source.over="@Embed('../assets/images/style/vod_btn_02_f.png')"
source.down="@Embed('../assets/images/style/vod_btn_02_f.png')"....
위는 SkinClass의 버튼의 States에 따른 이미지 설정부분이다.
여기서 중요한것은 Button의 선언 부분에서 width와 height를 설정해 두었다고 하더라도 SkinClass나 Button의 이미지 설정 부분에서 Button의 설정된 사이즈보다 큰 이미지를 설정해주면 기존의 width와 height의 사이즈가 아닌 이미지의 사이즈만큼 버튼의 영역이 설정 되어 버린다.
그래서 버튼 하나에 여러가지의 이미지가 들어가게 하는 경우에는 디자인 가이드에 지정된 사이즈 대로 설정을 해두었는데도 그 영역 바깥에서도 버튼이 인식되어 오작동을 일으키는 경우가 생겨 버린다. 아니면 버튼이 서로 붙어 있는 상황에서 나중에 선언된 버튼이 다른 버튼을 덮어 버려 그 영역을 침범하는 경우도 생긴다. 이럴 경우에 나는 원래의 버튼 영역 만큼 투명한 이미지를 버튼위에 올리고 이미지에 이벤트를 줘서 해결했다.
'Flex' 카테고리의 다른 글
Flex Build Error(The Flash Builder debugger failed to connect to the running application.) (0) | 2013.05.02 |
---|---|
Flex DataGrid rowCount를 데이터의 갯수대로 생성하기. (0) | 2011.02.25 |
Flash Builder 컴파일 시 에러...! (0) | 2010.11.05 |
Flex의 ViewStack과 States...! (0) | 2010.10.28 |
Flex...ToggleButtonBar & ViewStack...! (0) | 2010.10.25 |