拖拉切割直线

<?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" creationComplete="onLoad();" >

<fx:Script>
<![CDATA[
import flash.display.Sprite;
import flash.geom.Point;

import mx.controls.Alert;
import mx.core.DragSource;
import mx.core.UIComponent;
import mx.events.DragEvent;
import mx.events.MenuEvent;
import mx.managers.DragManager;

// 最原始的线条对象
private var uxLine:UXLine = new UXLine;
// 拖动初始点
private var dragPoint:Point = new Point;

// 当前线条对象
private var currentLine:UXLine = null;

private function onLoad():void{
// 初始化表格线
initGridLine(mxCanvas);

// 初始化uxLine
uxLine.xFrom = 50;
uxLine.yFrom = 50;
uxLine.xTo = 250;
uxLine.yTo = 250;
uxLine.draw();

mxCanvas.addElement(uxLine);

mxCanvas.addEventListener(UXLine.EVENT_LINE_BROKEN, onLineBroken);
mxCanvas.addEventListener(UXLine.EVENT_LINE_NODE_MOVE, onLineNodeMove);
}


// 线条分割事件
private function onLineBroken(event:MouseEvent):void{
if(event.target is UXLine){
currentLine = UXLine(event.target);
systemManager.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove4LB, true);
systemManager.addEventListener(MouseEvent.MOUSE_UP, onMouseUp4LB, true);
}
}
// 线条分割选择点后 开始移动
private function onMouseMove4LB(event:MouseEvent):void{
event.stopImmediatePropagation();
if(currentLine != null){
currentLine.draw2Line(currentLine.x, event.localY);
/* Alert.show(event.localX.toString(),"title"); */
}
}
// 线条分割选择点后 移动完成
private function onMouseUp4LB(event:MouseEvent):void{
event.stopImmediatePropagation();
systemManager.removeEventListener(MouseEvent.MOUSE_MOVE, onMouseMove4LB, true);
systemManager.removeEventListener(MouseEvent.MOUSE_UP, onMouseUp4LB, true );

var pointX:Number = event.localX;
var pointY:Number = event.localY;
// 把线条拆分开,即新增加一条线来实现
if(currentLine != null){
var newLine:UXLine = new UXLine;
newLine.xFrom = currentLine.xFrom;
newLine.yFrom = currentLine.yFrom;
newLine.xTo = pointX;
newLine.yTo = pointY;
newLine.draw();
mxCanvas.addElement(newLine);

currentLine.graphics.clear();
currentLine.xFrom = pointX;
currentLine.yFrom = pointY;
currentLine.draw();
//mxCanvas.removeElement(currentLine);
}
currentLine = null;
}

// 选择线起点或终点的移动事件
private function onLineNodeMove(event:MouseEvent):void{
if(event.target is UXLine){
currentLine = UXLine(event.target);
systemManager.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove4Line, true);
systemManager.addEventListener(MouseEvent.MOUSE_UP, onMouseUp4Line, true);
}
}

// 选择线起点或终点的移动事件
private function onMouseMove4Line(event:MouseEvent):void{
event.stopImmediatePropagation();

if(currentLine != null){
if(currentLine.selectedNode == UXLine.SELECTED_FROM_NODE){
currentLine.xFrom = event.localX;
currentLine.yFrom = event.localY;
}else if(currentLine.selectedNode == UXLine.SELECTED_TO_NODE){
currentLine.xTo = event.localX;
currentLine.yTo = event.localY;
}
currentLine.draw();
}
}

// 释放移动动作
private function onMouseUp4Line(event:MouseEvent):void{
event.stopImmediatePropagation();
systemManager.removeEventListener(MouseEvent.MOUSE_MOVE, onMouseMove4Line, true);
systemManager.removeEventListener(MouseEvent.MOUSE_UP, onMouseUp4Line, true );
currentLine = null;
}


/**
* 初始化表格线条
**/
private function initGridLine(uiComponent:UIComponent):void{
const LINE_LENGTH:int = 4;
const LINE_MARGIN:int = 2;
const LINE_OFFSET:int = 24;
var rowIndex:int;
var colIndex:int;
var rowCount:int = Math.floor(this.height / LINE_OFFSET);
var colCount:int = Math.floor(this.width / LINE_OFFSET);
var startX:Number;
var startY:Number;
var endX:Number;
var endY:Number;
var lineIndex:int;
var lineCount:int;
var lineLength:int = (LINE_LENGTH + LINE_MARGIN);
var thickness:Number = 0.5;
var lineColor:uint = 0x000000;

uiComponent.graphics.clear();
uiComponent.graphics.beginFill(0xFFFFFF);
uiComponent.graphics.drawRect(0, 0, this.width, this.height);
uiComponent.graphics.endFill();

uiComponent.graphics.lineStyle(thickness, lineColor, 0.5);

// 画出横线
lineCount = Math.floor(uiComponent.width / lineLength);
for(rowIndex = 1; rowIndex <= rowCount; rowIndex ++){
startY = endY = rowIndex * LINE_OFFSET;
if(rowIndex%2 == 0){
thickness = 1;
uiComponent.graphics.lineStyle(thickness, lineColor, 0.3);
}else{
thickness = 0.5;
uiComponent.graphics.lineStyle(thickness, lineColor, 0.1);
}
for(lineIndex = 0; lineIndex < lineCount; lineIndex ++){
startX = lineIndex * lineLength;
endX = startX + LINE_LENGTH;
uiComponent.graphics.moveTo(startX, startY);
uiComponent.graphics.lineTo(endX, endY);
}
}
// 画出竖线
lineCount = Math.floor(uiComponent.height / lineLength);
for(colIndex = 1; colIndex <= colCount; colIndex ++){
startX = endX = colIndex * LINE_OFFSET;
if(colIndex % 2 == 0){
thickness = 1;
uiComponent.graphics.lineStyle(thickness, lineColor, 0.3);
}else{
thickness = 0.5;
uiComponent.graphics.lineStyle(thickness, lineColor, 0.1);
}

for(lineIndex = 0; lineIndex < lineCount; lineIndex ++){
startY = lineIndex * lineLength;
endY = startY + LINE_LENGTH;
uiComponent.graphics.moveTo(startX, startY);
uiComponent.graphics.lineTo(endX, endY);
}
}
}

]]>
</fx:Script>
<mx:Canvas id="mxCanvas" height="100%" width="100%">
<s:Label text="提示：按住Ctrl再选择线条画折线，选择线的两端可移动线条" toolTip="按住Ctrl再选择线条画折线" x="278" y="11"/>
</mx:Canvas>

</s:Application>

拖拉切割直线,布布扣,bubuko.com

拖拉切割直线

原文：http://www.cnblogs.com/wshsdlau/p/3621870.html