我正在尝试用自定义形状创建一个蒙版，有没有办法将形状对象转换为蒙版对象？使用as3在代码中动态绘制形状。我似乎无法找到任何类似这样的链接。
以下是创建应用程序的代码：
var numPoints:Number = 0; // Number of points placed.
// No dragging will work until all three points are placed.
// Set max & min stage coordinates that the points can be dragged, and make the point diameters settable.
var xMax:Number = 455;
var xMin:Number = 5;
var yMax:Number = 305;
var yMin:Number = 5;
var circleWidth:Number = 10;
// Boolean variables to indicate that dragging is happening so that the appropriate point follows the mouse
// on the MOUSE_MOVE event.
var isDragging1:Boolean = false;
var isDragging2:Boolean = false;
var isDragging3:Boolean = false;
var isDragging4:Boolean = false;
var isDragging5:Boolean = false;
var isDragging6:Boolean = false;
var isDragging7:Boolean = false;
var isDragging8:Boolean = false;
// The drawBoard is a rectangle on which the triangle will be drawn. Colors are settable here. To change size,
// change the variables xMin, xMax, yMin, yMax above.
var drawBoard:Sprite = new Sprite();
drawBoard.graphics.lineStyle(1, 0x000000);
drawBoard.graphics.beginFill(0xEFEF77);
drawBoard.graphics.drawRect(0, 0, xMax - xMin, yMax - yMin);
drawBoard.graphics.endFill();
drawBoard.x = xMin;
drawBoard.y = yMin;
// Add a default drop shadow filter to the drawBoard
drawBoard.filters = [ new DropShadowFilter() ];
// This rectangle will listen for mouse clicks in order to construct the three vertices of the triangle.
drawBoard.addEventListener(MouseEvent.CLICK, placePoint);
// Put on the stage the board on which the triangle will be drawn.
stage.addChild(drawBoard);
// The filled triangle consists of three lines drawn between the points. It is updated on MOUSE_MOVE once
// dragging starts.
var lines:Shape = new Shape();
drawBoard.addChild(lines);
// The stage will listen for events involving dragging so that the dragging will continue to work even after
// the mouse has rolled off of the drawBoard region.
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseUpdate);
stage.addEventListener(MouseEvent.MOUSE_UP, stopDragging);
// We add three points to the stage but we do not add the graphics yet. We do specify listeners
// at this time so when they are all placed, we will be able to drag them.
var point1:Sprite = new Sprite();
point1.addEventListener(MouseEvent.MOUSE_DOWN, startDragging1);
drawBoard.addChild(point1);
var point2:Sprite = new Sprite();
point2.addEventListener(MouseEvent.MOUSE_DOWN, startDragging2);
drawBoard.addChild(point2);
var point3:Sprite = new Sprite();
point3.addEventListener(MouseEvent.MOUSE_DOWN, startDragging3);
drawBoard.addChild(point3);
var point4:Sprite = new Sprite();
point4.addEventListener(MouseEvent.MOUSE_DOWN, startDragging4);
drawBoard.addChild(point4);
var point5:Sprite = new Sprite();
point5.addEventListener(MouseEvent.MOUSE_DOWN, startDragging5);
drawBoard.addChild(point5);
var point6:Sprite = new Sprite();
point6.addEventListener(MouseEvent.MOUSE_DOWN, startDragging6);
drawBoard.addChild(point6);
var point7:Sprite = new Sprite();
point7.addEventListener(MouseEvent.MOUSE_DOWN, startDragging7);
drawBoard.addChild(point7);
var point8:Sprite = new Sprite();
point8.addEventListener(MouseEvent.MOUSE_DOWN, startDragging8);
drawBoard.addChild(point8);
// The reset button will stop all dragging, remove all children of drawBoard, and set numPoints back to 0.
btnReset.addEventListener(MouseEvent.CLICK, reset);
function reset(evt:MouseEvent):void {
var i:Number;
var n:Number = drawBoard.numChildren;
isDragging1 = false;
isDragging2 = false;
isDragging3 = false;
isDragging4 = false;
isDragging5 = false;
isDragging6 = false;
isDragging7 = false;
isDragging8 = false;
point1.graphics.clear();
point2.graphics.clear();
point3.graphics.clear();
point4.graphics.clear();
point5.graphics.clear();
point6.graphics.clear();
point7.graphics.clear();
point8.graphics.clear();
lines.graphics.clear();
numPoints = 0;
}
// The next function is executed when the mouse is moved. Note that if all points are not placed and nothing
// is being dragged, this function does nothing.
function mouseUpdate(evt:MouseEvent):void {
if (numPoints == 8) {
if (isDragging1) {
point1.x = goodX(evt.stageX); // Set x- & y-coordinates. See below for definition of
point1.y = goodY(evt.stageY); // functions goodX & goodY
lines.graphics.clear(); // Remove lines shape and redraw it
drawLines(); // with updated coordinates.
}
if (isDragging2) {
point2.x = goodX(evt.stageX);
point2.y = goodY(evt.stageY);
lines.graphics.clear();
drawLines();
}
if (isDragging3) {
point3.x = goodX(evt.stageX);
point3.y = goodY(evt.stageY);
lines.graphics.clear();
drawLines();
}
if (isDragging4) {
point4.x = goodX(evt.stageX);
point4.y = goodY(evt.stageY);
lines.graphics.clear();
drawLines();
}
if (isDragging5) {
point5.x = goodX(evt.stageX);
point5.y = goodY(evt.stageY);
lines.graphics.clear();
drawLines();
}
if (isDragging6) {
point6.x = goodX(evt.stageX);
point6.y = goodY(evt.stageY);
lines.graphics.clear();
drawLines();
}
if (isDragging7) {
point7.x = goodX(evt.stageX);
point7.y = goodY(evt.stageY);
lines.graphics.clear();
drawLines();
}
if (isDragging8) {
point8.x = goodX(evt.stageX);
point8.y = goodY(evt.stageY);
lines.graphics.clear();
drawLines();
}
evt.updateAfterEvent();
}
}
/* This function chooses the appropriate x-coordinate for a dragged point.
If thisX is in the draggable region, then we return it. Otherwise, we return the max or min x value,
depending on which side of the draggable region thisX is on.
*/
function goodX(thisX:Number):Number {
if (thisX < xMin) {
return (xMin);
}
if (thisX > (xMax - circleWidth)) {
return (xMax - circleWidth);
}
return (thisX);
}
// This function chooses the appropriate y-coordinate for a dragged point in a manner similar to the previous function.
function goodY(thisY:Number):Number {
if (thisY < yMin) {
return (yMin);
}
if (thisY > (yMax - circleWidth)) {
return (yMax - circleWidth);
}
return thisY;
}
// This function manages the placement of points until all three points are placed.
function placePoint(evt:MouseEvent):void {
if (numPoints == 0) {
point1.graphics.beginFill(0x7777FF);
point1.graphics.drawCircle(0, 0, circleWidth/2);
point1.graphics.endFill();
point1.filters = [ new DropShadowFilter() ];
point1.x = drawBoard.mouseX;
point1.y = drawBoard.mouseY;
numPoints = 1;
}
else if(numPoints == 1) {
point2.graphics.beginFill(0x7777FF);
point2.graphics.drawCircle(0, 0, circleWidth/2);
point2.graphics.endFill();
point2.filters = [ new DropShadowFilter() ];
point2.x = drawBoard.mouseX;
point2.y = drawBoard.mouseY;
numPoints = 2;
}
else if (numPoints == 2) {
point3.graphics.beginFill(0x7777FF);
point3.graphics.drawCircle(0, 0, circleWidth/2);
point3.graphics.endFill();
point3.filters = [ new DropShadowFilter() ];
point3.x = drawBoard.mouseX;
point3.y = drawBoard.mouseY;
numPoints = 3;
lines.graphics.clear();
}
else if (numPoints == 3) {
point4.graphics.beginFill(0x7777FF);
point4.graphics.drawCircle(0, 0, circleWidth/2);
point4.graphics.endFill();
point4.filters = [ new DropShadowFilter() ];
point4.x = drawBoard.mouseX;
point4.y = drawBoard.mouseY;
numPoints = 4;
lines.graphics.clear();
}
else if (numPoints == 4) {
point5.graphics.beginFill(0x7777FF);
point5.graphics.drawCircle(0, 0, circleWidth/2);
point5.graphics.endFill();
point5.filters = [ new DropShadowFilter() ];
point5.x = drawBoard.mouseX;
point5.y = drawBoard.mouseY;
numPoints = 5;
lines.graphics.clear();
}
else if (numPoints == 5) {
point6.graphics.beginFill(0x7777FF);
point6.graphics.drawCircle(0, 0, circleWidth/2);
point6.graphics.endFill();
point6.filters = [ new DropShadowFilter() ];
point6.x = drawBoard.mouseX;
point6.y = drawBoard.mouseY;
numPoints = 6;
lines.graphics.clear();
}
else if (numPoints == 6) {
point7.graphics.beginFill(0x7777FF);
point7.graphics.drawCircle(0, 0, circleWidth/2);
point7.graphics.endFill();
point7.filters = [ new DropShadowFilter() ];
point7.x = drawBoard.mouseX;
point7.y = drawBoard.mouseY;
numPoints = 7;
lines.graphics.clear();
}
else if (numPoints == 7) {
point8.graphics.beginFill(0x7777FF);
point8.graphics.drawCircle(0, 0, circleWidth/2);
point8.graphics.endFill();
point8.filters = [ new DropShadowFilter() ];
point8.x = drawBoard.mouseX;
point8.y = drawBoard.mouseY;
numPoints = 8;
lines.graphics.clear();
drawLines();
}
}
// Draws the three lines between the points with appropriate fill and adds a drop shadow.
function drawLines():void {
lines.graphics.lineStyle(1, 0xFF0000);
lines.graphics.beginFill(0xFF7777);
lines.graphics.moveTo(point1.x, point1.y);
lines.graphics.curveTo(point1.x + 50, point1.y + 50, point2.x, point2.y);
lines.graphics.curveTo(point2.x + 50, point2.y + 50, point3.x, point3.y);
lines.graphics.curveTo(point3.x + 50, point3.y + 50, point4.x, point4.y);
lines.graphics.curveTo(point4.x + 50, point4.y + 50, point5.x, point5.y);
lines.graphics.curveTo(point5.x + 50, point5.y + 50, point6.x, point6.y);
lines.graphics.curveTo(point6.x + 50, point6.y + 50, point7.x, point7.y);
lines.graphics.curveTo(point7.x + 50, point7.y + 50, point8.x, point8.y);
lines.graphics.curveTo(point8.x + 50, point8.y + 50, point1.x, point1.y);
/*lines.graphics.lineTo(point2.x, point2.y);
lines.graphics.lineTo(point3.x, point3.y);
lines.graphics.lineTo(point4.x, point4.y);
lines.graphics.lineTo(point5.x, point5.y);
lines.graphics.lineTo(point6.x, point6.y);
lines.graphics.lineTo(point7.x, point7.y);
lines.graphics.lineTo(point8.x, point8.y);
lines.graphics.lineTo(point1.x, point1.y);*/
lines.graphics.endFill();
lines.filters = [ new DropShadowFilter() ];
}
// The next functions "turn on" dragging for the point that is clicked, as long as all three points have
// been placed.
function startDragging1(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging1 = true;
}
}
function startDragging2(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging2 = true;
}
}
function startDragging3(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging3 = true;
}
}
function startDragging4(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging4 = true;
}
}
function startDragging5(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging5 = true;
}
}
function startDragging6(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging6 = true;
}
}
function startDragging7(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging7 = true;
}
}
function startDragging8(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging8 = true;
}
}
// Turns off dragging. This function is called when the mouse button is released anywhere on the stage.
function stopDragging(evt:MouseEvent):void {
if (numPoints == 8) {
isDragging1 = false;
isDragging2 = false;
isDragging3 = false;
isDragging4 = false;
isDragging5 = false;
isDragging6 = false;
isDragging7 = false;
isDragging8 = false;
}
}
答案 0 :(得分：2)
使用addChild(maskShape)将形状添加到显示列表中并将其设置为剪辑targetClip.mask = maskShape的掩码，您也可能需要为展位剪辑设置.cacheAsBitmap = true（关于其内容） 。 targetClip和maskShape应该拥有相同的父级。
PS：请仅发布您将来遇到问题的代码段。 PPS：我的答案中的实例名称与您的代码变量不匹配。