Note: Graphics 2.0 is now in public beta for all Corona SDK Pro and Enterprise subscribers. Please see Walter’s recent blog piece on the news.


This week I wanted to give you some more eye candy from our next-generation graphics engine to demonstrate how easy it will be to add filter effects to your app.

Like in the 2.5D quadrilateral distortion preview, we’ve modified the Fishies sample app. This time, we’ve taken the background aquarium image and created a 3×3 grid. Then we applied a filter effect to each tile (except for the center one):

To apply a filter effect, you just make one function call. For example, here’s how you’d apply the “pixelate” filter like in the top-middle of the video:

image:setEffect("filter", "pixelate")

In the video, we only show you a handful of filters, but you’ll soon have a huge catalog of built-in filters to choose from.

Right now, the preliminary list includes the following:

  • “blur”
  • “brightness”
  • “bulge”
  • “color”
  • “contrast”
  • “dispersion”
  • “dissolve”
  • “emboss”
  • “pixelate”
  • “saturate”
  • “sepia”
  • “swirl”
  • “vignette”
  • “wipe”
  • “wobble”
  • “chromaKey”
  • “duotone”
  • “monotone”
  • “grayscale”
  • “invert”

We’ve got more on the way, so if you have a favorite, let us know!

And yes, we’d like to let you write your own shaders to create custom filter effects, but that’s further out.

BTW, if you are hankering to get your hands on the new graphics engine, we will be seeding this out to beta testers very soon — possibly as soon as next month!

UPDATE: Sign up to be a beta tester here: http://coronalabs.com/beta

  1. Wonderful!

    Can I combine filters, e.g. “blur”, “brightness” and a bit of “contrast” to show maybe clouds far away?

    And when I fly near the clouds I then would be able to gradually tone the filters down, a whole new range of visual fx would be possible by combining filters …

    Best,
    Andreas

    • Out of the box, single effects are going to be easy.

      In parallel, we have something in the works so you can chain multiple filter effects, so you can combine multiple filters together!

  2. Looking good – how do you control the amount of the effect, especially for the blur?
    This would be important. Will it be able to change it using the transition.to-function?

    Also, will we be able to use it with masks, i.e. blur a hard-edged mask or do other funky stuff?

    This is looking really good – I hope to test it asap! :)

    • We will have a way to parameterize the inputs to each filter. And yes, being able to tween that with transition.to is definitely our goal.

      Good idea on the masks. We’ll play with that.

      • Sounds awesome. If you need any more hints from a designers aspect, just let me know.

        Masks have been a pain in the a**.. Aswell ass AA for display.objects..

  3. Also please add a Treshhold – in combination with bluring a group of objects (maybe even display-groups?!!!) we could make a fast-rendered liquid simulation.

  4. Josep Alemany says:

    Great Job! I Wanna be a beta tester to ;)

    We can do effects by groups?

    The code to do The efffects colud be changed?

    Regards,

    Josep Alemany

    • We’re working on doing effects on entire group. This will involve doing the equivalent of an in-memory screen capture of the group and then applying the effect after that.

      • I still hope that will work – if it can display 200 fishes with an ease, it should be able to blur a whole disply group with 100 particles ;)

  5. At some point it’d be nice to know which new effects will be available to Starter and which will be reserved for Pro.

    Or can we assume that Starter will only have exactly what we have now (but on the faster engine), while Pro gets all the new stuff?

    • Yes, if you’re a Starter, you will get the equivalent graphics 1.0 functionality, so you will still benefit from the faster engine. To use the new graphics features in graphics 2.0, you will need to upgrade to Pro.

  6. Will it be possible to do straight colour replacements in an image? So say I had multiple sports teams in an app, I could do one image for a sportsman, and then just do colour replacements to change his clothes for each team?

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>