cocos2d for iPhone

A fast, easy to use, free, and community supported 2D game engine

1. 

   Terry
   Member

   Hi,

   I'm trying to create a highlighting effect on a CCSprite, where if you click on the sprite, a coloured border surrounds it.

   Creating separate images for the highlighted and non-highlighted versions is out of the question because I have too many sprite images, and doubling in image size is not good.

   So far, I have tried creating a duplicate CCSprite from the same image (to get its shape), and subsequently calling setColor on the sprite to fill it with a solid colour. My plan was to increase this duplicate sprite's size by, say, 10%, and overlay the original sprite on top of it to give it the highlight feel. However, setting the sprite colour to, for example, red, makes it look "more red" as opposed to a full solid red colour. Even if this idea works, I'm not convinced that this is the best solution.

   If somebody could offer any suggestions on how to properly do this kind of highlighting effect on CCSprite's, I would be very grateful. Or if you have any ideas on how to properly set the colour of a sprite, I would appreciate that as well.

   Thanks,
   Terry

   Posted 1 year ago #
2. 

   jd
   Member

   You can use a 1px white sprite that you stretch and color as you like and do what you mention above with placing an image behind your sprite. I'm pretty sure you have full control over the RGB values to color as you like.

   Posted 1 year ago #
3. 

   cocos
   Member

   @Terry,
   If you have sprites of the same shape and size one way is to have a "border" sprite which is just a color frame and transparent internals. You can control the visibility of the boarder "sprite" turning it on or off.

   Posted 1 year ago #
4. 

   Terry
   Member

   @jd: Yeah, that would work. However, the issue with using a 1px white sprite is that it won't conform to the shape of the sprite. It's going to look rectangular. Sorry, I should have mentioned this earlier.

   @cocos: Unfortunately, I have many sprites, all with different shapes.

   Posted 1 year ago #
5. 

   leocck
   Member

   I did create a border for a CCLabel using CCRenderedTexture.
   If you wants the same behavior you can change the code to works with a CCSprite.
   Link to that thread.

   Posted 1 year ago #
6. 

   Terry
   Member

   That's a very neat way of creating a border! I tried using your code for CCSprite, but it creates strange artifacts (which are more noticeable if size is increased). I think the issue here is still that setColor is used, so the colour of the border is actually the tinted version of the original. I wonder if any of the blending options can be modified to get a more solid effect -- I'm not familiar with blending.

   Posted 1 year ago #
7. 

   leocck
   Member

   @Terry
   Yes, you're right, it's a tinted version of CCSprite, so the code won't be useful unless your sprites are all white, sorry about that.
   But @manucorp did share a code to render a blurred sprite and shadows with CCTexture2DMutable, I think you can modify it to achieve a stroke

   http://www.cocos2d-iphone.org/forum/topic/11745

   Posted 1 year ago #
8. 

   Terry
   Member

   @leocck
   Wow, I think CCTexture2DMutable is what I was looking for. The fill method (with a minor modification to setPixelAt) is able to replace the image with a solid colour while retaining its original shape. I'm going to experiment with just drawing the actual border instead of filling the entire image with that colour.

   Thank you so much for your help!

   Posted 1 year ago #
9. 

   leocck
   Member

   Good to hear that! Good luck.

   Posted 1 year ago #

RSS feed for this topic

Reply

You must log in to post.