CODEWITHSUNDEEP
javaandroidopengllibgdx
Oliver Dixon
Oliver Dixon

Reputation: 7405

Drawing shapes as textures in LibGDX

I'm creating menus in my game specially rectangles with rounded corners and borders. I can do this with a shape renderer but I cannot mix shape renderer and sprite batcher. At the moment my resolution seems to be using large shapes as PNG's and scaling them BUT on a lot of devices this produces blurry corners.

I've read my tutorials on Meshes, shaders, using the shape renderer after the sprite batch (complication layer and performance impact), 9-patch (Border goes blurry, can't do gradients properly)

In android it was fairly simple, we just define the shape in XML and it creates a nice crisp shape example: rounded rect with a border and a gradient.

Could anyone give me some advice as too how I would go about's creating a rounded rect with a gradient, preferably some easy to use implementation that could be used in a reusable class.

Upvotes: 2

Views: 3283

Answers (2)

TheWhiteLlama
TheWhiteLlama

Reputation: 1286

You should have a look on 9patches. Your usecase should be excactly the same 9patches were made for. So you'll have to make a graphic consisting of 9 regions that can be seperated.

In your case: 4 regions for the 4 corners, 4 regions representing your rect's edges and 1 center region. Remember, that the edge-regions and the center regions will be stretched depending on the size of the rectangle, that's why you shouldn't use repeating patterns. But horizontal or vertical gradients should work fine.

You can use them with spriteBatch only. There should be no blurry lines, aslong the rounded corners of your graphic will be in a resolution that is good enough.

Here's a link for the libgdx 9patch: https://github.com/libgdx/libgdx/wiki/Ninepatches

Here's an image that shows how ninepatches basically work: http://radleymarx.com/blog/wp-content/uploads/2011/05/scalable-area.png

Upvotes: 0

Sound Conception
Sound Conception

Reputation: 5411

You could draw your shapes to PixMaps, and then create TextureRegions from them for rendering with SpriteBatch.

The tool-set is a little basic, but you can draw points, lines, triangles, circles, rectangles, fill, or draw areas from another PixMap.

You can draw a rounded rectangle, by drawing two overlapping rectangles and a circle for each corner.

PixMap myPixMap = new PixMap(desiredWidth, desiredHeight, pixmapFormat);
myPixMap.setColor(myColor);
myPixMap.fillRectangle(x, y, width, height);

TextureRegion myTextureRegion = new TextureRegion(new Texture(myPixMap));

Upvotes: 5

Related Questions