How to Create Flickering Neon Effects

Solar2D Advanced Graphics
#1

Hello Corona Developers,

I just release a new module: the Neon Shapes module.

Neon-Poster.jpg

You can create any basic geometry shapes with a neon style effect.

Furthemore I added a neon text object based on a special bitmap font I created.

Last but not least I created a neon Bézier curve object to create any rounded shape you like.

And to create the whole lot of coordinate points needed for a complex Bézier shape I added a little Bézier curve editor.

Here is a short intro video:

https://youtu.be/tBsK-WjpVFA

I wrote a tutorial article on how to use the module. I also explain how the neon shapes are built (for the technical interested ones or if you want to rebuild a similar system). And the whole thing is for free (well, for a like).

Here is the link to the article:

http://devilsquid.com/create-flickering-neon-effects-corona-sdk/

Enjoy

  • René
#2

Hi René,

Great work and very comprehensive!

Would you consider bundling this up as Lua-based plugin? If you would, we could offer it within the Corona plugin marketplace and make it more accessible to developers.

Best regards,

Brent

#3

René, you are so awesome to share this. I’ve given your youtube video a thumbs up and a comment.

I’m going to go to your website and download your module.

Thanks very much.

#4

Cool, thank you so much.

Let me know if something is not working out for you.

#5

Good idea. I will have a look at Rob’s tutorial to create pure Lua plugins.

#6

WOW !!!

#7

Hi there,

I gave this awesome module a go.

However, it seems that the Neon:text option is not working on device? Works perfect on simulator. 

I tested on a Nexus 7 running 5.1.1 and the text is corrupted. It only shows a letter p, but the letter p is not even in my original text. 

stageT=Neon:text({ parent=textGroup, text="STAGE 6", fontSize=100, x=x, y=90, glowColor={56/255,203/255,166/255}, fillColor={0.2,0.3,0.2}, flickerEffect=false,flickerStyle=5 })

Anything I’m doing wrong? Please help. 

#8

@farjadfarabi_czs

I’m sorry, it doesn’t work. I will check this out today and will get back to you.

#9

Just in case someone else ran into the same problem as fajadfarabi_czs:

I sent farjadfarabi_czs a new version which uses texture memory more efficiently.

farjadfarabi_czs tested this new version and it works now.

Thank you farjadfarabi_czs.

The used texture memory whenusing neon text is quite high: it loads two bitmap fonts at the same time. And the bitmap font fpr the glow effect is quite big because the glow needs much space in the texture. This lead to problems on older devices.

I will send out a new version, when I updated the fonts properly.

#10

Keep up the good work René

#11

Thanks to Rene for his amazing work. :D 

#12

Thank you all. 

I just updated the neon module.

Now you can choose between two different neon text font.

NeonText-Clean-Distorted.png

Use

font="NeonFontClean"

or 

font="NeonFontDistorted"

NeonFontClean is the default value.

Just re-download from the link you received.

Best

René

#13

Hi, really good work Rene. I enjoyed a lot.

However, I think there is something wrong with text. I was trying to use neon text in a scene, but it is coming all my scene.

    local infoTxt = Neon:text({
    text=“NEON”,
    fontSize=40,
    x=200,
    y=200,
    })
    sceneGroup:insert(infoTxt)

Best,

Hamza

#14

Hi Hamza,

hm, sounds like I do not insert the neon text objects into the display group.

I will check this and get back to you.

Best

René

#15

@Hamza,

ok, I missed it like stated above.

I updated the files. Please just redownload.

Hope it works now. Thank you for pointing this out.

Best

René

#16

Hi René,

Great work and very comprehensive!

Would you consider bundling this up as Lua-based plugin? If you would, we could offer it within the Corona plugin marketplace and make it more accessible to developers.

Best regards,

Brent

#17

René, you are so awesome to share this. I’ve given your youtube video a thumbs up and a comment.

I’m going to go to your website and download your module.

Thanks very much.

#18

Cool, thank you so much.

Let me know if something is not working out for you.

#19

Good idea. I will have a look at Rob’s tutorial to create pure Lua plugins.

#20

WOW !!!