ActionScript 3.0 :: How To Tween Drawing Line (MovieClip Graphics)
Jan 20, 2010How can I Tween drawing a line mc.graphics.lineTo(); ? I just see tweener has an onUpdate property awesome.
View 0 RepliesHow can I Tween drawing a line mc.graphics.lineTo(); ? I just see tweener has an onUpdate property awesome.
View 0 RepliesI have a program that dynamically draws a polygon wherever the user clicks on the screen. (using lineto, moveto) However this polygon is always behind the other symbol objects on the screen even though its added last in the childlist. Is there an issue with depth when drawing symbols vs. drawing with lines? How can I ensure my dynamic object will display in front?
View 3 RepliesI'm working on a Flash project in which the user can choose to draw on the stage. To indicate to the user that it's possible to draw, I'm changing the default cursor to a pen image. I'm doing this by attaching a movieclip to the cursor, then hiding the cursor:
ActionScript Code:
on (press) {
penOn = true;
[Code].....
All this works great, with one problem. The line users draw appears on top of the custom cursor, so if they go back over something they've already drawn, they can't see the cursor anymore. I've tried a bunch of fixes, but nothing has worked. FYI, that first block of code I pasted is attached to the button that turns the pen on, while the second block of code is in the bottommost layer of the movie.
I've almost got a bit of flash finished, The .swf so-far is here: [URL]. For some reason the file won't attach but the important bit of code I have so-far is below. I need to make a line to literally 'connect the dots', each of which is one end of a movieclip, I know it needs to boil down to ' line x,y, to (movieclipname)x,y, but cannot work it out!
time.onChanged = function() {
if(time.text.length == 4) {
var hours:Number = parseInt(time.text.substr(0,2),10);
hours *= 60;
var minutes:Number = parseInt(time.text.substr(2,2),10);
[Code] ......
I have a little snippet of code that allows the user to create a line with the mouse, and clears the line if they end up touching the hitbox with the mouse, while they're drawing the line. It works fine when it's just thrown onto the main timeline. However, when I try to encapsulate it within a movie clip, it suddenly doesn't work. At all. Are there any suggestions as to why this is happening? Here's the code.
[Code]....
I am using Flex 4 and AS3 and I am trying to make it so that the user can draw a freehand line with the cursor - I have this part done.However, I also need the line to be a dashed line instead of one solid line like it is now. below is my code I am using. I have found some examples on how to do this, but they are all for straight lines, not for a freehand line.
Class File (DrawingArea):
package
{
import flash.display.BitmapData;
import flash.events.Event;
import flash.events.MouseEvent;
[code]....
I am developing a white board application which allows the user to draw line with arrow head (some like Microsoft Word line with arrow feature). I am using graphics property along with lineTo() method to draw a line. Now i have to draw a angular arrow on the last point of line. I am drawing the arrow by connecting the points around last points. As 360 line can pass through this point and each line can have a different angle of arrow.
View 1 RepliesI've seen the BitmapData object used for graphics a fair bit, especially in games. Many of these cases have done things in somewhat fundamentally different ways, and I was wondering what the best way generally is.
Method 1: Each animation frame is kept in a separate BitmapData object using an array.
Method 2: The animation is kept in a strip using a single BitmapData object and using the "sourceRect" parameter of copyPixels.
The draw and hitTest methods appear not to provide any "sourceRect" parameter. Most of the code I have seen using method 2 has worked around this by copying the bitmap frame into a temporary bitmap for these methods. This seems like quite a large processing overhead to me. Using method 1 this is generally not a problem, unless hitTest needs to be used with scaling and/or rotation, in which case a temporary transformed copy is still needed it seems as hitTest doesn't except a transformation.
I'm thinking method 1 is the better choice since it avoids having to make temporary copies for the most part, and I don't think it would waste much memory (just the duplicated width, height, etc values?). Is this generally true or is there a reason lots of people seem to do things the second way?
Also is there a better way to use hitTest for bitmaps that have been scaled, rotated, etc?
I have a code, that draws a horizontal line, then it turns into a slope, and at the end of the slope it draws a circle. Here's a code:
Code:
var xspeed:Number = 1; // defines increments for x of slope
var yspeed:Number = 2; // defines increments for y of slope
var hspeed:Number = 5; // horizontal line increments
[code]....
Create document 800x700 and put this code into main timeline. Now test movie As you can see, everything works great. But there is a problem. The circle is being drawn at 0 degree angle. But I want the circle to match the angle of the slope, so it looks like the slope and the circle are both at the same angle.
I've got a custom AS3 scrollbar that I need to modify. The scroll thumb (the draggable part of a scrollbar) is currently just done by drawing a rectangle. But I need it to look more like a real scrollbar. Not sure how to modify the below code to import/use a scroll thumb image:
scrollThumb = new Sprite();
scrollThumb.graphics.lineStyle();
scrollThumb.graphics.beginFill(0x0066ff);
[code].....
I have created some graphics directly in Flash Cs4 using the drawing tools, making them 'drawing objects', yet they are pixelated when viewed in browsers. Within Flash they look crisp, but not when exported.
Here is a screenshot:
And again zoomed-in:
I'm trying to understand how the Flex framework draws objects (Button, Label, Image, etc.). The Button class seems to draw itself by addChild()ing its ProgrammaticSkin. However, where in the framework is the Graphics object being passed around in the hierarchy to achieve the drawing. I want to get to the level of 2D API.
View 1 RepliesIm building a pretty simple drawing board in flash, i got this code from this forum and it works fine (there is more to it but this is the drawing part)[code]This works fine. But i want to be able to erase the drawings, step by step this is ths tricky part, ive looked everywhere(ok not everywhere) but in a whole lot of places but the only thing i found is how i could delete everything with removeChild and that in not what i want. Maybe i need to change the function abowe? Please help me to get in the right direction. What should i read about /look at?
View 5 RepliesI'm drawing a line using this code:
this.graphics.moveTo(posx, posy);
this.graphics.lineTo(2*posx,2*posy);
But now I want to remove it, but I can't clear the whole this.graphics object because it contains more information that is useful for me. How can I remove this line without clearing this.graphics object? Is there any method to draw a similar line over it to hide or replace the line?
If I skin a button and use the AS3 graphice.clear() and graphics.lineTo and beginFill to create a shape, the button overlaps other items in the container.
When I use the and mxml to create the same shape, the button is neatly positioned inside the container.
I wanted to check if there is a easy way to build an arrow for a line... currently I am trying to draw a triangle at end of the line- doable but a load of geometry to handle as the line could be at any angle and- anything build-in available?
View 3 RepliesI noticed this thing that Flash self generated graphic symbols and names it Tween1, Tween2, etc. I am not sure why it happens. Usually it happens when I tween something and then this accompanying graphic symbol appears in the library. Do I really need them, is it a flash mulfunction and I can safely delete them? why they are happening, am I making all the wrong steps in tweening and thus they appear?
View 1 RepliesI have two bitmap graphics (bmp1, bmp2) already created with the BitmapData class using the contents of an object (label1):
var myBitmapData1:BitmapData = new BitmapData(150, 150);
myBitmapData1.draw(label1, matrix, null, null, null, true);
var bmp1:Bitmap = new Bitmap(myBitmapData1);
[code].....
is it possible to align the stroke of a graphic with actionscript? for example, the following code creates a black rounded rect with a grey stroke that is automatically centre aligned.
var t:Sprite = new Sprite();
t.graphics.lineStyle(5, 0x555555);
t.graphics.beginFill(0, 1);
t.graphics.drawRoundRect(25, 25, 200, 75, 25, 25);
t.graphics.endFill();
the lineStyle function doesn't seem to offer any built-in functionality for aligning the stroke. in Adobe Illustrator, you can align a stroke to be either centre (half in/half out of the fill), inside (bordering within the fill) or outside. (bordering outside the fill).
I have an application that creates a chart dynamically. This chart has a lot of information plotted on it (4-6 stock trends). I want to be able to toggle some of those lines with a button. Each trend is drawn with something like this:
Code:
// establish a new Vector object for the commands parameter
var line_commands:Vector.<int> = new Vector.<int>();
line_commands.push(1,2,2,2);
// establish a new Vector object for the data parameter
var line_coord:Vector.<Number> = new Vector.<Number>();
// use the Vector array push() method to add a set of coordinate pairs
line_coord.push(0,0, 75,50, 100,0, 125,50);
graphics.drawPath(line_commands, line_coord);
How would I toggle the line I just drew? My first idea would be to put some of this code inside a function and redraw the line with the same color of the movie's background color. I don't know if this is the best option, I was wondering if I could draw this line inside a Sprite or Movie Clip and just toggle its visibility?
I've created a drawing tool which allows the user to draw on the canvas, the problem is that if I try to draw over a movieclip nothing happens. Is there a way I can allow for the user to draw over movieclips? For example if I had a background of paper?
Here's the code I'm using for it:
// This code is for drawing the lines on the page
//1.
var drawingLine:MovieClip = new MovieClip();
addChildAt(drawingLine,0);
[code]....
How can I create a rounded rectangle with a dashed line? I've seen several routines that draw their own straight lines, but nothing for rounded rectangles.
View 2 RepliesI am trying to draw a line from x1, y1 to x2,y2 and i want it to be a line that repeats a pattern from an image. All I can see is that you can only draw lines and change their color or thickness but I would like it to repeat an image. Is that possible or do i have to use a really long and thin rectangle with a bitmap fill?The problem is I am making a game where the user will be able to actually draw the line so i have to make it be created dynamically. The game fantastic contraption [URL] has in the game a feature where you draw lines of any length and position that are filed with a picture.
View 13 RepliesHow do i animate a drawing line? I mean like from point A to point B, the flash will show it is "drawn" itself.Can I do it simply without actionscript? Is it possible? Because I have many lines to draw, to make it into a diamond.
View 14 RepliesI've received a number of graphics from an Illustrator user - they imported as symbols containing drawing objects. When I opened one of these symbols and tried to tween (fade out) the drawing object, I don't have the Alpha option. I don't use Illustrator myself and I had to install CS4 so I'm not used to that either.
View 4 RepliesI am trying to delete a single line using graphics.clear() method but it clears all the instance of lines created by lineTo() method. I want to remove a single line upon click from bunch of its multiple instance.
View 2 RepliesWhat I'd like is the ability to draw a line with the drawing tools in Flash, and have that line appear onscreen as if it were being drawn. I don't think there's a way to do that with the animation tools (I'd like to give it a go, but I have no idea, once I've drawn a line and converted it into a symbol, how I could access the anchor points and whatnot of said line to then do some funky stuff with curveTo, or whatever better solution is out there...
View 2 RepliesHow can a create an animation of line drawing itself.
View 1 RepliesWith several flashes I'm trying to create, I find that I need to know how to depict a line being drawn or a plant/vine growing (same concept right). Obviously frame-by-frame animation can be used, but that's quite tedious. There must be some other, more productive way to pull it off. Example of the vine: [URL] I've tried shape tweens with shape hints but it didn't render very well at all.
View 6 RepliesI am looking for a smooth line drawing effect as in the pencil tool in Flash. I need to implement the same using as3.
View 7 Replies