[EFFECT] Ellipse

Forum Home Forum Home > Construct Classic > Construct Classic Discussion > Completed addons
 Post Reply Post Reply
Author
5,270 Rep
Post Options Post Options   Quote tulamide Quote  Post ReplyReply Direct Link To This Post Topic: [EFFECT] Ellipse
    Posted: 29 Apr 2012 at 4:27pm
This effect draws an ellipse. It uses the sprite's texture and color filter for coloring. If you just need a single color ellipse, just create a 2x2 sprite, either filled with the intended color or filled with white while using the color filter to set the color. You can resize the sprite to any size in the layout (NOT in the picture editor!) without adding to VRAM.


(example image)

The following parameters are defined:
1) Outline: Defines the thickness of the outline. 100% means, it uses the complete area.
2) Smooth Outline: How much of the outline's thickness is used for smoothing. 100% means a mirrored gradient from the center to the inner and outer border of the outline.
3) Outline Opacity: Controls the transparency. 0% means fully tranparent, 100% means fully opaque.

The values are all relative, that might be confusing at first. For example, if you have a 128x128 sprite and set Outline to 50%, then half of the area is occupied by the ellipse. At any angle the ellipse is at both sides of the center, so the thickness will be 32px (32px on both sides = 64px, 64px = 50% of 128).
Likewise, smoothing is calculated. It is a value relative to Outline. So in this example, a value of 25% means 25% of the outline's thickness (which was 32px), or 8px in total. 4px for the outer side smoothing and 4px for the inner side smoothing. In result the ring will be smoothed in from px1-4, full color from px5-28 and smoothed out from px29-32

Based on the description above, if you want a circle (an ellipse would break it) to always have the same pixel thickness, regardless of the size, you'd calculate the proper value:
pixel in percent = (1 / totalpixel) * 200 * n

(sprite is 128x128, outline shall be 1px)
Outline = (1 / 128) * 200 = 1.5625%

(sprite is 30x30, outline shall be 5)
Outline = (1 / 30) * 200 * 5 = 33.333%

(sprite is 200x200, outline shall be 3px)
Outline = (1 / 200) * 200 * 3 = 3%

I didn't implement this, because it only works for squared sprites (because pixels are squared, too). In the last example, we have 3px horizontal/vertical, but if we set the height to 100, we have 3px horizontal and 1.5px vertical.

Download:ellipse.fx

EDIT: I've accidentally uploaded an earlier developer version This is now corrected. (April 29, GMT 3:47 pm)

Edited by tulamide - 29 Apr 2012 at 4:47pm
Back to Top
2,874 Rep
Post Options Post Options   Quote oppenheimer Quote  Post ReplyReply Direct Link To This Post Posted: 29 Apr 2012 at 8:50pm
very nice tulamide!
this effect should come in handy for range markers and stuff like that.
good bye oversized pngs and pixelized canvases ;)

just tried your example and it works like a charm!
here's a cap in action
Back to Top
5,270 Rep
Post Options Post Options   Quote tulamide Quote  Post ReplyReply Direct Link To This Post Posted: 01 May 2012 at 3:06pm
Thank you very much. It is not easy nowadays to get commented, so I really appreciate it :)
Back to Top
676 Rep
Post Options Post Options   Quote Yaottabyte Quote  Post ReplyReply Direct Link To This Post Posted: 02 May 2012 at 2:25pm
thats right i was looking for... Thanks! will be handy!
Back to Top
2,068 Rep
Post Options Post Options   Quote zyblade Quote  Post ReplyReply Direct Link To This Post Posted: 04 May 2012 at 8:14am
Nice effect, aspecial for selection effects around players or mobs.
Gonna try to skew it a bit to put it a little into perspective.


*downloading*


Edited by zyblade - 04 May 2012 at 8:17am
Back to Top
 Post Reply Post Reply

Forum Jump Forum Permissions View Drop Down