New debug and animation tools for Solar2D

Hi, I recently published a few tools I made and use every day. I already shared these in the Solar2D Discord and I would also like to share them here too.

1. GameSpeed

You can change the speed of your game/app simply by using the keyboard. Specially useful to skip animations and go straight to the parts you are working on. Also useful to polish your animations, by looking at them in slow-mo.

2. Lua breakpoints

A workaround for breakpoints. Add breakpoints on your code that will freeze the engine so you can analyze any variables at that exact moment. Functions must return false if you want to keep inspecting the variables or true to continue the execution.

    breakpoint(1, function()
        print("x: " .. x)  -- Inspect x
        print("y: " .. y)  -- Inspect y
        print("z: " .. z)  -- Inspect z
        return true  -- Continue execution after inspection
    end)

3. LiveEdit

Edit your code live. Although this is not that easy to use, you can add a liveEdit function similarly to the breakpoint and edit it live. Alternatively, you can pick any display object in the screen using the mouse wheel while pressing shift, then move it around with the mouse or edit it in the edit.lua file that must be included in your project.

Using a liveEdit function

Picking your target

Doesn’t need any setup, works on any environment.

4. Flow

This one aims for a clearer code and a more consistent way to do animations. The basic interface is very simple, but it also hides features that are just way more powerful than the default transition library.

I thinks this is the best example to show how easy things are:

local f; f = flow(circle, { time = 700, ease = "inOutQuad" })
    :scale( .75, .75, { bounce = true, iterations = -1 } )
    :move( 0, 100 )
    :move( 100, 0 )
    :move( 0, -100 )
    :move( -100, 0, { onComplete = function() f:rewind(4, "position") end } )

You can send tables for it to pick values randomly on each iterations:

flow(circle, { time = 70, ease = "outQuad", iterations = -1 })
   :move( {30, -30}, {-30, 30}, {reset = true})

And this is how you can get more complex animations still keeping code simpler:

flow(obj1, { time = 2000, ease = "inOutQuad", iterations = -1 })
    :radius( 25, { bounce = true } )
    :rotate( 360, { ease = "linear" } )
    :alpha( 1, { bounce = true } )
    :color( {.5, 1}, {.5, 1}, {.5, 1}, { reset = true } )
    :size( 50, 50, { bounce = true } )

Flow has way more features, I did my best trying to explain in the documentation, but it still lacks a better documentation, I will invest more time on improving the tool and documenting it better.

It’s important to say that I did these tools for Studycat, and they were very happy about sharing them with the community!

All feedback is very welcome and I hope you enjoy these all!

9 Likes

@depilz very kind of you to share these tools … they look like they can be very helpful to many of the devs using Solar2d

2 Likes

Thank you so much, it’s so helpful!

2 Likes

Thank you for sharing your hard work. Your post lead me to putting together the awesome-solar2d list for contributions like yours, so it doesn’t get lost and kept in a single place. I also took the liberty of adding your contributions to the list before you do. Hope you don’t mind.

I might actually have a use case for Flow in my quiz game, if I find the time :slight_smile:

3 Likes