<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
      xmlns:s="library://ns.adobe.com/flex/spark"
      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
 <s:layout>
  <s:BasicLayout/>
 </s:layout>
 <fx:Declarations>
  <!-- 将非可视元素(例如服务、值对象)放在此处 -->
 </fx:Declarations>
  <fx:Script>
   <![CDATA[
   private var oldX:Number; //拖动开始是的坐标
   private var oldY:Number;
   
   //拖动开始
   private function dragStart(event:MouseEvent):void
   {
   oldX=event.stageX; //相对Application的坐标
   oldY=event.stageY;
   }
   
   //拖动结束
   private function dragEnd(event:MouseEvent):void
   {
   lbl.text="Local (x,y):" + event.localX.toString() + "," + event.localX.toString(); //相对图片的坐标
   lbl2.text="Stage (x,y):" + event.stageX.toString() + "," + event.stageY.toString(); //相对Application的坐标
   if (event.buttonDown)
   { //如果鼠标在移动过程中并且按下,也就是说鼠标的拖动事件。
   var x:Number=event.stageX - oldX; //相对Application的坐标的移动量
   var y:Number=event.stageY - oldY;
   oldX=event.stageX; //更新拖动开始是的坐标
   oldY=event.stageY;
   img.move(img.x + x, img.y + y); //img是 Image的id,如果扩展到其他组件,改这里就可以了。
   }
   }
   ]]>
  </fx:Script>
  <mx:Label x="10"
      y="10"
      text=""
      id="lbl"/>
  <mx:Label x="10"
      y="27"
      text=""
      id="lbl2"/>
  <mx:Panel x="257"
      y="71"
      width="700"
      height="80%"
      layout="absolute"
      horizontalScrollPolicy="off"
      verticalScrollPolicy="off"
      title="图片在面板中的拖动例子"
      fontSize="12">
   <mx:Image id="img"
       x="0"
       y="0"
       source="test.JPG"
       mouseMove="dragEnd(event)"
       mouseDown="dragStart(event)"/>
  </mx:Panel>
 
</s:Application>

http://blog.csdn.net/voyage_mh1987/article/details/7990139

flex拖动图片的更多相关文章

  1. Android BaseAdapter Gallery 画廊视图 (左右拖动图片列表拖至中间时图片放大显示)

    画廊视图使用Gallery表示,能够按水平方向显示内容,并且可以手指直接拖动图片和移动,一般用来浏览图片,,被选中的选项位于中间,并且可以响应事件显示信息.在使用画廊视图时,首先在屏幕上添加Galle ...

  2. Unity UGUI实现鼠标拖动图片

    using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; ...

  3. 基于js鼠标拖动图片排序

    分享一款基于js的图片排序效果.鼠标拖动图片,重新排列图片的排列顺序.该插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线 ...

  4. htm5手机端实现拖动图片

    htm5手机端实现拖动图片 <pre> <!doctype html><html><head> <title>Mobile Cookbook ...

  5. 使用Flex实现图片旋转。

    当用flex实现图片旋转的时候,遇到了这样的问题:截图之后,图片还是会继续旋转,应该是canvas这个还有旋转的角度,所以看到效果跟你截图保存下来的效果不一样. 函数: 角度转换为弧度,这里面涉及到了 ...

  6. FLEX拖动时复制图片

    <?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="ht ...

  7. 微信小程序 拖动图片一边进行截取

    简单实现一个画布截取图片的功能 原始图片超出指定尺寸,会进行隐藏,利用短边的宽度截取长边的宽度,拖动生成指定内容的图片 横图 竖图 var box_width = 600; //截取框尺寸 var b ...

  8. flex 实现图片播放 方案二 把临时3张图片预加载放入内存

    该方案,是预加载:前一张,当前,下一张图片,一共3张图片放入内存中.这样对内存的消耗可以非常小,加载之后的图片就释放内存. 下面示例一个是类ImagePlayers,一个是index.mxml pac ...

  9. flex 实现图片播放 方案一 图片全部预加载放内存

    这种方案,对于web的应用有局限性,在图片量比较多,比较大的时候,就会爆浏览器异常.一般建议轻量级的采用这种方案. <?xml version="1.0" encoding= ...

随机推荐

  1. Python 面向对象(一)

    面向过程编程 (Procedural Programming) Prodcedural programming uses a list of instructions to tell the comp ...

  2. 初探diskstats

    内核很多重要子系统均通过proc文件的方式,将自身的一些统计信息输出,方便最终用户查看各子系统的运行状态,这些统计信息被称为metrics. 直接查看metrics并不能获取到有用的信息,一般都是由特 ...

  3. Vue2学习笔记:html属性

    1.使用 <!DOCTYPE html> <html> <head> <title></title> <meta charset=&q ...

  4. 0. 跟踪标记 (Trace Flag) 简介

    一. 什么是跟踪标记 SQL Server 跟踪标记(Trace Flag),像是一个开关,可用来自定义SQL Server的某种行为或特性,在性能诊断,系统调试等方面较为常用.比如:开启1204或1 ...

  5. IP地址编址

    比特:一比特就是一个数字,1或者0. 字节:以字节是7比特或者8比特,取决于是否使用奇偶校验 八位组:8比特构成 网络地址:用来将数据包发送到远端网路 比如10.0.0.0 广播地址:将信息发送给网络 ...

  6. 使用Ajax无刷新页面登录

    <script> window.onload = function () { var myname = document.getElementById("uname") ...

  7. 数据结构&堆&heap&priority_queue&实现

    目录 什么是堆? 大根堆 小根堆 堆的操作 STL queue 什么是堆? 堆是一种数据结构,可以用来实现优先队列 大根堆 大根堆,顾名思义就是根节点最大.我们先用小根堆的建堆过程学习堆的思想. 小根 ...

  8. 关于第三次寒假作业之C++Calculator项目的情况:

    一.仓库地址: object-oriented: 二.作业要求: Calculator: 三.完成本次作业的情况及感受: 刚接触到这个题目的时候,自己就是那丈二的和尚,摸不着头脑,由于自己视频找得比较 ...

  9. CSS控制列表与导航的制作

    <style type="text/css"> /*body默认是有边距的*/ body{ margin:0;} /*ul默认是有边距的所以先将边距去掉IE78只要加上 ...

  10. Python time.md

    time模块 Comparing Clocks time.clock():在Unix 上,返回当前的处理器时间,以浮点数秒数表示. time.monotonic():返回一个单调时钟的值(在分秒内), ...