如何使用Flex Zoom Effect

最新推荐文章于 2023-05-29 17:59:40 发布

iteye_19580

最新推荐文章于 2023-05-29 17:59:40 发布

阅读量198

点赞数

分类专栏： Flex Effects 文章标签： Flex Flash XML

Flex Effects 专栏收录该内容

21 篇文章

订阅专栏

本文介绍了一个简单的FlexZoom效果示例，展示了如何通过鼠标悬停来放大和缩小图像。通过使用Flash事件和FlexZoomEffect组件，可以轻松实现图像的缩放功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<?xml version="1.0" encoding="utf-8"?>
<!-- Simple example to demonstrate the Zoom effect. -->
<!--
	如何使用Flex Zoom Effect
	MyShareBook.cn 翻译
-->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[		
            import flash.events.MouseEvent;

            public function doZoom(event:MouseEvent):void {
                if (zoomAll.isPlaying) {
                    zoomAll.reverse();
                }
                else {
                    // If this is a ROLL_OUT event, play the effect backwards. 
                    // If this is a ROLL_OVER event, play the effect forwards.
                    zoomAll.play([event.target], event.type == MouseEvent.ROLL_OUT ? true : false);
                }
            }
        ]]>	
    </mx:Script>

    <mx:Zoom id="zoomAll" zoomWidthTo="1" zoomHeightTo="1" zoomWidthFrom=".5" zoomHeightFrom=".5"  />

    <mx:Panel title="Zoom Effect Example" width="95%" height="95%" horizontalAlign="center"
        paddingTop="5" paddingLeft="10" paddingRight="10" paddingBottom="5">

        <mx:Text width="100%" color="blue"
            text="Move the mouse over the image to enlarge it. Move the mouse off of the image to shrink it."/>

        <mx:Image id="img"
            source="@Embed(source='assets/Nokia_6630.png')"
            scaleX=".5" scaleY=".5"
            rollOver="doZoom(event)"
            rollOut="doZoom(event)"/>

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