AngleSliderUI Demo

What Is It

The AngleSliderUI is a SliderUI that renders the value of a slider as degrees on a circular dial.

How To Use It

Simply call:

slider.setUI(new AngleSliderUI());

How It Works

Usually I'm a fan of trying to extend the Basic UI classes (in this case: the BasicSliderUI). But this is one of those cases where the UI is so significantly different that I extended the SliderUI instead.

A custom MouseListener and KeyListener control the position of the angle dial, which is mapped to the numerical range of the slider.

(And for non-traditional users who won't use the mouse/keyboard like I do: this SliderUI has no impact on the default AccessibleJSlider behavior that all JSliders automatically share. So in that case it will be beneficial to the user to make sure your slider ranges from, say, 0-359.)

Context

This was inspired by a widget we saw in iWeb. (Although I forget exactly what it was used for; I'm sure whatever it was was highly graphical.)

In the last decade I've used it as an editor for shadow angles and rotation. In this app you can see an example of this UI in the Strokes, MouseSmoothing demo.

Many years ago I included an special Aqua variant: the AquaAngleSliderUI. This dated back to ... maybe 2010? Back in those days Aqua still had elements that appeared to resemble candy (bubbly, plastic, shiny). Nowadays both Apple and Microsoft are trending more towards a minimalist design, though, so I think the current UI is a sufficient one-size-fits-all implementation for Mac and Windows.