ResizeWidget

ResizeWidget

Scene2D is great at resizing elements programatically, but sometimes you want the user to be able to directly resize an element on their own. ResizeWidget is the solution for this. It adds resize handles to any child you add to it, allowing free-form transformation of the widget. The user can also move the child around within the bounds of the layout by dragging from the center. The handles become visible when the user mouses over the widget.

ResizeWidgetStyle

All the fields of ResizeWidgetStyle are optional, but if you don't specify a handle, it will be impossible for the user to resize the widget.

• The "handle" Drawable is center aligned on each of the corners. A small, outlined rectangle is what most people expect with a resizable widget.
• The "minorHandle" Drawable is center aligned in the middle of each edge. This could be the same as the normal "handle", but you can add some variation by making it even smaller, for example.
• The "background" is drawn behind the child widget. This can be a simple outline so that the user can see the edges of the widget. The content padding of the background will be applied to the child widget.
• The "foreground" is drawn in front of the child widget. You can use a semi-transparent drawable as a kind of highlight to signify that the widget is resizable.

How to use ResizeWidget

Create a ResizeWidget and specify the child you wish to manipulate. Add it to your layout:

Image image = new Image(skin.getDrawable("island"));
ResizeWidget resizeWidget = new ResizeWidget(image, skin, "default");
table.add(resizeWidget).grow();

Think of the ResizeWidget itself as the space that the child widget must stay inside. The user can not scale or drag the child beyond the bounds of the ResizeWidget. So it's important to give the widget as much space as necessary.

There are a number of configurable options. If you don't want the user to be able to move the child, deactivate dragging. Resizing from the center means the widget will expand/shrink equally on all sides when the user manipulates the scale. Setting a minimum width/height is important because the user might not be able to see what's in the widget.

resizeWidget.setAllowDragging(false);
resizeWidget.setResizingFromCenter(true);
resizeWidget.setMinWidth(100);
resizeWidget.setMinHeight(100);