How to generate LibGDX nine patch packs

The first time you'll try to create valid LibGDX nine patch packs for your Android app you might run into multiple problems.

I've created this article so that others can skip all the docs and searches and get right to the magic.

Nine Patch is an image that contains additional information compared to a normal image which is used to determine which areas of it should be scaled when the image is used in a size which is larger than the original one.

Here's an example of a nine patch image "button1.9.png" (notice the .9. naming convention):

This article does not explain how to generate these images but how to create the packs which can be used in your Android app. After your designer provides you with similar nine patch images to the one above, or if you manage to create ones, you'll need to download LibGDX Texture Packer GUI. The latest version should do just fine.

In order to run it you'll need to have Java installed. Place all your nine patch images inside a folder then specify this folder as the input directory in Texture Packer GUI. Give the pack whatever name you desire (mine is named buttons.pack) then hit the Pack'em all after you select your output directory.

You should now have a sprite named buttons.png which contains all your nine patch images and a file which contains the pack configuration and which is similar to the one bellow:

buttons.png format: RGBA8888 filter: Nearest,Nearest repeat: none button1 rotate: false xy: 0, 198 size: 198, 198 split: 38, 38, 15, 13 orig: 0, 0 offset: 0, 0 index: 80

That's all.

Now that you have the packs in your virtual hands go ahead to the next article and use them.

The next post will cover how to create buttons in LibGDX using the generated packs.