Undolog.com

As stated in Flash Actionscript contest: erase tool you can not "delete" a particular area in a Sprite, MovieClip, or shape of which have been traced lines or rectangles using the pointer graphics. There is, in fact, the only method clear() which, however, has no effect on the entire area of our object. The solution to the problem lies in the ability to use Bitmap and BitmapData objects. As we will see we can directly access and manipulate the Bitmap data in order to "erase" the traits with a real instrument "eraser".

Will present two different methods to realize the "eraser". per esempio. The first "draws" (delete) data directly into the BitmapData, using the method fillRect() - you can also use setPixel() for example. The second method, the one I prefer, uses the methods of mergers (blendMode).

First of all let's see what kind of organization is needed to achieve a minimal simple Painter in Flash. The scheme presented below applies to both the proposals of the "eraser"

I created three layers: the first, MovieClip or Sprite, background and acts as the event handler (MouseDown, MouseMove, and MouseUp). The second, the Bitmap is our top most layer, the one that will actually drawn graphics and which will be applied to the "eraser". , ecc…). The third and final layer, the Shape, addresses two issues: the first is that it allows to directly use the functions provided by the pointer graphics (as lineStyle , drawRect() , etc ...). It also increases the performance while tracking graph, as explained in detail below.

METHOD 1 - Direct access to bitmap data

) dalla Shape (layer 3) alla Bitmap (layer 2). This "sample" uses the method fillRect() directly on BitmapData (layer 2) after the design has been copied (using the method draw() ) from the Shape (Layer 3) to Bitmap (layer 2).

To understand how it works here is the same movie with the layers apart and in pseudo 3D - drawn in colored Box - source :

As you can see, you draw on layer 3, the Shape. When taking the MouseUp event the contents of the Shape is copied to the bitmap (and therefore the data are present in the BitmapData) and then the Shape is clean ( clear() ).

Note: this last point, the clear() on the Shape, it is not to be underestimated. Some examples of the painter in Flash (almost all lack a true "eraser") draw directly on a MovieClip or shape, keeping the latter on data drawn. After a while 'you draw the system slows down, because the area "vector" of the MovieClip increases. In the method I presented this problem is solved in that the data vector of the shape, as copied to the Bitmap, are tasformati in bits and the Shape is deleted, freeing up memory and restituiendo fluidity to the design!

While holding down the Ctrl (control) is "deleted" directly through the BitmapData fillRect() . This is possible because fillRect() , like the other methods that act on BitmapData, allow to set the "color" via 0xARGB, where A is the alpha value, transparency.

The code is as follows - source :

The line 61, as shown in the code above, is esguita when the Ctrl key is pressed. As you can see this section of code draws directly into a BitmapData with color 0, or 0 × 0000!

METHOD 2 - Using blending modes

This is probably the best method when you can use any kind of "eraser". Unlike the previous method does not have direct access to the bitmap data present in BitmapData, but you take advantage of blending modes (blendMode) and the copy of the Bitmap using the method draw().

3D version - source :

. In exactly the same way that we copy the data from the Shape to Bitmap, the "eraser" is "simultato" copying the data from the Shape to Bitmap but, this time, setting the blendMode of the method draw() to erase .

The code is as follows - source :

This code is not very different from the previous one. The real difference is in row 52! This determines the "blending mode" when copying from Shape to Bitmap, and when the Control key is pressed is used the blending mode to erase .
That's all! We will return to the Bitmap as soon as possible and the differences between MovieClip, Sprite, Shape and Bitmap ... all visual objects!

This article was useful to you?:

Loading ...

Be Sociable, Share!

• 

• Tweet