Flash :: Drawing In MX - Confined To Shape (not Square)

Drawing In MX - Confined To Shape (not Square)
Howdy

Another bump in the road for me.

I've found a similar thread to this but my problem's a little different.
I've never used the drawing function on Flash and I followed the fairly simple tute on it just recently.

Is there any way to confine the drawing area to a specific shape. Mine's a rectangluar shape that's rotated. You can download my FLA with the background image here > http://www.realchurch.com.au/my_draw.zip
I'd like to try and keep it confined to the notepad area.
Anyone know? I think it might be a hitTest thing with if/else. Not sure.

My other thing would be to just rotate the notepad so that it's straight.
Even still i'd like it confined to the area beginning with the corner of the notepad, not the corner of my movie.

Anyone got any thoughts?

Non-square Shape
I made a shape in photoshop and I pasted it on my flash movie, and it made a square outline on it. Where there was suppose to be no color (in the square outline in the spaces where there was no picture)it automatically put white. And it wouldn't let me erase it. I want to put a graphic underneath the the one I'm talking about, but the white part covers it. Can anyone help?

Transforming Circle Shape Into A Square
Hi,

I have a created a shape object circle that I want to transform into a square on mouseover (all should be handled with code - no timeline anims). I know how to do this in the timeline (using shape hints) but how on earth do I do it with AS 3?

Thanks in advance,
Cristian

Drawing Custom Shape, And Filling Shape
Hello Forum members,

I have not yet figured out how to fill a shape (not an oval or a rectangle) that I draw.

for example, I draw a triangle with the pen tool (or the pencil tool). I have a nice triangle now.
Three lines, etc.

How can I fill this new "shape" with a color? Witout using the brush or the pencil and drawing color in.

Thanks,

eholz1

How Do I Create Text That Moves In The Shape Of A Square?
Hi,

Any help on this would be appreciated.

Jged

Adjusting Textfield To Fit A Shape (square Or Circle)
Blech. My client wants little round labels filled with text.

Does anybody out there have a function that will take a sentence string and put it into an adjustable textfield in such a manner that the height of the field is almost equal to the width? Bonus points if it's smart enough to insert line breaks between words so that the text appears in a circle.

Size doesn't matter: width to height ratio does.

I need to have output
that is something like
this sentence, so the
text all appears in a
little squarish box or in
a circle of some sort.

or kinda
like the way
this sentence
does.

How To Place The Movie Clips In Square Shape?
how do i place the movie clips in a square shape? below is the actionscript of it.

Quote:

onClipEvent (load) {
initialRotation = 0;

for(i=0;i<10;i++) {

_root.attachMovie("sample","sample"+i,i);
_root["sample"+i]._x = i*37;
_root["sample"+i]._y = 100;
_root["sample"+i]._rotation = initialRotation;
initialRotation += 15;
}
}

onClipEvent (enterFrame) {

for(i=0;i<10;i+=2) {

_root["sample"+i]._rotation += 10;
_root["sample"+(i+1)]._rotation -= 10;
}
}

RollOver Image - Odd Shape But Entire Square Gets Detected
Hello. I want to assign a rollover to an oddly shaped item (we will call it a triangle for the sake of this post). The problem is, when I import the triangle from Photoshop (as a png to maintain the transparency), the rollOver command executes for the entire square in which the triangle exists, even though the only visible and important part is in the shape of a triangle within that square.

Does anyone know what I can do to make my rollOver only execute when the mouse is over the non-transparent portion of the image (ie. just the triangle shape)? Note that it is a bitmap when imported into flash and converted to a movie clip, and although that is most likely the issue, I am hoping that someone knows a good way to do what I am trying to do.

Thanks for your help!

Drawing Square Corners
I'm having problems trying to draw anything without rounded corners. For instance if I use the square tool to draw a square the outside corners of the stroke are rounded. I made sure that corner radius is 0 on the tool preferences and under the custom for the stroke Square corners is checked. The inside of the stroke is square but the outside is rounded. Any suggestions?

Thanks.

Drawing A Square Headache
Hi im in the midst of my basic drawing program and im coming up against some brick walls
I can draw a line no problem but i cant seem to draw a square from where the mouse pointer is.
The result im getting is a big box that starts from the top left that can be dragged over the canvas (my_mc)
Heres the relevant functions

HTML Code:
_root.i = 1;
_root.ivalue = 0;
this.my_mc.onMouseDown = function() {
this.onMouseMove = function() {
if (this.hitTest(_root._xmouse, _root._ymouse, true)) {
// Create a blank movie clip per succesful hit test and mouse move
this.createEmptyMovieClip("myShape"+_root.i, this.getNextHighestDepth());
this.myShape = eval("this.myShape"+_root.i);
// Pen tool
if (_root.tool == "pen") {
if (_root.ivalue != _root.i) {
_root.ivalue = _root.i;
this.myShape.lineStyle(_root.pt, _root.frontColor, 100);
this.myShape.moveTo(this._xmouse, this._ymouse);
} else {
this.myShape.lineTo(this._xmouse, this._ymouse);
}
}
if (_root.tool == "sqr") {
trace('tool = sqr');
//draw a square with a red fill
point = new Object();
point.x = _root._xmouse;
point.y = _root._ymouse;
toX = point.x;
toY = point.y;
this.myShape.beginFill(_root.frontColor, 100);
this.myShape.moveTo(0, 0);
this.myShape.lineTo(toX, 0);
this.myShape.lineTo(toX, toY);
this.myShape.lineTo(0, toY);
this.myShape.endFill();
}
}
};
};
this.my_mc.onMouseUp = function() {
_root.i++;
trace(_root.i);
delete this.onMouseMove;
};
the _root.i makes an empty movie clip each time the mouse is pressed on the canvas(my_mc) So if the mouse is dragged the movie clip name is the same.
Thanks in advance

Creating Square - Drawing API
I know how to code to create Square/Triangle thru Drawing API.

But can't stuck on this readymade squares/triangles, I wan to draw a square thru Mouse.

Problem In Drawing A Square/rectange.
Hai!!
I have created a MovieClip using CreateMovieClip to draw a square or Rectangle. The problem is when mouse Moved it , it is creating many number of squares below it.

Here is the code which i ve tried...........

var sx:Number;
var sy:Number;
var swid:Number;
var shitee:Number;
var mouseListener:Object = new Object();
mouseListener.onMouseDown = function () {
this.isDrawing = true;
sx = Number(_xmouse);
sy = Number(_ymouse);
};
mouseListener.onMouseMove = function () {;
if (this.isDrawing) {;
swid = Number(_xmouse-sx);
shitee = Number(_ymouse-sy);
};
updateAfterEvent();
createbox();
};
function createbox() {
this.createEmptyMovieClip("square_mc",this.getNext HighestDepth());
square_mc.beginFill(0x0099FF,100);
square_mc.lineStyle(0,0x0099FF,100);
square_mc.moveTo(sx,sy);
square_mc.lineTo(sx+swid,sy);
square_mc.lineTo(sx+swid,sy+shitee);
square_mc.lineTo(sx,sy+shitee);
square_mc._alpha = 50;
square_mc.endFill();
updateAfterEvent();
}
mouseListener.onMouseUp = function () {
this.isDrawing = flase;

};
Mouse.addListener(mouseListener);

From Drawing API Shape To Shape Tween
I would like to take the shape I created with drawing api and shape tween it into a square via a tween. How is this done?

I have searched, but cannot find a howto for this.

Thanks!

Shape Drawing Api
Where exactle do I find the shape drawing api ? i.e. listing of methods etc

Drawing Shape
Hello,

Anyone know how to draw shape using ActionScript ? Like drawing rounded rectangle ... circle .... box

Thanks

Help With 'drawing' A Shape
Hi guys,
I started learning the basics of Flash a couple of years ago and have had a big 'gap' in my Flash knowledge in the last year or so and am really rusty now. I am trying to create an intro web animation which starts by effectively 'drawing' out a swirl shape. I have the finished swirl but how to I get Flash to 'draw' it? Do I have to use masks? Any help would be greatly appreciated.
luisack

Help Drawing A Shape
Hello...I want to draw a shape (circle, rectanlge), then position it somewhere y fill it with a color. I need it done with actionscript only. Is it posible??

than you very much

Drawing A Shape From A Txt File
I have a text file, which has X and Y coordinate values for a shape:

how can I place these X and Y values in an Array, then use this array to draw the shape? using actionscript

then turn this shape into a mc symbol

please help

Animation Of The Drawing Of A Shape
Could someone please offer some guidance, I am a fairly experienced flash user, however I have not been able to figure this out.

I am trying to animate the drawing of shapes
as an example: a circle, starting as a point that arcs out and around to finish as the whole circle shape

I have seen this and like it been done everywhere, is there a straightforward way of doing it via
animation & masking?
actionscript?

would appreciate any assistance or advice

Thanks!

Can't Break Apart My Drawing Shape
I'm following one of the tutorials in the beginners area and I'm having a time trying to figure out why my shape won't break apart...I just drew a simple thing with the pencil tool, on a new layer and made a keyframe and the "break apart" option is greyed out...can anyone help? No, it hasn't been made a symbol or anything like that...just a drawn shape.

Drawing Api Edit Shape
Hi,
I've looked around and haven't found anyting on this so i figured i'd ask. I'll explain what i'm trying to do first:

I want to import an image(containing a persons face) and then allow them to select points on oval shape that will be set to a mask(maybe 5 points?) that they can drag to make it so only their face is masked out.

I'm assuming i'd use the drawing api to do this. Is this correct and does anyone know if there are any tutorials out there that explain how to edit a shape in this fashion dynamiclly?

Thanks.
Paul

Drawing A Line From One Shape To Another
OOPS perhaps i should have posted this in the flex forum......I'm developing an application in Flex.

So I found out how to create shapes with the Drawing API. I also found out how to draw lines from a point (x1, y1) to a another (x2, y2).

I am going to try to explain this as easily as i can. I dynamically generate two triangles and add them to a canvas as follows:

var triangleHeight:uint = 100;
var triangle:Shape = new Shape();

// red triangle, starting at point 0, 0
triangle.graphics.beginFill(0xFF0000);
triangle.graphics.moveTo(triangleHeight/2, 0);
triangle.graphics.lineTo(triangleHeight, triangleHeight);
triangle.graphics.lineTo(0, triangleHeight);
triangle.graphics.lineTo(triangleHeight/2, 0);

// green triangle, starting at point 200, 0
triangle.graphics.beginFill(0x00FF00);
triangle.graphics.moveTo(200 + triangleHeight/2, 0);
triangle.graphics.lineTo(200 + triangleHeight, triangleHeight);
triangle.graphics.lineTo(200, triangleHeight);
triangle.graphics.lineTo(200 + triangleHeight/2, 0);

var uiWrapper:UIComponent = new UIComponent();
uiWrapper.addChild(triangle);
myCanvas.addChild(uiWrapper);

So one triagle is red then the one to its right is green. I can certainly connect both triangles by drawing a line between them like this:

triangle.graphics.lineStyle(1, 0xFF0000);
triangle.graphics.moveTo(50, 50);
triangle.graphics.lineTo(230, 50);

each triangle will have "drag and drop" functionality so heres is my question: how can I assign a point in each triangle so that the drawn line will be redrawn each time a triangle is moved? with the line drawing above that line is static. In toher words I need a dynamically drawn line that will adjust to the position of the triangles. Any ideas/tips/resources????? If lets say instead of triangles I used Button components is there a way to assing "connection points" to the buttons as well??? I would much rather use the buttons than the shapes but whatever gets me to the end....

Help!

Actionscript Shape Drawing...
With this following code I am drawing a box. Now, I would like to address the lines for each side of the box individually so that I can set their color individually. Any ideas?

PHP Code:

MainWindowClass.prototype.init = function() {
    // Create Color Object
    stage_mc_lineColor = (0x000000);
    stage_mc_fillColor = (0xCCCCCC);
    // Create Empty Movie Clips
    this.createEmptyMovieClip("stage_mc", 3);
    // Draw Box
    with (this.stage_mc) {
        lineStyle(.1, stage_mc_lineColor, 100);
        moveTo(-100, -100);
        beginFill(stage_mc_fillColor, 100);
        lineTo(100, -100);
        lineTo(100, 100);
        lineTo(-100, 100);
        lineTo(-100, -100);
        endFill();
              // Color lines individually...
    }
}

Preloading In A Shape Or Drawing...
hello,

I was wondering how a preload such as this is done:

http://foxbox.tv/winx_microsite/fairies.php

you see how the have a outline of the charactors and fill it up with a preload?

I know they're using a masking technique, but what is involved here?

Custom Shape Drawing
Hey all,

Just wondering if it's possible to draw custom shapes in flash, ie: dragging out a rectangle in photoshop.

any good links or advice on how to accomplish this would be greatly appreciated.

Animating A Drawing API Shape
Drawing API examples always seem to be either really simple or really complex. I'm interested in doing something fairly simple (I think). I'd like to draw an abstract curved shape with the Drawing API and animate the shape of the object to slowly change over time. Nothing really dramatic. Kind of like a lava lamp, I suppose. I understand this is done with movie clip control points but I haven't seen any examples I can understand. I'm attaching a file showing an example of what I mean (done with manual tween in MX 2004). Thanks in advance for your help.

Closing Drawing API Shape
I've been making changes to an Ivan Dembicki "elastic line" sample file. I'd like to close off the shape with a curved line so that the shape doesn't have a hard edge to it. Right now the shape fill closes off the shape (the shape itself isn't closed). I've tried various things but failed miserably. Anyone know how to turn this into a closed, rounded shape? I'll attach my file but this is what Ivan's drawing API code looks like:

Code:
p.onEnterFrame = function() {
this.clear();
//this.lineStyle(3, 0xFF0000, 100);
this.lineStyle(1, 0x4827CF);
for (var i = 1; i<this.arrMC.length-1; i++) {
this.update.apply(this.arrMC[i]);
}
var e, s = this.arrMC[0];
this.beginFill(0x4827CF);
this.moveTo(s._x, s._y);
for (var i = 1; i<this.arrMC.length; i++) {
s = this.arrMC[i-1];
e = this.arrMC[i];
var mx = (s._x+e._x)/2;
var my = (s._y+e._y)/2;
this.curveTo(s._x, s._y, mx, my);
}
this.lineTo(e._x, e._y);
this.endFill();
};
I'm working in Flash MX 2004. Thanks for the help.

Drawing Board Within A Shape
Heya everyone,

I've been reading up on this drawing board AS and I can get it to work easily by itself, however I want to be placed within a shape and I'm not sure how to adapt to do so (e.g. A drawing board within a circle outline)

Drawing Board
http://www.kirupa.com/developer/acti...awingboard.htm

Any help would be really appreciated

Natushi12

Drawing App That Recognises Shape
Hi,
im trying to make a small drawing app used to let people vote
so each item has a small drawing area next to it where people can draw a X or a √ (Tick)

so i was wondering if flash could do such a thing or if anyone has a other kind of solution

thanks

Drag Shape While Drawing Like Photoshop?
Is it possible to drag a shape while you are drawing it like in photoshop by holding down spacebar? I have not found a similar keyboard shortcut for flash. This would help me immensely. Please help! Thanks

[question]Is There A Way To Convert Drawing To Shape?
as above... i am currently drawing a bountry of a racing track for my car game. i realise my car unable to hit the bountry as i guess in order to detect the bountry, i need mc file need to contain shapes instead of normal drawing. is it possible to convert my drawing to shape?

[Q] Dynamic Shape Drawing Game
http://www.ferryhalim.com/orisinal/g3/floats.htm

This one puzzled me, how did he do the shape collisions?

Drawing A Shape Using Action Script...
how do you draw a shape using action script, eg...

you click in one place, then drag to another and let go, a circle appears between the two points

that kind of thing...

any help will be usefull

thanks

Converting A Shape Into A CS3 Drawing Object
Hello!

I've noticed that when I draw, say a square, in CS3, it becomes a "Drawing object" (like a symbol that doesn't appear in the library), instead of a pure shape like in Flash 8.

But let's say I break a drawing object down into a shape, how do I convert this shape back into a drawing object?

I like drawing objects, they're cool for simple shapes that I don't want in my library, and that I don't want to get distorted like pure shapes (despite being placed at integer positions) particularly in large documents.

Anybody know?

Thanks,
Kyrre

Adding A Stroke After Drawing A Shape?
I drew a circle on the stage using the oval tool and the stroke was set to none so it does not have one. I now want to add a stroke to it, so I select the entire oval by dragging over it and choosing black for the stroke color, though it will not apply the stroke to the shape. What am I doing wrong?

Thanks.

Drawing Gradientfill Shape Don't Work [as2]
Allright, i tried to draw a simple square shape with a gradient using an old s1 function. It didn't work. I check, with an exemple that macromedia give in flash mx 2004, what was wrong and nothing was wrong !!!!

This is the exemple code from macromedia give in the actionscript dictionary in flash mx 2004.

_root.createEmptyMovieClip( "grad", 1 );
with ( _root.grad )

{

colors = [ 0xFF0000, 0x0000FF ];
alphas = [ 100, 100 ];
ratios = [ 0, 0xFF ];
matrix = { matrixType:"box", x:100, y:100, w:200, h:200, r45/180)*Math.PI };
beginGradientFill( "linear", colors, alphas, ratios, matrix );
moveto(100,100);
lineto(100,300);
lineto(300,300);
lineto(300,100);
lineto(100,100);
endFill();
}

Nothing new, it's the same code in as2 then in as1. But it does'nt work.

What is the problem ?? Is 'Math.PI' the problem ?

any ideas, please share.

Drawing A Shape Behind An Existing Mask
Hi, I have a clip on my stage.

Their is only 1 layer in the shape.

On this layer is a shape which is a mask.

I am trying to place a dynamic fill behind this mask.
(so the dynamic shape is masked by the mask that is in that clip)

I cannot get it to function. I'm just using the draw command - but it keeps ignoring the mask? Any ideas>?

M@)

Drawing A Shape With A Fade From Color Til 0 Alpha
Hi

I was doing some assets loading and thought I would construct some bits of graphics myself, instead of using the ones laid out for me in photoshop.

The "new" drawing API is giving me a bit of trouble regarding fades/transparency.

I drew a simple square and using the gradient box I am trying to make that box fade from color to nothing, becoming completely transparent on the right edge and completely opaque on the left edge..

I have been fondling this script for 2 hours and cannot get it to behave as I wish to: (the above)

Code:
var gloss:Shape;

var fillType:String = GradientType.LINEAR;
var colors:Array = [0xFFFFFF, 0x000000];
var alphas:Array = [0.9, 0.1];
var ratios:Array = [0x00, 0xFF];
var matr:Matrix = new Matrix();

gloss = new Shape();
matr.createGradientBox(198, 36, (Math.PI/2)*-1, 0, 0);
var spreadMethod:String = SpreadMethod.PAD;
gloss.graphics.beginGradientFill(fillType, colors, alphas, ratios, matr, spreadMethod);
gloss.graphics.drawRoundRect(1, 1, 98, 28, 3, 3);
gloss.graphics.endFill();
I can only get it to fade from one color to another, not from one color to another with 0 alpha.

Is there a better way to go around this one.

Thanks

Using Drawing API Shape To Mask Another Movie Clip
I have a movieclip that contains code for an API drawing shape. I can use it to mask a movieclip containing an image but not a moviclip that contains a dynamic gradient. Does anyone know how to make this work?

Code:

// CREATE MASK SHAPE WITH DRAWING API
// create empty movieclip
createEmptyMovieClip("mc", 10);
// set total number of points
total = 10;
// set point & control-point coordinates
pt = [];
cp = [];
for (i=0; i<total; i++) {
pt[i] = {x:Math.random()*400, y:Math.random()*400};
cp[i] = {x:Math.random()*400, y:Math.random()*400};
}
// draw function
this.onEnterFrame = function() {
// clear the old drawing
// and draw a new one using
// the points & control-points
mc.clear();
mc.beginFill(0x0088B2, 100);
mc.moveTo(pt[0].x, pt[0].y);
for (var i = 1; i<total; i++) {
mc.curveTo(cp[i].x, cp[i].y, pt[i].x, pt[i].y);
}
mc.curveTo(cp[0].x, cp[0].y, pt[0].x, pt[0].y);
mc.endFill();
// set new positions
// for points & control-points
// and make sure they're inside stage
for (var i = 0; i<total; i++) {
pt[i].x += Math.random()*4-2;
if (pt[i].x<0) {
pt[i].x = 0;
} else if (pt[i].x>400) {
pt[i].x = 400;
}
pt[i].y += Math.random()*4-2;
if (pt[i].y<0) {
pt[i].y = 0;
} else if (pt[i].y>400) {
pt[i].y = 400;
}
cp[i].x += Math.random()*4-2;
if (cp[i].x<0) {
cp[i].x = 0;
} else if (cp[i].x>400) {
cp[i].x = 400;
}
cp[i].y += Math.random()*4-2;
if (cp[i].y<0) {
cp[i].y = 0;
} else if (cp[i].y>400) {
cp[i].y = 400;
}
}
};
// CREATE ANIMATED BACKGROUND
createEmptyMovieClip("background_mc", 1);
//trace(targetPath(_root.background_mc));
onEnterFrame = function () {
r1 = Math.sin(ra1 += .002)*50+51; //default for all: 127+128
g1 = Math.sin(ga1 += .004)*50+51;
b1 = Math.sin(ba1 += .006)*127+128;
r2 = Math.sin(ra2 += .001)*50+51;
g2 = Math.sin(ga2 += .003)*50+51;
b2 = Math.sin(ba2 += .005)*127+128;
col1 = r1 << 16 | g1 << 8 | b1;
col2 = r2 << 16 | g2 << 8 | b2;
matrix = {matrixType:"box", x:0, y:0, w:740, h:466, r:0};
with (background_mc) {
clear();
beginGradientFill("linear", [col1, col2], [100, 100], [0, 255], matrix);
lineTo(740, 0);
lineTo(740, 466);
lineTo(0, 466);
lineTo(0, 0);
endFill();
}
};
_root.background_mc._x=0;
_root.background_mc._y=0;
// SET MASKING - WORKS WITH CLIP CONTAINING IMAGE ONLY
//_root.image1.setMask(_root.mc);
_root.background_mc.setMask(_root.mc);

Flash Drawing: Fill A Drawn Shape
Hey guys, I'm not familiar with the flash drawing api at all so I've come here

I've got a simple thing that allows you to draw lines. So lets say I draw a triangle or random closed shape with the mouse. How can I fill that with a color or bitmap?

Mac OS X Dock-type Effect By Drawing A Shape
I'm looking to create an effect similar to how the dock grows in OS X when a user rolls over a particular area of a gradient. Basically, I'd like to draw a gradient on the bottom of the stage, then depending on where the user moves the mouse, the top path of the gradient bows out a bit to follow the mouse's x location.

Has anyone seen any sample code to create this type of effect or done anything similar? If not, can anyone help me get started?

Thanks!

Drawing A Shape With Its Center Aligned With Crosshair Automatically
Hi all,

Does anybody know how I could draw a shape (such as oval or rectangle) in a movie clip and have the center of the shape quickly aligned with the crosshair without me adjusting it with arrow keys? Thanks.

- boon

[F8] Generating Square And Square Root Expressions In Flash
How would u generate x^2 in flash.... the actual expression?
Thanks..Also how would you generate square root of x in flash...the expression?
Thanks in advance

How Do I Cut A Square Out Of A Larger Square Using Actionscript
I want to use actionscript to draw a square in a larger square that appears as a hole or window in the larger square. I know how to use AS to draw a square, but I can not seem to find a way to cut one square out of another. Does anyone know how to do this?

Trying To Show "drawing" Effect Along Line Of A Shape
I am trying to get a simple shape to "draw".. I found this tutorial
http://actionscript-toolbox.com/shapeDefinedMC.php - that's what I'm going for - just drawing the lines - but this tutorial is over my head!

I created a shape with the Flash pen tool, put it in a MC (shouldn't this then be a 'shape defined MC' at this point?) and tried:

onClipEvent (load) {
this.drawAlong({width:2, color:0x0000aa, alpha:100}, 2, {npts:20, type:'b', fixed:false}, 25);
}

I know I must be missing something... can anybody help?