The designer in me just couldn’t get past this omission. Yes, I could could have launched my app with it, but it would have kept me up at night.

The fireflies’ wings need to actually flap, dammit.
Happy to say, “and now they do.”

Here’s a little video snippet of them in action, and below I’ll describe how I got this to work.

My issue

LibGDX uses skins in many instances, and their rendition of DragAndDrop was one of those instances. It wasn’t that skins were hard to use. The issue, was that skins worked with a variety of image types, serving as a container for texture regions, ninepatches, fonts, colors, sprites, drawables, etc.

You’ll notice I never mentioned the Animation class.

Essentially, my wing flapping animation could be done with two images, right? Just switch back and forth between the two, rapidly, and you’re in business. But search as you might over the great Google, and I challenge you to find an alternate way for LibGDX to do this, with skins, without using Animation.

My solution

So I created a Firefly class using different constructors.

Previously, the class I was using had one constructor (below) that took two arguments: a Skin and a String. This was the textbook approach using images in a drag and drop situation.

This process sort of worked. It let me have static PNG images flying around the screen, and since they were using a skin, I could drag them onto a target object. But it turns out that while the skin needs a specific type of image (listed above) … technically, it doesn’t have to display that image.

Here’s some code from my main game screen,

You’ll notice on line 2 of (above), I’m creating a texture, which is just a static, non-animated PNG file. It’s not actually being shown in the game, but when I run the add() method on skin on line 14, you can see I needed the texture to fulfill those parameters. This was important, because it still allows me to drag a firefly to my target.

I create my Firefly instance on line 19, using a new constructor I made (below), which allows for use of the Animation class. So each time I create a new firefly object in my for loop (a random range), it tags each one with a unique skin name (to track), and then makes each object a two-step animation, which was done like this:

This is just one of the normal ways to make an animation in LibGDX. I find this way easier than using a TextureAtlas.

And here’s the new, improved Firefly class.

You’ll notice I made three different constructors, just so I’d have some options. The last constructor, on lines 26-30 are the normal usage for a non-animated image. For the video example at top, I ended up using the second constructor, shown on lines 20-24. This let me incorporate the Animation class (and use my two-step animation).

I’ve actually come really close to wrapping this game up — the next post will go over two items:

  1. Using the Asset class to load and remove assets for each screen.
  2. Adding buttons (and button listeners) to load different screens.


That’s it for this post.