Rotating Knob Selector

Additional

Language
Java
Version
1.9.0 (Jul 16, 2017)
Created
Dec 7, 2016
Updated
Jul 25, 2017 (Retired)
Owner
Beppi's App Studios (BeppiMenozzi)
Contributors
Beppi's App Studios (BeppiMenozzi)
Thomas-Vos
2
Activity
Badge
Generate
Download
Source code
APK file

Promotion

Rotary Knob Selector

A customizable selector that replicates the behaviour of a knob with discrete values. The knob is a powerful tool. For some reason, anyway, it's rarely used, and I could not find it in the Android panorama. But the rotating knob has a lot of advantages over other radio-buttons, seek bars or other selectors:



  • It's usage is immediately clear to the user, because it also exists in the physical world
  • It has an immediate graphical indication of the current value, the number of choices and where the value is in the overall range
  • It docks in a very small space: it requires the same space no matter how many choices are there, and it can adapt itself when the amount changes. Furthermore, swipe gestures allow to change values very quickly, using the entire screen for the gesture, but only a tiny zone of it for the graphics.
  • Works fine also with few choices, as a multi-state toggle. Possible usages are:

  • Replacement for a radio button, with 2 up to dozen of choices
  • Replacement for a integer value input or seek bar, with large ranges up to hundreds
  • Replacement for a ViewPager indicator, for fast scrolling pages without using an entire line of the screen

This version is still in beta and still misses a number of features that are going to be added in the next future.

Setup

In your project's build.gradle file:

allprojects {
    repositories {
        ...
        maven { url "https://jitpack.io" }
        ...
    }
}

In your Application's or Module's build.gradle file:

dependencies {
    ...
    compile 'com.github.BeppiMenozzi:Knob:1.9.0'
    ...
}

Minimal usage

Layout:

...
xmlns:app="http://schemas.android.com/apk/res-auto"
...
<it.beppi.knoblibrary.Knob
        android:layout_width="64dp"
        android:layout_height="64dp"
        android:id="@+id/knob"
        app:kNumberOfStates="6"
 />

Listener:

...
Knob knob = (Knob) findViewById(R.id.knob);
knob.setState(firstState);
knob.setOnStateChanged(new Knob.OnStateChanged() {
        @Override
        public void onState(int state) {
        // do something
        }
    });

...
As default, nearly all features are disabled and the default knob is minimal:

This is what you will have with this default configuration. Feel free to grab graphics and configurations from the sample as you like to match your own needs. Some other fancy configurations that you can find in the sample: