Flash - Programmatically Draw A Scalable, Curved Comic-book Balloon Tail?

Aug 13, 2010

As a UI specialist, I am often asked to build tool-tip displays and other sorts of popups that display text. One of styles clients seem most keen on is text in a comic-book balloon. I would like to create this balloons programmatically (as opposed to embedding or linking to rendered graphics), because these balloons will have to change size at runtime, depending on how much text they have to hold.

Balloons are easy to draw for the most part: circles, rectangles or rounded-corner rectangles. The tough part, for me, is the tail (the little arrow-like part of the comic balloon that points towards the speaker). If you google comic balloon, you see that there are many varieties of tails. They ones clients request from me most often are curved. E.g...

[URL]

The tail will always be on the bottom of the balloon, and it will sometimes point left and sometimes point right. I have been trying to come up with tail-drawing algorithms for a while, but I'm not happy with the results. I'm basically stumbling around in the dark, changing variables, looking at the results, and using trial and error to try to move closer to the magic numbers that will work. "Work" just means a result that looks pleasing, which I realize is subjective. Most of my clients will be a happy with anything that looks reasonably good and professional.

I want this result to scale. And it would be great if it could work with as few inputs as possible, maybe just isFacingLeft, tailWidth and tailHeight (Which could maybe be a percentage of the whole balloon). Maybe an adjustable curveAmount.

If it matters, I'm using Flash/Actionscript, but any system that has some sort of turtle graphics engine should work pretty much the same way: I'm working with that standard flipped Cartesian grid (y increases downward), x and y coordinates, the ability to move a pen, draw lines and draw curves.One caveat: Flash only allows me to draw 3-point bezier curves -- start point, control point, end point.

Note: balloons won't have to scale after the are drawn.

View 1 Replies


Similar Posts:


ActionScript 2.0 :: Draw Text On The Board When Drag The Balloon

Sep 26, 2004

I have a drawing board created and a comic speech bubble clip created. The clip is draggable and text can be inputted into it. The problem is that I don't want to draw on the board when I drag the balloon. See the fla attatched!

View 3 Replies

Draw A Curved Line In Flash?

Jul 16, 2009

I'm trying to draw this hint box and was wondering if anyone could explain to me how to draw a curved line like the one below in flash?

View 4 Replies

ActionScript 3.0 :: Flash Drawing API Draw The Curved Lines?

Jun 17, 2011

I made this one poor class that has a public function which draws with a single loop a shape with curveTo() function (I tested one option to draw straight lines with lineTo() and only curved lines with curveTo() function but in my opinion, that lineTo function where a bit slower, at least in my implementations of testin speeds).I sent to it four parameters (anchor points and the control points) as many times as there were some corners to draw and everything seemed to go well untill I checked which way is faster to draw single rounded rect. Flashs own way beats my version up with huge 120 m/s distance already in some 100 000 iterations. The format of data I tested to send to my class function to draw that goddamned thing were numbers in arrays, numbers in objects and numbers in my own class objects like linked list and the file that holds just four numbers included in arrays or linked list. And two separate arrays, one for anchor points and one for the control points, with just Point Objects were fastest (if I remember correct) way but still that 120 m/s slower than Drawing API in Flash.My function in the class where something like:

ActionScript Code:
public function drawShape(points1:Array, points2:Array, lineOn:Boolean = false, fillOn:boolean = false, lineThickness:Number = 1, lineColor:uint = 0, lineAlpha:Number = 1, fillColor:uint = 0xff, fillAlpha:Number = 1):void{[code]..........

View 7 Replies

ActionScript 2.0 :: The Flash Draw The Randomly Curved Lines With Gradient And Moves Up And Down?

Apr 10, 2007

if you look at [URL] and check out the amazing background it has! how to place flash background, i know how color changing works, but how does the flash draw the randomly curved lines with gradient, and moves up and down? here is the link to the background flash [URL] as far i can tell, the lines are done purely in action script, because the whole thing is only 47kb

View 5 Replies

Flash - Programmatically Draw A (drop) Shadow?

Jul 21, 2011

This probably goes for all programming languages. I use Adobe Flash AS3 and for some reason that is boyond this post, I cannot use built-in dropshadow filters. I do, however, have bitmap data available, with color and alpha values. So there should be a way to draw my own dropshadow filter.... right? Any good existing algorithms I should go and check out? Not specifically looking for an AS3 implementation, any other example will probably allow me to convert the code.

View 1 Replies

ActionScript 3.0 :: _Slowly_ Draw A (curved) Line?

Aug 21, 2009

Here's the effort simply displayed: http:[url].....it uses curveto to show the arc of a doorswing.I'd like the drawn arc instead to appear/trail along the leading edge of the door _as_ the door swings open. Guide Layers AS2 led me to tweening AS3 class but the beginning and end objects weren't right. Am I in the wrong place? This seemed somewhat straightforward but perhaps I'm searching for the wrong keyword(s.

View 4 Replies

Draw A Continuous Curved Line From 3 Given Points At A Time?

May 10, 2011

I am trying to draw a continuous curved line in flash. There are many methods but none of the ones I have found so far quite fit my requirements. First of all, I want to use the flash graphic api's curveTo() method. I DO NOT want to simulate a curve with hundreds of calls to lineTo() per curved line segment. It is my experience and understanding that line segments are processor heavy. Flash's quadratic bezier curve should take less CPU power. [code]...

View 3 Replies

ActionScript 3.0 :: Draw A Curved Path In Flash - Use Path Data

Aug 31, 2011

Is it possible to draw out a path in the flash editor, set its visibility to hidden, and use this path data to animate objects in AS3?

View 1 Replies

ActionScript 3.0 :: Programmatically Draw Arrowhead?

Jun 4, 2010

how to draw an arrowhead facing either left or right programmatically with as3? The arrowhead should be a filled triangle pointing either left or right.

View 10 Replies

IDE :: Create A Web-comic With Flash CS4?

Aug 24, 2010

I am trying to create a web-comic using flash cs4. This is the first time that I use this program, but I understand that what im trying to do can be easily done.All I need is basically a Previous and Next button like a slideshow.[URL]

View 1 Replies

ActionScript 3.0 :: Flash - Create A Web-comic With Flash CS4?

Aug 24, 2010

I am trying to create a web-comic using flash cs4. This is the first time that I use this program, but I understand that what im trying to do can be easily done.

All I need is basically a Previous and Next button like a slideshow.

Reference: [URL]

View 1 Replies

ActionScript 2.0 :: Make A Flash Movie Scalable?

Feb 5, 2009

how to make a flash movie scalable? So it can resize without pixelating etc.?

View 0 Replies

Flex :: Most Scalable Web Stack For High Performance Flash?

Jun 11, 2009

I am in the planning phase of a new multi-user client/server app using Flash via Flex and AIR. I am trying to decide which web platform/stack is the best suited for this? I have used RoR in the past, but as i understand, RoR is single-threaded, and is therefore not the ideal choice for handling potentially thousands of simultaneous requests. I have done some reading about Scala and Lift and that is an intriguing option, but i was wondering if there are other languages/frameworks out there that would work well for my project?

View 3 Replies

ActionScript 2.0 :: Create A Scalable Flash Movie That Doesn't Scale The Contents?

Nov 16, 2009

I've created a flash file which loads an image using loadMovie, this all works fine but what I need to be able to do is load different size images into the swf. I have tried changing the size of the swf in the embed tag and using the 'noscale' option, however the stage appears to be moved to the center (see screenshot), I need it to be at the top left.

I've also tried passing the new width and height to the swf via flashvars and then setting the size of the stage to these values, however this makes no difference to the outcome.

how I can create a flash movie that I can scale using the width and height parameters that doesn't scale the content and keeps the content in the top left corner?

View 2 Replies

ActionScript 1/2 :: Make A Zoomable Comic?

Feb 25, 2011

I am trying to make a comic by putting the comic in a movie clip called graphic_novel (also the instance name) but I want to have individual thumbnails in the comic zoomable so that if you hover over them then you get a further zoom into each thumbnail of the comic.

So far I have the following actionscript on the main comic which also has a motion tween between frame 1 and 20 so that it zooms in or out over that amount of frames.

The zoom works fine but I have tried numerous methods of creating invisible movie clip buttons over the individual thumbnails and tried to add similar actionscript to make a further zoom. Basically I want to navigate around the comic using zoom in zoom out.[code]...

View 5 Replies

ActionScript 2.0 :: Make The Text Balloon Appear On Mouseover?

Feb 3, 2007

I made a worldmap which is a movieclip, and inside that worldmap I create dynamicly project icons which contain a text balloon with some short information about that project.The problem I'm facing is that I want to make the text balloon appear on mouseover, and when I press the movieclip, it goes to another page.I've been trying this for a while but I can't find a good solution, onRollOver and onPress on movieclips won't work, and I have no clue how else I could do it. The reason why I add them inside the worldmap is because I want to zoom in and out or move the map in certain directions.when I zoom in and out on the map, the icons become largers as well. How can I make it so that the icons always stay the same size?

The flashmx8 file can be found at: http:[url]....

The code is at the first layer called "scripts" in the first frame.

The code for adding dynamicly dots onto the map is at line: 72 and the code for zooming starts at line: 131, and basicly the whole actionscript is in the first frame to keep it easy and mobile to tweak the whole application.

View 1 Replies

ActionScript 2.0 :: Actions In The ****tail.swf File Seem All To Be Gone?

May 8, 2003

wait for the two interfaces to load.you will see several buttons , now drag the "mix-me" button on the bottle or in the rectangular area on the bottom.a few moments later, a mixmovie appears. this mixmovie contains actionscript code to scroll the different recipes left and right.

now here is my problem.

I loaded the ****tail.swf file into an empty movie clip with instance name content_dummy. It loads perfectly but the actions in the ****tail.swf file seem all to be gone.This does not happen with the loadmovieNum method but I would prefer to have it loaded into the dummy movieclip, because it is more manageable ?

View 7 Replies

ActionScript 2.0 :: How To Create Comet 'tail'

Dec 22, 2006

Newbie here. (sorry in advance if this has been asked already) I've seen a lot of mouse trailer effects with action script but I'm trying to find a way to make a similar 'trailer' or 'tail' effect to follow an object that is tweened on the stage. Anyone know how to do this? Example: sphere symbol is tweened and follows a guide in a arch. I'd like to apply an action so there is a tail to it that nicely trails the sphere to make a realistic looking comet shooting across the sky. (with bunch of dust or small stars sparkling behind)

View 5 Replies

ActionScript 2.0 :: Creating Comic - Centering Smaller Frames On Stage

Apr 30, 2009

My problem should be simple but I'm still having trouble. I am making a comic that appears on screen one frame at a time based off of on of the first flash tutorials that come with the program. It allows the user to click a button to move to the next frame. My problem is that the smaller frames need to be centered on the stage.

Here is the code I have so far
/* 0 */
var image0title:String = "Dr. Berg's Clinic. 1 of 4";
var image0uri:String = "images/Berg_frame_1.jpg";
/* 1 */
var image1title:String = "Dr. Berg's Clinic. 2 of 4";
var image1uri:String = "images/Berg_frame_2.jpg";
[Code] .....

My stage is set at a height of 350 px and a width of 500 px and the largest image is a height of 319 px and width of 500 px (the remaining 31 px are where I put the description and the button). The smaller images are a height of 319 px and a width of 166px and need to be centered.

View 4 Replies

Flex :: Displaying An Item Rendered Balloon Above The Data Point

Aug 11, 2011

I'm using a custom item renderer for an AreaChart:

[Code]....

I'm displaying my text. However, I want the balloon to be exactly above the data point. I tried to change the (x,y) coordinates but it doesn't seem to change. How can I move this balloon around to a desired location?

View 2 Replies

ActionScript 2.0 :: Setup A Situation In Comic Where The User Chooses One Of Two Options?

Mar 6, 2005

I'm trying to setup a situation in my comic where the user chooses one of two options, to side either with goblins or a dwarf. I would like to set it so that if the user chooses the goblins, it updates a shared object that keeps that choice saved on the computer for the next time they watch the movie so it skips the asking process. I've tried everything I can think of to get them to work, and the choice will replay if you are in the movie, but once you close it, the choice is not saved.

The .fla file can be found at www.manatheater.com/MXhelp2.fla, the initial set up is in Scene 0, Layer "Masking", Frame 0. The button code is in Scene 2, Layer GLeft and Gright, Frame 459. The replay code that checks the variable can be found in Scene 2, Layer "Masking", Frame 416. The variable for the choice is "gob", gob==1 is for goblins, gob==2 is for dwarf.

[Code]...

View 1 Replies

ActionScript 3.0 :: Creating Inverse Kinematic Tail For Predator Class

May 17, 2011

I've managed to create a flock with an eagle chasing it around using some available code. How to create an inverse kinematic tail for the predator class like a line of eagles chasing the flock. I've uploaded my code in a zip file.

View 0 Replies

ActionScript 3.0 :: Adding A 'Swash' Tail To Input Text Field?

Jan 16, 2012

I have been plagued with this problem for a while now, and this is my first time EVER posting on a forum.I am trying to add add a 'swash' tail from the Metroscript font to the last character in an input text field.

View 5 Replies

ActionScript 2.0 :: Curved HitTests For Flash 2004 MX?

Aug 16, 2006

how do you make a curved/slanted hitTest?

View 1 Replies

Flash / AS3 Gaming - Character Moving Along Curved Terrain

Dec 3, 2011

I'm trying to create simple 2D action game, something similar to well known Fancy Pants Adventures :) I've been looking for answer for more than week and all I've found is [URL] which not answers the question. (I've found also moving on platforms that are rotated but that's not I'm looking for). I have also found great (and free!) flash game engine - CitrusEngine which I'm currently using, but, it doesn't provide moving hero along curved terrain. How to make hero moving along curved terrain like this one: [URL]. There are plenty of games like this (for ex. Fancy Pants or Robot Unicorn Attack) where main character moves along the curved terrain but I can't find answer how can I do that.

View 2 Replies

Professional :: How To Make .swf Non Scalable

Aug 1, 2010

I have been trying to search for an answer on how to make a whole .swf file unscalable but I have only found information on how to scale flash files. I did find a post that mentioned the code "Stage.scaleMode = "noScale";" but when I add that to the first frame in my timeline, nothing happens.

View 2 Replies

ActionScript 2.0 :: Make A Scalable Swf?

Feb 9, 2009

Does anyone know how I can make a scalable swf? Or one which resizes to the page it is in?

View 1 Replies

ActionScript 3.0 :: Keep An Object No Scalable?

Mar 28, 2011

Is it possible to keep an object no scalable while its parent is scalable?? I have text inside a scalable mc and the text is scaling together with the mc when the stage is scaled.

View 3 Replies

ActionScript 3.0 :: Making Letters Mouse Tail : Error #1010: A Term Is Undefined And Has No Properties?

Mar 1, 2012

im trying to make as3 letters mouse tail and here is the code

ActionScript Code:
var Text = "Some Text";
var letters = Text.split("");[code].....

and im gitting this error message

ActionScript Code:
TypeError: Error #1010: A term is undefined and has no properties.

View 2 Replies







Copyrights 2005-15 www.BigResource.com, All rights reserved