How to create a button with several polygon drawables inside (in LibGDX)

Question

Is there some easy way to create a Button in LibGDX that contains several polygon drawables inside.

For example when the simple Button can be pictured like:

and advanced expected button like that:

And in my case following conditions must be met:

1. The Object must extends Button class.
2. Separated polygons (circle and triangle in pic) must have one common behavior - same up, down, hover styles, same click listeners ect. (for example when user hover circle the triangle and circle change color to green)

Actually it must have the absolutely same behavior as button with one polygon, just imagine that circle and triangle is one polygon, instead of separated ones.

The one way I figured out is to extend PolygonRegionDrawable, but to make it drawn correctly I need to override almost all methods from Drawable and TransformDrawable, is there any easier way to do that?

Maybe there can be found some DrawableGroup or something like that?

Answer 1

I dont think theres an easy way to make this work, here are some options.

Button is a Table, you can add stuff to it.

Button button = new Button(skin);
Image img = new Image(...); // insert polygon 1 here
img.setPostion(...); // offset so its in correct position in the button
button.addActor(img);
// add more stuff

Sadly this doesnt handle various state changes, like over etc. You would need to keep track of the added stuff and change them as button changes.

Other option is to make the polygons into single image. Thats quite tricky, you would draw them into FrameBufferObject in correct places and make a textures out of that. Then use that texture for Drawable for the button style. Reapet for each state you want to handle. Packing them into and atlas would be optimal for perfomace reasons. A ton of texture switches is not great.