hoony's web study

728x90
반응형


flex에서 image를 축소 확대하는것에 대한 예제를 많이 보던중 구현방식에 대한것을 찾아서 이렇게 정리를 해본다.
flex에서 내가 찾고 싶던것은 이런것이 아니라 이미지사이즈를 얻어와서 이미지사이즈에 대해
비율적으로 줄이면서 하고 싶었는데 .. 암튼 이 예제가 울팀 프로젝트에 작으나마 힘이 되길 바라며..
예제 소스 및 실행 화면을 넘긴다.

예제소스 를 보면 Resize 개체가 있다.
이 개체에서 id를 부여하고 target에 이름을 명명하여 이벤트를 핸들링하면
간단히 이미지가 resize를 할 수 있다.

<mx:Resize id="expand" target="{img}" widthTo="100" heightTo="200"/>
여기서 보는바와 같이 이때 Resize개체의 widthTo와 heightTo를 이용하여 현재 설정된 이미지의
크기를 제어할 수 있다.

다음은 어도비 플렉스 도움말에 있던것을 발췌하여 넣어본다
<?xml version="1.0"?>
<!-- Simple example to demonstrate the Resize effect. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Resize id="expand" target="{img}" widthTo="100" heightTo="200"/>
    <mx:Resize id="contract" target="{img}" widthTo="30" heightTo="60"/>

    <mx:Panel title="Resize Effect Example" width="100%" height="100%"
        paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">

        <mx:Text width="100%" color="blue"
            text="Use the Button controls to resize the image."/>

        <mx:Image id="img" width="30" height="60"
            source="@Embed(source='assets/pic/Nokia_6630.gif')"/>

        <mx:ControlBar>
            <mx:Button label="Expand" click="expand.end(); expand.play();"/>
            <mx:Button label="Contract" click="contract.end(); contract.play();"/>
        </mx:ControlBar>

    </mx:Panel>
</mx:Application>

[Flash] http://islet4you.tistory.com/attachment/ck3.swf



[출처: Adobe flex 도움말]

다음엔 이 예제를 이용한 포토갤러리를 구현한 예제를 만들어서 올릴까한다. ^^


728x90

공유하기

facebook twitter kakaoTalk kakaostory naver band
loading