The Daily Click ::. Forums ::. Klik Coding Help ::. transparent mask
 

Post Reply  Post Oekaki 
 

Posted By Message

SolarB



Registered
  26/12/2011
Points
  564
16th May, 2012 at 16/05/2012 15:45:44 -

Hi all,

I posted this on the clickteam forums but I haven't had much luck there.

I want to make an in-game menu that is semi-transparent except for the text and slider bars. The slider bars have to be smooth and for this I can either use a counter or active (with Xscale = Xsale +/- 0.01). The edges on the bars must be rounded. Is there any way of having a mask that ONLY works for a particular object?

Currently when I set the menu background to transparent the bar mask is visible. When I set the bar mask opacity the bar counter itself becomes visible.

Oh and of course Interface Bar Object would be perfect for this but unfortunately the game is for flash/iOS so I have to use another method. I do however know that flash has the option to create invisible masks... does this exist here? Any other ways of making smooth counters with rounded corners?

Any help much appreciated!



 
My Open Source Examples: http://bit.ly/YyUFUh

UrbanMonk

BRING BACK MITCH

Registered
  07/07/2008
Points
  49667

Has Donated, Thank You!Little Pirate!ARGH SignKliktober Special Award TagPicture Me This Round 33 Winner!The Outlaw!VIP MemberHasslevania 2!I am an April FoolKitty
Picture Me This Round 32 Winner!Picture Me This Round 42 Winner!Picture Me This Round 44 Winner!Picture Me This Round 53 Winner!
16th May, 2012 at 16/05/2012 18:52:15 -

I'm having trouble understanding what you want exactly.
Could you make a diagram?

From what I gather you want a resizable object that has rounded edges?
Have three separate objects, the rounded caps, and a solid bar in the middle that gets resized.

 
n/a

SolarB



Registered
  26/12/2011
Points
  564
17th May, 2012 at 17/05/2012 06:37:18 -

https://www.dropbox.com/s/71y675pw11lkbes/bar.png

Pretty much what you said. I'm hoping to avoid the 3 objects technique until it's absolutely necessary. The background in this image represents a transparent menu, and the visible mask that should be transparent but still mask the bar edges.

I'm thinking of just doing a 600 frame active but I'm concerned that it may take up too much memory/mmf can't handle it. Going to do some tests tonight.



 
My Open Source Examples: http://bit.ly/YyUFUh

UrbanMonk

BRING BACK MITCH

Registered
  07/07/2008
Points
  49667

Has Donated, Thank You!Little Pirate!ARGH SignKliktober Special Award TagPicture Me This Round 33 Winner!The Outlaw!VIP MemberHasslevania 2!I am an April FoolKitty
Picture Me This Round 32 Winner!Picture Me This Round 42 Winner!Picture Me This Round 44 Winner!Picture Me This Round 53 Winner!
17th May, 2012 at 17/05/2012 07:54:57 -

MMF will be able to handle it, but that's a silly way of doing it. It'll increase file size.

Optimize my friend, optimize.

Something that can be done in code to make the file size smaller is never a bad thing!

 
n/a

SolarB



Registered
  26/12/2011
Points
  564
17th May, 2012 at 17/05/2012 08:52:35 -

Yes indeed! Test results:

Bar = 500x24 - 500 frames.

No Alpha, memory/file size = +1-2mb (unusable of course, edges still visible)

Alpha channel, memory/file size = +20mb (wow!)

3 active solution it is then, unless something else pops up...?

Cheers.

 
My Open Source Examples: http://bit.ly/YyUFUh

UrbanMonk

BRING BACK MITCH

Registered
  07/07/2008
Points
  49667

Has Donated, Thank You!Little Pirate!ARGH SignKliktober Special Award TagPicture Me This Round 33 Winner!The Outlaw!VIP MemberHasslevania 2!I am an April FoolKitty
Picture Me This Round 32 Winner!Picture Me This Round 42 Winner!Picture Me This Round 44 Winner!Picture Me This Round 53 Winner!
17th May, 2012 at 17/05/2012 23:07:02 -

There used to be an extension that did this automatically, but honestly stick with the 3 object method. Later on when you want to port to more platforms you'll be glad you did.

 
n/a

SolarB



Registered
  26/12/2011
Points
  564
18th May, 2012 at 18/05/2012 09:41:49 -

Yes, the interface bar object did it quite well, of course it's windows only and the game is intended for flash/iOS.

However I did manage to find a solution! It's in the form of a shader.

https://www.dropbox.com/s/2bsojuvjan2un9j/TexOverlayv2.rar

Make a transparent active the width of your bar, add an alpha mask, edit the overlay image in the shader and make it half transparent half opaque with whatever colour you want. Adjust the width parameter for the shader at runtime. Play with your background!



 
My Open Source Examples: http://bit.ly/YyUFUh
   

Post Reply



 



Advertisement

Worth A Click