AS3 Photoshop 笔刷
我正在寻找一种在 ActionScript 3 中构建类似 Photoshop 的绘图工具的方法。特别是我想在 Photoshop 中构建类似画笔的东西。这样你就可以使用不同的PNG作为画笔。
我尝试在 Photoshop 中将画笔保存为透明 png,将其导入到我的 AS3 项目中,并使用鼠标移动事件,每次将鼠标移动到位图数据对象中时绘制 png。 但这看起来不像photoshop。下面是一个示例,首先是 Photoshop 绘图,然后是 as3 绘图:
在 Photoshop 中,它看起来非常平滑,但在 as3 中,你会看到丑陋的角落和颜色变化。 有谁知道解决方案吗?
谢谢,晚礼服
I'm searching for a way to build a photoshop like drawing tool in ActionScript 3. Especially I want to build something like the brushes in photoshop. So that you can use different PNG's as a brush.
I tried it with saving a brush in photoshop as a transparent png, import it into my AS3 project and with a mouse move event, draw the png everytime you move the mouse into a bitmapdata object.
But that doesn't look like photoshop. Here's a example, first the photoshop drawing, then the as3 drawing:
In photoshop it looks very smooth, but in as3 you have that ugly corners and color shifts.
Does anyone know a solution?
thx, tux
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
答案是 Flash 使用预乘的 alpha 透明度绘制 bitmapData。闪存基本上通过将几乎透明的像素舍入到另一个值来节省内存。人眼无法察觉,除非您将图像一遍又一遍地堆叠在一起。这会导致颜色的舍入误差,看起来几乎就像画笔烧焦的边缘。
正如其他人所指出的那样,您肯定需要在鼠标位置之间“行走”画笔,但这并不能解决当您将图像堆叠在一起时发生的颜色变化。
相反,将画笔描边绘制到透明位图中,并使用 colorTransform 方法将新图层着色为您选择的颜色。当您向上移动鼠标时,将该透明层绘制到画布中。 (当您不使用它时,请不要忘记删除该额外的层!)
The answer is that Flash draws bitmapData with pre multiplied alpha transparency. Flash basically conserves memory by rounding the nearly transparent pixels to another value. It is imperceptible to the human eye, unless you stack the images on top of each other over and over. This results in rounding errors of color that look almost like a burnt edge of the brush.
You definitely need to "walk" the brush in between mouse positions as others have noted, but that wont take care of the color shifting that happens when you stack images on top of one another.
Instead draw your brush stroke into a transparent bitmap and tint that new layer to your selected color using the colorTransform method. When you mouse up, draw that transparent layer into your canvas. (Don't forget to remove that extra layer when you are not using it!)
这是因为 Photoshop 会“行走”鼠标坐标之间的距离并绘制该距离。因此,即使您在两点之间非常快速地移动鼠标,您也会得到一条连贯的线。
每次鼠标更新时您只绘制一次,因此如果鼠标移动得非常快,您将得到点而不是线条。
您可以通过跟踪上次鼠标更新的位置以及额外步骤中的绘制之间的距离是否太远来解决此问题。
This is because Photshop "walks" the distance between the mouse coordinates and paints that too. So even if you're moving your mouse very fast between two points you will get a coherent line.
You're only drawing once per mouse update, so if the mouse is moving very fast you will get spots instead of lines.
You can solve this by keeping track of the position of the last mouse update, and if it's too far between paint in the extra steps.
更具体地说:每次触发 mouseDown 时,您都应该创建一个临时位图。在此,画笔将以黑色和白色绘制 - 这将产生更平滑的结果,例如当您使绘制的画笔未充满 Alpha 时。另外 - 在这里你必须使用“行走”技术,正如葡萄柚所说。
最后,一旦 mouseUp 事件被触发,您必须重新着色位图(用于画笔颜色),如果需要的话可以添加一些过滤器并将其绘制在主位图上。
To be more specific: You should make a temporary bitmap each time a mouseDown is fired. On this the brushes will be drawn in black and white - this will produce smoother results for example when you make the drawn brush not full in alpha. Also - here you will have to use the "walking" technique, as said by grapefrukt.
Finally, once the mouseUp event is fired, you have to recolor the bitmap (for brush color), possibly add some filters if you want and draw it on the main bitmap.