flex实现图片根据鼠标的滚动放大或缩小（以鼠标的的位置为中心放大缩小）

最新推荐文章于 2024-08-23 17:09:40 发布

卑鄙的我1

最新推荐文章于 2024-08-23 17:09:40 发布

阅读量2.9k

点赞数 1

本文链接：https://blog.csdn.net/xuhong964388535/article/details/45532787

版权

该博客介绍了如何使用Flex创建一个ImageView对象，并通过ByteArrayImage类加载二进制图片数据。当鼠标滚动时，图片会以鼠标位置为中心进行放大或缩小。文章提供了详细的代码实现，包括设置图片初始大小、根据比例调整图片尺寸以及鼠标滚轮事件处理。源码链接已给出，可供下载参考。

摘要由CSDN通过智能技术生成

第一步：

var imageCanvas:ImageView = new ImageView();//创建ImageView对象

imageCanvas.img.source="tuzhi/1.jpg";//指定要显示的图片路径

第二步：ImageView.mxml文件--->此类是主要方法

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" initialize="app(event)" width="600" height="500" backgroundAlpha="1" backgroundColor="#FFFFFF" borderStyle="solid" cornerRadius="0" borderColor="#8D8D8D" borderThickness="1" horizontalScrollPolicy="off" verticalScrollPolicy="off" xmlns:util="actionscript.util.*">
<mx:Script>
<![CDATA[
import actionscript.util.RepeatBackground;

import mx.controls.Alert;
import mx.effects.Zoom;
import mx.events.FlexEvent;
import mx.events.MoveEvent;
private var rotateDeg:Number=0;
private var oldX:Number,oldY:Number;
public var titleText:String;
public var mouseWheelFlag:Boolean = true;

protected function app(event:FlexEvent):void
{
this.toptitle.setStyle("borderSkin",RepeatBackground);
title.text = titleText;
if(this.mouseWheelFlag){
img.addEventListener(MouseEvent.MOUSE_DOWN, imgMouseDown); //鼠标按下事件
img.addEventListener(MouseEvent.MOUSE_WHEEL, imgZoom);//鼠标滚动事件
img.addEventListener(MouseEvent.MOUSE_MOVE,imgMouseMove); //鼠标移动事件

}
//picCanvas.height = this.height - 26;
closeBtn.x = this.width - 24;
resizeBtn.x = this.closeBtn.x - 18;
img.width = this.width;
img.height = this.height;
img.x=(this.width-img.width)/2;
img.y=(this.height-img.height)/2;

//this.x = 0;
//this.y = 0;
}

public function fullHander(evn:FullScreenEvent):void
{
if(evn.fullScreen)
{
this.width=stage.width;
this.height=stage.height;
this.x=(Capab