Posted on by

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.


I’ve been doing a lot of talking about why Corona SDK is super for cross-platform app development. And in last week’s Corona SDK staff conversation, I talked about doing 3-D without the z-axis.

Now, it’s time to show you what I mean. As they say a picture is worth a thousand words, so a video is worth a million:

We took our venerable Fishies sample and added a 3-D flip effect in between the fish in the foreground and the background aquarium image. The amazing thing is this all happens at Z=0. That means everything renders in the order that your code adds them — same model you are used to today. You get to do crazy perspective effects and lay objects down like a deck of cards. Even an artist from Van Gogh’s day, someone who’s never even seen a computer could understand how to work with Corona graphics!

The great thing is it’s just 2 (count them 2) function calls. The code snippet shows you how we set up key frames for a front image and a back image.

transition.to( frontImage, { x1=halfW, x3=-halfW, y3= 100, 
                             x2=halfW, x4=-halfW, y4=-100,
                             time=1500, delay=1000, transition=easing.inExpo } )
transition.from( backImage, { x1=halfW, y1= 100, x3=-halfW,
                              x2=halfW, y2=-100, x4=-halfW,
                              time=1500, delay=2500, transition=easing.outExpo } )

Next week, I’ll talk about plugins and our plans for taking from a closed Beta to an open one!


Posted by . Thanks for reading...

19 Responses to “Corona Weekly Update: 3-D quadrilateral distortion without the Z-axis!”

  1. GenoBaby

    not complaining but I still wish it did spin on the z-axis or look like it did. Will there be a way to make it not look like it moved further from the ‘camera’ durning the flip and then back towards it when it flips to the other side?

    Reply
    • Walter

      Actually, you can make it look like it spins on the z-axis by adding some additional y offsets on the other 2 points.

      The cool thing about this sort of effect is you don’t need the camera. You’re tricking the eye into seeing 3-D using 2-D techniques.

      Reply
    • Walter

      Yes, you’ll be able to do storyboard transitions with this. In addition, we’re planning to add 3D mesh effects for other cool transitions.

      Reply
  2. Chris

    Nice, but will still lead into problems when parts are overlapping – gonna try it out with my memory game template!

    Reply
  3. Bunny305

    What new types of games will we be able to make with this that weren’t possible before. Will First-Person Shooters be possible? Or something like Temple Run? Please provide some examples that are in App store that I can look at. Much excited Great job!!

    Reply
  4. kc

    Can we set the rotation axis at different reference position?
    Such as rotate using left/middle/right edge as axis. OR any of X / Y position as axis.

    Also will it be horizontal or vertical rotation as well.

    We have experienc with paper 3D plug-in with Flash. Will it be similar with that on Flash.

    Thanks

    KC

    Reply
  5. Michael

    This looks pretty sweet. As KC mentioned above, I’m also curious if we can set the rotation axis at a different reference position? Any word on the official release date as well?

    Reply
  6. Dave

    Is there a timeframe on when this will be released? It’s going on 3 months since this was showcased. I keep hearing about it in the forums and other places but I never hear about a release date.

    Reply

Leave a Reply

  • (Will Not Be Published)