Drawing API - Remain on component
I'm trying to build a component which uses the drawing api to
draw half circles radiating up from the bottom. I draw the circle
with the center point on the bottom of the component. The drawing
api is happy to draw the circle with the bottom half of the circle
below the component being drawn on. How can I avoid drawing outside
the component which the graphic property is being used?
atta707 is correct with that information. If you don't want
to worry about drawing within the boundaries you can add a clipping
mask to the component.
var clipper:Sprite = new Sprite();
clipper.graphics.clear();
clipper.graphics.beginFill(0);
clipper.graphics.drawRect(0,0,unscaledWidth,unscaledHeight);
clipper.graphics.endFill();
Now assign this to the mask property of the component and add
it as a child of the component:
mask = clipper;
addChild(clipper); // I don't remember off the top of my head
if this step is necessary
Put this code in your component's override of
updateDisplayList(). You can create the clipper in the component's
override of createChildren() if you don't want to create it in
updateDisplayList().
Similar Messages
-
Hello
I made a k-children tree algorithm in Java. Now I'm looking for a ready-made API/classes for drawing the tree.
Anyone knows any good tree drawing APIs?
I searched google for hours and couldn't find anything.
Thank youHere are some links that you may find usefull:
An interactive canvas component where you can paint any shapes:
https://jcanvas.dev.java.net/
A graph library:
http://jung.sourceforge.net/
Another graph library:
http://graph.netbeans.org/ -
Drawing API within attachMovie instances
Hi I am trying to get curveTo to work within attachMovie
created instances where the _x coordinate of each movie lines up
with the _x coord plus width of the previous. Each movie is a
square of differing dimensions.. All works fine apart from the
curveTo which whatever i try does not come out as expected (all
curves should look like the first one but scaled according to the
dimensions of its containing square). I must be misunderstanding
the relative coord settings or something but i have tried every
combination. Can any one help? I'm at the tearing my hair out
stage.
SWF can be viewed at:
http://www.widecombefair.com/draw/spiral3.html
and the fla file at
http://www.widecombefair.com/draw/spiral3.fla
also see code below
Many thanks in advanceHi Rothrock
I will have a go without using attachMovie. Will it make a
difference?
I appreciate I could draw the squares and draw the curves
straight onto the stage, but I arrived here from component classes
where I had a square class and a curve class and used
createclassobject to get them on stage (I also had a 3rd class for
the square border). If I can get this basic approach to work then I
will have something from which to build.
With luck stwingy's answer will fit the bill but I really
want to understand how the empty movieclip and its parent are
related in terms of the drawing api. I can't fathom the ligic.
Many thanks for your help so far. -
Flattened circles in drawing api
Hi Guys
When I use the drawing api to create circles, sometimes they
appear flattened, as if the edges had been sliced off. Below is the
code. Can anyone tell me how to fix this?
// extends UIComponent
public function CircleThing ()
super();
mouseChildren = false;
buttonMode = true;
//resetCircle();
base = new Sprite();
baseOver = new Sprite();
label = new TextField()
label.autoSize = TextFieldAutoSize.LEFT;
label.multiline = true;
label.wordWrap = true;
label.width = 108;
label.x = -52;
addChild(base);
addChild(baseOver);
addChild(label);
addEventListeners();
//label.border = true;
//label.borderColor = 0xff0000;
//addChild(label);
//resetCircle();
//addListeners();
// This function creates the blue circle
public function drawCircle(_name:String=null):void
trace ('NavCircle drawCircle');
var myFilters:Array = [new
DropShadowFilter(5,135,0x000000,0.15,5,5)];
//base.name = _name;
base.graphics.clear();
base.graphics.beginFill(_color, .9);
base.graphics.drawCircle(0, 0, defaultDiameter/2);
base.graphics.endFill();
base.filters = myFilters;
// added djg draw overCircle
baseOver.graphics.clear();
baseOver.graphics.beginFill(_overColor, 1);
baseOver.graphics.drawCircle(0, 0, defaultDiameter/2);
baseOver.graphics.endFill();
baseOver.visible = false;
}I'm not sure about tutorials, but read up on the
flash.display.Graphics class. Your Canvas has a graphics property
and that's where you draw. Here's how to draw a red circle 50
pixels in diameter:
graphics.clear();
graphics.beginFill( 0xff0000 );
graphics.drawCircle( 100, 100, 25 );
graphics.endFill();
You should do most of your drawing in the updateDisplayList
function - just override it (in a Script block if using
MXML). -
Hi,
I've got a serious problem and I hope that someone can help me. I worked on a project in PE 3 when suddenly a message popped up saying that an error had occurred and PE had to shut down. Every time I try to open this project now (also the auto-save files), the error [..\API\Inc\BE/Component/Keyframe.h-138] occurs and PE shuts down immediately.
I looked in several forum discussion where other users reported this bug. Solutions were offered e.g. changing the regional and language settings as the error only occurs with non-english systems (mine is German), using a perl one-liner etc. I tried everything but the problem is not resolved still (I must admit I'm not very familiar with perl and all that but I followed all the instructions given and failed).
I use Windows Vista Home Premium, got an Intel Core 2 CPU with 2.4 Ghz, 2GB RAM and plenty of hard drive space.
Can anyone please help me? I would be really grateful because I put a lot of work in this project which also has to be finished within two days... Thus I really need your help betimes.
Thank you in advance
Moritz BrockhausFirst, if you haven't done so already, resize any photos you're using in your video down to no larger than 1000x750 pixels in size. The single reason this program crashes is because people load it with photos directly from a digital camera, which can be 20-25 times the size of a video frame.
Using smaller photos will not only save your resources but will speed up the rest of your processes later, when you output your DVD or video.
If that doesn't help, it's possible the program is still overtaxed by working with non-DV-AVI files and what seems to be about two hours worth of source files (even if you've trimmed that down to 45 minutes). I usually work on my videos in 10 or 15 minute sequences, which I output as AVI movies and combine in a final mix. When I do this, I never have a problem with the computer lugging or throwing up error codes. Here's how:
http://www.adobeforums.com/webx/.3bbe608f
But, for now, reboot and defragment your drive and see if you can at least get your project open. If you're still getting error codes, something may have corrupted. But, more likely, you've just got too much going on at the same time. -
Behaviour of lines in flash drawing API
Hello everyone
I wanted to ask a question is it posible to move the line drawn with flash drawing API behind the objects that this line connects.
For example if I have a two movieClips that i connect with line i can see that line atop of those MovieClips.
thanks for help in advanceHow you get the line "on top" will depend on how the rest of the objects on the stage are organized. If everything is drawn directly to the stage and not enveloped in other objects then adding the line to the display list last will place it in a position on top of everything else by default.
-
How to best optimise Shapes produced by Drawing API?
I'm building an iPad app that allows a user to draw shapes using the finger. Simple logic:
holder = new Sprite();
addChild(holder);
// then based on touch events
holder.graphics.moveTo( e.stageX, e.stageY );
holder.graphics.lineTo( e.stageX, e.stageY );
// etc
What I see is that the SWF on the desktop runs at constistent 25fps. When run on the iPad it slows down significantly once you start drawing, usually as slow as 4fps.
I tried adding
var matrix:Matrix = new Matrix();
holder.cacheAsBitmapMatrix = matrix;
holder.cacheAsBitmap = true;
but that seems to have no effect. Am I looking in the right place? Are there better ways to optimise this?
Thanks
StefanI spent a bit of time fighting with this one as well. It seems that no matter what I do through Flash's drawing API I just can't seem to get good quality from my objects.
From what I can tell the only way to achieve quality is to create the shape in Photoshop first and have it inside of Flash as a bitmap. I also set cacheAsBitmap and applied a cacheAsBitmapMatrix to the containing MovieClip, although I'm not sure if it made a difference since it apparently already applies this for Bitmap objects...I think.
Anyways try that and you'll see substantially better quality.
It would be nice in future release to see vectors utilize the iPhone's vector capabilities. -
Recreating a program interface with the drawing API?
Hey there all!
I've been out of the developing arena for awhile, so please
bear with me.
I'm currently doing a road trainer gig, and it would help me
out tremendously to have a Flash version of the software I'm
providing training on. Can someone point me in the right direction
to find the ActionScript for drawing a specific programs interface?
I'm going to be needing databaseing info too, but that's
another question :-) .
Thanx in advance!
TeeCeei don't know why you would draw an interface, but the flash
drawing api can be found under the movieclip methods: lineStyle,
moveTo, lineTo, curveTo, beginFill etc. -
Flash Drawing API error?
Hi!
I think Flash drawing API is not working like it should...
Test this:
var W:Number = 12;
var H:Number = 12;
function drawRectExt():void
this.graphics.clear();
this.graphics.lineStyle(1,0xFF0000);
this.graphics.beginFill(0xFFFFFF, 1);
this.graphics.drawRect(0,0,W,H);
this.graphics.endFill();
function drawRectInt():void
this.graphics.lineStyle();
this.graphics.beginFill(0xFF0000, 1);
this.graphics.drawRect(W*0.2,H*0.2,W-W*0.4,H-H*0.4);
this.graphics.endFill();
drawRectExt();
drawRectInt();
This is the result (and the error?):
Why Flash doesn't draw the inner box (red) in the middle of the outer box?Hi again kglad!
first I want to thank you for your help with this..
now, I have tested your code with "intSqSide = 7;"
and it looks good at 100%, but if you zoom it you will see that it's not centered.
In numbers, with intSqSide = 7, the code looks like this:
function drawRectExt():void {
this.graphics.clear();
this.graphics.lineStyle(1,0xFF0000);
this.graphics.beginFill(0xFFFFFF, 1);
this.graphics.drawRect(0,0,12,12);
this.graphics.endFill();
function drawRectInt():void {
delete this.graphics.lineStyle();
this.graphics.beginFill(0xFF0000, 1);
this.graphics.drawRect(3,3,7,7);
this.graphics.endFill();
My last version was:
function drawRectExt2():void
this.graphics.clear();
this.graphics.lineStyle(1,0xFF0000);
this.graphics.beginFill(0xFFFFFF, 1);
this.graphics.drawRect(-0.5,-0.5,12,12);
this.graphics.endFill();
function drawRectInt2():void
this.graphics.lineStyle();
this.graphics.beginFill(0xFF0000, 1);
this.graphics.drawRect(2,2,7,7);
this.graphics.endFill();
I think it's logic to offset in X and Y direction the width/2 of the line. Because Flash draws the line centered, there should be an option to change that, like in Illustrator, where you can draw the stroke centered, aligned to inside or aligned to outside.
I don't know why Flash does not support this feature!
It's really frustrating to draw lines in this way. If I draw a box with 12px side and 1px contour, I want that box with those values! not 11px inside, and not with an offset of half pixel in each side!. -
Color Tweening using Drawing API
Hi, I have a function that draws a shape. The color value can
be passed in as a parameter. I have called this function quite a
few times. All of the objects start off the same color.
I want to know how to randomly make each one switch color
immediately (like a light bulb, on, off)), over a set period of
time
Anyone any ideas?
ThanksWhen you say bezier curves I presume you mean quadratic
bezier curves that the native drawing API uses? Or are you
converting spline data or cubic beziers to native drawing api
parameters from the .net data in flash as well? Some of these
calculations can take time for large data sets if done with an
emphasis on highly accurate approximations in flash.
Here are a bunch of questions I could think of:
How are you receiving the drawing data? are they coming in
via xml, for example? (Are you sure its the drawing activity that
is slow and not the parsing of data). Are they coming in as 5000
points or incrementally over time?
Are you clearing and redrawing from the start of drawing
sequence each time (it seems not, but just wanted to check)?
Are you drawing to a single Sprite's graphics context or are
you creating layered Sprites to hold subsequent portions of the
rendered drawing?
when you say 'rotating the cursor' along the path...are you
animating anything as well? How are you checking the point
intersection - bounds based? or against a rendered shape?
The last thing I can think of is: are you using some of the
advanced lineStyle settings? some of these settings can slow things
down substantially with large and complex drawings, whereas other
settings are much faster. Also even specifying the default settings
can be slower than not specifying them. But again, this is usually
only noticeable for very long drawing paths.
Your post doesn't have enough information to advise directly,
but perhaps if you answer those questions it might provide us some
clues. -
Select area through Drawing API
Hi,
I am working on Custom Kitchen Project and want to know if
some one take a picture and import into the flash project then I
just want to know how user can create or draw a random shape to
select certain area, by using Drawing API
Example is below Just wana know how he did the selection
part?
http://www.century21.com/search/map.jsp?wheresync=City,%20State%20or%20Zip
Thanks in advance.
Freddywhat's the problem? your like displays a basic use of the
drawing api. -
FP9 vs. FP10 Drawing API
Hey all,
I created a program that uses the drawing API to draw a
graph of some river level data downloaded from the web. Basically,
it will download a TAB delimited file, parse it, and draw a graph
of the past 7 days using solid rectangles. The graph draws on by
setting some timeouts and tweening the rectangles on so they slide
up from the bottom. When it runs well, it appears as if the graph
is flowing on from left to right. There are a few different graphs
that the user can choose from, and each time, the program reaches
out to the web so it can grab the most recent river level data.
When I first programmed it, I was using Flash Player 9 and it was
working well. Now that I am publishing with Flash Player 10, after
a few graphs are drawn, the drawing starts to slow down so that the
flowing on is very rough, and after they have looked at maybe 7
graphs, it almost comes to a stop. The graph still appears, but it
seems to hang as it starts to draw, and then appears all of a
sudden. So, the program is not updating as the graph draws on, but
it happens in the correct amount of time. There are a few different
methods being used here, with the timeouts and tweens, but since it
seems to degrade over time, I feel like it must be something with
the drawing API. I am removing the old graphs completely, as far as
I know, and only one is drawing at a time. The thing that is
puzzling is that it works very well with FP9, but not with FP10. I
was hoping someone had some thoughts as to differences between the
two that would manifest themselves in a way I am describing. Of
course I realize that I could just publish with FP9, but there are
a few reasons I want 10 to be used that 9 will not help with.
Thanks...
- Bthanx,
that was useful, your solution worked fine...
I still have a little problem:
I tried different actions to be performed as the tween ends:
1. remove the object (parent.removeChild)
2. set it as invisible and put it on an array for later async remove
4. add it as a child of another sprite
I then put on the stage 10 instances of M1 and let them all tween,
everytime one of those instance ends its tween (and performs one of the final action
described above) there's a little delay that freezes for a little time all the other tweening instances....
I thought that the removeChild was the delaying part but I saw that also setting visible=false
brings the same delay...
I was then wondering if there's a smart way to handle this and let everything run smooth...
thanks -
Drawing API animate??
Hi guys, i have only recently started with Drawing API, and
im getting the hang of it. But i was wondering if it's possible to
tween the lineTo method??
for example, im rounded rectangle at runtime, but i dont want
it to just " appear " , say i wanted it to " draw it's self "
like tween the outline first, then fade in the fill.
is that possible? if so, what code would i use to animate the
drawing process?
Thanx guys.Sketchsta,
> Hey David, i only just saw your post after i replyed..
uum,
> could you give be the basis of how to use the
setInterval ?
The setInterval() function can be run in more than one way.
The basic
way is to provide it two parameters: a) another function to
run, and b) a
time interval at which to run this other function. That's
really all there
need be to it.
> cuz i only used it once, but i didnt know how to stop
it, it
> kept going forever, till my com was struggling.. then i
found
> clear() ... now my comp has no problem, but i still cant
> stop the line.. anyway, off the point...
That's not off the point. ;) Sounds like that's exactly what
you need
to figure out now. The clearInterval() function stops a
particular
setInterval() loop. How does it know which loop to stop? The
answer is,
you provide clearInterval() with a number. This works a bit
like those
lines at the deli section where you "take a number" and they
eventually call
it.
setInterval() provides a return value, just like many (but
not all)
functions. The getTimer() function, for example, returns a
number that
represents how many milliseconds have passed since the Flash
movie began.
The isNaN() function returns a Boolean (true or false) value
that tells
whether a given value is "not a number." Well, setInterval()
returns a
value that indicates the number of its latest usage. The
first time you use
setInterval(), it sets up a scenario whereby it repeatedly
calls the
function you pass it at the time interval you pass it. This
is the first
such scenario, and so the number it returns is 1. The next
time you use
setInterval(), it sets up a second scenario -- calling some
other function
you provide, or the same one -- and this time it returns 2.
The third time,
3, and so on.
Conveniently, you don't have to keep track of this. You can
store the
return value of setInterval() in a variable and use the
variable as a
parameter to clearInterval().
> could you give me an example of how to set it up?
var id:Number = setInterval(drawingFunctionHere, 30);
In the above line, an arbitrarily named variable id (which
will be a
number) is set to the return value of setInterval(), which in
this case
calls an arbitrarily named function, drawingFunctionHere
every 30
milliseconds. Whenever you see fit (such as when your drawing
is finished,
and only you'll know that), you can call clearInterval() and
pass in that id
variable.
clearInterval(id);
That stops the repeated call to drawingFunctionHere(). Of
course, the
first time around, you could use clearInterval(1) -- but
again, there's just
no reason to keep track of the interval numbers yourself. You
can re-use
that id variable as often as you need.
David Stiller
Adobe Community Expert
Dev blog,
http://www.quip.net/blog/
"Luck is the residue of good design." -
I am creating a car driving game in Flash 8. Im using the Drawing API to make the car leave tracks as it moves using the following method:
lines = {}
_root.createEmptyMovieClip("pen", 10)
pen.lineStyle(10, 000000, 6)
pen.moveTo(this.car._x, this.car._y)
_root.onEnterFrame = function(){
pen.lineTo(this.car._x, this.car._y)
segments += 1
name = "line"+segments
lines[name] = [this.car._x, this.car._y]
A requirement of the game although is that the tracks fade after 2 - 3 car lengths and I was not sure if this was possible using the method I have already implemented.
Any help would be much appriciated!to adjust the rate of fade, change the 2nd parameter in the setInterval() function and the 2nd parameter in setTimeout. in fact, if you want a rapid fadeout, remove the setTimeout and just call startfadeF(pen):
lines = {};
var dep:Number = 0;
this.car.prevX = this.car._x;
this.car.prevY = this.car._y;
_root.onEnterFrame = function() {
var pen:MovieClip = _root.createEmptyMovieClip("pen"+dep,10+dep++);
pen.lineStyle(10,000000,6);
pen.moveTo(this.car.prevX,this.car.prevY);
pen.lineTo(this.car._x,this.car._y);
this.car.prevX = this.car._x;
this.car.prevY = this.car._y;
setTimeout(startfadeF,2000,pen);
segments += 1;
name = "line"+segments;
lines[name] = [this.car._x, this.car._y];
function startfadeF(pen:MovieClip){
pen.fadeI = setInterval(fadeF,50,pen);
function fadeF(pen:MovieClip){
pen._alpha -= 3
if(pen._alpha <= 0){
clearInterval(pen.fadeI);
pen.removeMovieClip()
updateAfterEvent(); -
I am about to start this project where the background on a
full browser flash site has a number of shapes. Ideally and I am
not sure if this is even realistic, I would like the shapes to have
a slight mouse interaction. While the mouse will respond to button
etc in the front, behind the content, on the background, it should
create slight interaction, such as slight wobbles of the shapes
there, slight nudges, etc.
I have used the drawing API for simple things, but I am
wondering how hard it is to create some more organic shapes. Can I
have circles that have slight dents in them? Bows? How hard is
that?use the jpegencoder class to encode your jpeg and the urlloader class to send to your asp. eg, to save mc:
import JPEGEncoder;
var bmpd:BitmapData=new BitmapData(mc.width,mc.height);
bmpd.draw(mc);
var jpegEnc:JPEGEncoder = new JPEGEncoder(75);
var jpegDat:ByteArray = jpegEnc.encode(bmpd);
var ldr:URLLoader=new URLLoader();
var header:URLRequestHeader = new URLRequestHeader ("Content-type", "application/octet-stream");
var url:URLRequest = new URLRequest ("youraspfile.asp?name=snapshot.jpg");
url.requestHeaders.push(header);
url.method = URLRequestMethod.POST;
url.data = jpegDat;
ldr.load(url);
in php the image data is
$GLOBALS["HTTP_RAW_POST_DATA"];
so you'll need to translate that to asp and save it to a file named by the name variable sent via GET.
Maybe you are looking for
-
I have an album that's in a playlist under a certain artist in itunes but it won't sync to that particular playlist or artist on my iPod touch. Yet on my ipod I can search for it under albums and its there, but still not there under that artist. what
-
TutWD_EmailInteractiveForm_Init.zip password protected
Hi, I am trying to start with a tutorial on offline interactive form based on sending and receiving emails and in this tutorial there is a reference to TutWD_EmailInteractiveForm_Init.zip that can be used as a starting point (it is a predefined web d
-
Uploading photos from Aperture3 for others to download?
I want to upload photos to icloud , so the friends can see and download them. Wasn't that a feature of mobileme? Where has that gone? Can't find it. Got all the newest software.
-
Hi i`m am such a newbie to java and am struggling to get it running on my pc. What i have done is this: DL the JDK update 10: DL Crimson Editor: i have gone into my enviroment variables and placed C:\Program Files\Java\jdk1.6.0_10\bin at the path var
-
Using MacBook (2007) with Apple High Resolution Monochrome Monitor (1987)
I was looking around my basement and came across an old, unused Monochrome Apple Monitor (MO400). I was wondering if my 13" MacBook would be able to use this monitor as an extra display. The monitor has a DVI port and cable, and I have a Mini DVI to