参考greensock的TransformManager,实现了一个简单的变形组件。
只实现了变形框的功能,变形框和元件的绑定需要自己来做,变形框只用于缩放,没有实现旋转,也没有拖动,因为拖动功能相对来说容易实现,变形框中实现拖动功能经常会影响自定义功能的开发。
demo如下:
Main.as
package
{
import flash.display.MovieClip;
import flash.events.Event;
import flash.geom.Rectangle;
import flash.text.TextField;
public class Main extends MovieClip
{
public var tf:TextField;
public function Main()
{
// constructor code
var handleBox:HandleBox = new HandleBox();
addChild(handleBox);
handleBox.setBoundBox(mc.x, mc.y, mc.width, mc.height);
handleBox.minW = mc.width*0.5;
handleBox.minH = mc.height*0.5;
handleBox.maxW = mc.width * 4;
handleBox.maxH = mc.height * 4;
handleBox.addEventListener(Event.CHANGE, function(e:Event)
{
var rect:Rectangle = handleBox.getBoundBox();
mc.x = rect.x;
mc.y = rect.y;
mc.width = rect.width;
mc.height = rect.height;
tf.text = rect.toString();
});
}
}
}HandleBox.as
package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Point;
import flash.geom.Rectangle;
/**
* 实现一个变形框。
* 可以直接
* var handleBox:HandleBox = new HandleBox();
* addChild(handleBox);
* handleBox.setBoundBox(0, 0, 100, 100);
* 来测试效果。
* @author hanyeah
* @date 2016/9/12 11:15
*/
public class HandleBox extends Sprite
{
/**线的颜色**/
public var lineColer:uint = 0x3399FF;
/**小矩形的填充色**/
public var handleColor:uint = 0xFFFFFF;
/**小矩形的宽高**/
public var handleSize:int = 8;
public var minW:Number;
public var minH:Number;
public var maxW:Number;
public var maxH:Number;
private var p0:Handle = new Handle(lineColer, handleColor, handleSize, "t", "stretchV", 90, 0, "b");
private var p1:Handle = new Handle(lineColer, handleColor, handleSize, "r", "stretchH", 0, 0, "l");
private var p2:Handle = new Handle(lineColer, handleColor, handleSize, "b", "stretchV", -90, 0, "t");
private var p3:Handle = new Handle(lineColer, handleColor, handleSize, "l", "stretchH", 180, 0, "r");
private var p4:Handle = new Handle(lineColer, handleColor, handleSize, "tl", "corner", -135, -90, "br");
private var p5:Handle = new Handle(lineColer, handleColor, handleSize, "tr", "corner", -45, 90, "bl");
private var p6:Handle = new Handle(lineColer, handleColor, handleSize, "br", "corner", 45, -90, "tl");
private var p7:Handle = new Handle(lineColer, handleColor, handleSize, "bl", "corner", 135, 90, "tr");
private var _handles:Array = [];
private var _rect:Rectangle = new Rectangle();
private var _curHandle:Handle;
private var _originP:Point=new Point();
public function HandleBox()
{
_handles = [p0, p1, p2, p3, p4, p5, p6, p7];
for (var i:int = 0; i < 8; i++ ) {
var handle:Handle = _handles[i] as Handle;
addChild(handle);
handle.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
handle.oppositeHandle = getChildByName(handle.oppositeName) as Handle;
}
}
private function mouseDownHandler(e:MouseEvent):void
{
_curHandle = e.currentTarget as Handle;
_rect = getBoundBox();
_originP.x = mouseX;
_originP.y = mouseY;
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
stage.addEventListener(Event.MOUSE_LEAVE, mouseUpHandler);
}
private function mouseUpHandler(e:Event):void
{
stage.removeEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
stage.removeEventListener(Event.MOUSE_LEAVE, mouseUpHandler);
}
private function mouseMoveHandler(e:MouseEvent):void
{
var rect:Rectangle = _rect.clone();
var dx:Number = mouseX - _originP.x;
var dy:Number = mouseY - _originP.y;
_originP.x = mouseX;
_originP.y = mouseY;
switch (_curHandle.name) {
case "t":
rect.y += dy;
rect.height -= dy;
break;
case "b":
rect.height += dy;
break;
case "l":
rect.x += dx;
rect.width -= dx;
break;
case "r":
rect.width += dx;
break;
case "tl":
rect.y += dy;
rect.height -= dy;
rect.x += dx;
rect.width -= dx;
break;
case "br":
rect.height += dy;
rect.width += dx;
break;
case "tr":
rect.y += dy;
rect.height -= dy;
rect.width += dx;
break;
case "bl":
rect.height += dy;
rect.x += dx;
rect.width -= dx;
break;
}
if (rect.width<minW||rect.width>maxW) {
rect.width = _rect.width;
rect.x = _rect.x;
}
if (rect.height<minH||rect.height>maxH) {
rect.height = _rect.height;
rect.y = _rect.y;
}
setBoundBox(rect.x, rect.y, rect.width, rect.height);
dispatchEvent(new Event(Event.CHANGE));
}
public function getBoundBox():Rectangle {
return _rect.clone();
}
public function setBoundBox(xx:Number,yy:Number,w:Number,h:Number):void {
p0.x = xx + w / 2;
p0.y = yy;
p1.x = xx + w;
p1.y = yy + h / 2;
p2.x = xx + w / 2;
p2.y = yy + h;
p3.x = xx;
p3.y = yy + h / 2;
p4.x = xx;
p4.y = yy;
p5.x = xx + w;
p5.y = yy;
p6.x = xx + w;
p6.y = yy + h;
p7.x = xx;
p7.y = yy + h;
graphics.clear();
graphics.lineStyle(1, lineColer);
graphics.drawRect(xx, yy, w, h);
graphics.endFill();
_rect.x = xx;
_rect.y = yy;
_rect.width = w;
_rect.height = h;
}
}
}
import flash.display.Sprite;
class Handle extends Sprite
{
public var type:String;
public var cursorRotation:Number;
public var flipRotation:Number;
public var oppositeName:String;
public var oppositeHandle:Handle;
public function Handle(lineColor:uint,handleColor:uint,handleSize:Number,name:String, type:String, cursorRotation:Number, flipRotation:Number = 0, oppositeName:String = null)
{
this.name = name;
this.type = type;
this.cursorRotation = cursorRotation;
this.flipRotation = flipRotation;
this.oppositeName = oppositeName;
graphics.lineStyle(1, lineColor);
graphics.beginFill(handleColor, 1.0);
graphics.drawRect( -handleSize / 2, -handleSize / 2, handleSize, handleSize);
graphics.endFill();
}
}
发表评论:
◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。