帶有LineStyle筆觸的圖形上的BitmapData.draw（）描邊

Question

我使用Shape.graphics.drawRoundRect()繪製了一個形狀，其中應用了lineStyle。我試圖使用BitmapData.draw()作爲Bitmap捕獲該形狀，但我遇到了中風問題。請看下圖：

正如你可以看到，使用draw()（和drawWithQuality()）當行程將被剪掉。該線以對象爲中心繪製，所以厚度爲4（如我在示例中所用）的形狀區域外有2個像素，其中有2個像素。 draw（）捕獲從（0,0）到（BitmapData.width，BitmapData.height）的所有內容，因此，（0,0）左邊和頂部的所有內容都將丟失。具有諷刺意味的是，我試圖用clipRect選項進行補償，但這只是平衡了裁剪邊界。

任何想法如何捕獲剩餘的數據？

Answer 1

作爲一個更通用的解決方案，你可以得到對象的邊界在其自己的座標空間，並用它來設置BitmapData的大小和偏移draw()：

import flash.geom.Matrix; 
import flash.geom.Rectangle; 

const thickness:int = 4; 
const radius:int = 10; 
const size:int = 100; 

var shape:Shape = new Shape(); 
shape.graphics.lineStyle(thickness, 0xaaaaaa); 
shape.graphics.beginFill(0xdddddd); 
shape.graphics.drawRoundRect(0, 0, size, size, radius, radius); 
shape.graphics.endFill(); 
addChild(shape); 

var bounds:Rectangle = shape.getBounds(shape); 
var m:Matrix = new Matrix(); 
m.translate(-bounds.left, -bounds.top); 

var bmp1:Bitmap = new Bitmap(); 
bmp1.bitmapData = new BitmapData(bounds.width, bounds.height, true, 0); 
bmp1.x = 310; 
bmp1.y = 100; 
addChild(bmp1); 
bmp1.bitmapData.draw(shape, m); 

Answer 2

當然，第二我發佈的問題，我想出了辦法。你必須以抵消你的形狀到線匹配範圍之外，並補償額外的大小用畫

const thickness:int = 4; 
const radius:int = 10; 
const size:int = 100; 

var shape:Shape = new Shape(); 
shape.graphics.lineStyle(thickness, 0xaaaaaa); 
shape.graphics.beginFill(0xdddddd); 
shape.graphics.drawRoundRect(thickness/2, thickness/2, size, size, radius, radius); 
shape.graphics.endFill(); 
addChild(shape); 

var bmp1:Bitmap = new Bitmap(); 
bmp1.bitmapData = new BitmapData(size + thickness, size + thickness, true, 0); 
bmp1.x = 310; 
bmp1.y = 100; 
addChild(bmp1); 
bmp1.bitmapData.draw(shape); 

在這裏看到的結果（可以忽略剪輯矩形之一）時行添加到形狀：