继续体会1中的目标
移动canvas上的多个surface中的一个,通过eventcanvas调用testmouseevent。只有当鼠标按在“动”字上,或按在矩形框上才能触发鼠标的MouseEvent.MOUSE_DOWN事件,按在surface的任何空白处都没有作用。继续探索在surface上任意位置 按下鼠标如何响应事件......
testmouseevent.as代码如下
package eventtest
{
import com.degrafa.GeometryGroup;
import com.degrafa.GraphicText;
import com.degrafa.Surface;
import com.degrafa.geometry.RegularRectangle;
import com.degrafa.paint.SolidStroke;
import flash.events.MouseEvent;
import flash.geom.Matrix;
import flash.geom.Point;
import mx.controls.Alert;
public class testmouseevent extends Surface
{
[Bindable]
public var WhiteStroke:SolidStroke = new SolidStroke();
protected var eachcolggw:GeometryGroup = new GeometryGroup();//每个列都需要一个gg,一个边框矩形
protected var eachcolrecw:RegularRectangle;
private var isMouseDown:Boolean = false;
private var frompoint:Point=new Point;
private var topoint:Point =new Point;
public function testmouseevent()
{
super();
addEventListener(MouseEvent.MOUSE_DOWN, OnMouseDown);
addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
addEventListener(MouseEvent.MOUSE_MOVE, OnMouseMove);
/* addEventListener(MouseEvent.MOUSE_UP, OnMouseUp);
addEventListener(MouseEvent.MOUSE_OVER, onMouseIn); */
}
public function loadevent():void
{
eachcolggw.x = 0;
eachcolggw.y = 10;
eachcolggw.height=1000;
eachcolrecw= new RegularRectangle(0, 0,100, 1000);
eachcolrecw.stroke = WhiteStroke;
eachcolggw.geometryCollection.addItem(eachcolrecw);
var gt:GraphicText=new GraphicText;
gt.text='动';
gt.x=0;
gt.y=2;
eachcolggw.addChild(gt);
eachcolggw.target = this;
eachcolggw.addEventListener(MouseEvent.CLICK,this.ggclick);
/* eachcolggw.addEventListener(MouseEvent.MOUSE_OVER,this.onMouseIn);
eachcolggw.addEventListener(MouseEvent.MOUSE_OUT,this.onMouseOut); */
}
public function ggclick(event:MouseEvent):void
{
Alert.show("click gg");
}
//鼠标移动响应事件
public function OnMouseMove(event:MouseEvent):void
{
//如果鼠标左键按下
if (isMouseDown)
{
//计算移动距离并更新矩阵
topoint.x= event.stageX;
topoint.y= event.stageY;
var finalm:Matrix= new Matrix;
finalm.tx = topoint.x; //- frompoint.x;
finalm.ty = topoint.y; //- frompoint.y;
this.transform.matrix=finalm;
trace(finalm.tx);
}
//trace("MOUSE move surface");
trace("MOUSE move surface");
}
//鼠标抬起响应事件
public function OnMouseUp(event:MouseEvent):void
{
//如果鼠标左键按下
if (isMouseDown)
{
topoint.x= event.stageX;
topoint.y= event.stageY;
isMouseDown = false;
trace(topoint.x);
//Alert.show(topoint.x.toString());
}
trace("MOUSE up surface");
}
protected function onMouseIn(even:MouseEvent):void
{
// if(even.currentTarget is GeometryGroup)
if(even.currentTarget is Surface)
WhiteStroke.color=0x00ff00;
}
protected function onMouseOut(even:MouseEvent):void
{
// if(even.currentTarget is GeometryGroup)
if(even.currentTarget is Surface)
WhiteStroke.color=0x000000;
}
private function OnMouseDown(event:MouseEvent):void {
trace("MOUSE DOWN surface");
// Alert.show("MOUSE DOWN surface");
isMouseDown = true;
frompoint.x=event.stageX;
frompoint.y=event.stageY;
trace(frompoint.x);
}
}
}
分享到:
相关推荐
学习DeGrafa绘图工具,首先需要掌握SVG的基本概念和语法,理解如何定义路径、形状和群组等元素。接下来,你需要了解Flex的基础知识,包括组件使用、布局管理、事件处理机制等。通过实践,你可以逐步熟悉DeGrafa的API...
5. Flex 和 Degrafa API:掌握 Degrafa 提供的图形操作方法,以及FLEX的组件和事件处理机制。 综上所述,利用 Degrafa 3.1 源码配合 FLEX,开发者可以构建出具有高度自定义和交互性的行政区域地图应用。这涉及到...
Degrafa 强调的是交互性和动态性,这意味着开发者可以编写代码来响应用户的输入事件,如点击、拖动等,从而使图形具有动态变化的效果。 8. **性能优化**: 考虑到 Flex 中的性能问题, Degrafa 提供了一些优化...
5. **交互与动画**: Degrafa 还提供了丰富的动画和交互功能,例如你可以添加鼠标事件监听器,让SVG图形响应用户的点击或拖动,也可以创建复杂的图形动画。 6. **优化与性能**:由于SVG图形可能很大,解析和渲染...
Degrafa's Fills是一个在Flex开发中用于图形渲染的开源库,它为开发者提供了丰富的图形填充效果。这篇博文的作者分享了如何将 Degrafa 的填充功能集成到其他Flex项目中的方法,通过一个名为“sign05.mxml”的示例...
3. **交互接口**:DEGRAFA提供了事件监听和处理机制,允许用户与图形进行交互,例如点击、拖动、缩放等操作。这对于创建可交互的图形界面非常关键。 4. **动画系统**:基于SVG的动画功能,DEGRAFA支持图形的动态...
flex开发的画图框架Degrafa 近来需在flex画些简单的图形,根据朋友推荐使用了Degrafa,但是官方没有提供离线的文档下载,于是自己制作了一下。 文档的所有版权均属http://www.degrafa.com 详细情况请查看degrafa的...
- 事件驱动:通过事件机制响应用户操作,易于扩展。 - 兼容性好:支持各种浏览器和操作系统。 #### 十三、BirdEye - **网址**:http://code.google.com/p/birdeye/ - **简介**:一款可视化分析工具,适用于大...
flex开发的画图框架Degrafa 近来需在flex画些简单的图形,根据朋友推荐使用了Degrafa,但是官方没有提供离线的文档下载,于是自己制作了一下。 文档的所有版权均属http://www.degrafa.com 详细情况请查看degrafa的...
Shape 是 Degrafa 中的基本绘图对象,如Line、Circle、Rectangle等。Group则允许我们将多个Shape组合在一起,形成更复杂的图形结构。PathElement 是构建曲线路径的关键,它包含了定义曲线走向的坐标和指令。 曲线的...
8. **API使用**:掌握 Degrafa 的API是学习的关键,包括如何创建图形对象、添加到场景中、应用样式以及响应用户事件等。 9. **示例和教程**:通过提供的 SDK 和源码,你可以找到许多示例项目,这些项目可以帮助你...
4. **Flex Visual Graph Library**: 类似于SpringGraph,它也专注于拓扑图形展示,动态效果出色。 5. **Open Source Framework for Flex / Flash & AIR(Apollo)**: 提供AOP(面向切面编程)和debugger等功能,是一...
Flex开源项目介绍 Flex是一种用于构建富互联网应用程序(RIA)的开源框架,它基于ActionScript 3(AS3)编程语言和MXML标记语言。这些开源项目为开发者提供了丰富的组件库、工具和框架,帮助他们扩展Flex的功能,...
3. **交互性**: Degrafa支持事件处理和交互式设计,使得图形不仅具有视觉吸引力,还能响应用户的操作,如点击、拖动等。这使得 Degrafa成为构建交互式应用程序的理想选择。 4. **数据绑定**:通过数据绑定功能,...
"Flex SVG 代码生成图片" 在 Flex 应用程序中,使用 SVG 资源可以实现图表生成图片并下载。以下是关于 Flex SVG 代码生成图片的知识点: 一、静态显示 SVG 图像 在 Flex 应用程序中,可以使用 SVG 资源,但只能...
【Flex开源项目】是开发界的一个重要领域,它主要指的是基于Adobe Flex技术的开源软件项目。Flex是一种用于构建富互联网应用程序(RIA)的框架,它使用ActionScript 3(AS3)编程语言和MXML标记语言。这些开源项目为...
Degrafa扩展就是在FLEX中增加了对矢量数据的动态处理,包括动态添加,删除和修改,并支持SVG的路径格式数据, 因此只需要对现有的SVG数据进行一些必要的转换(以后会有工具支持,但现在只能手工完成),就可以将SVG...