Widget Catalog: SeekBar

SeekBar allows the user to choose a value along a continuous range by sliding a “thumb” along a horizontal line. In effect — and in practice, as it turns out – SeekBar is a user-modifiable ProgressBar.

Key Usage Tips

The value range of a SeekBar runs from 0 to a developer-set maximum value. As with ProgressBar, the default maximum is 100, but that can be changed via an android:max attribute or the setMax() method. The minimum value is always 0, so if you want a range starting elsewhere, just add your starting value to the actual value (obtained via getProgress()) to slide the range as desired.

You can find out about changes in the SeekBar value by attaching an OnSeekBarChangeListener implementation. The primary method on that interface is onProgressChanged(), where you are notified about changes in the progress value (second parameter) and whether that change was initiated directly by the user interacting with the widget (third parameter). The interface also has onStartTrackingTouch() and onStopTrackingTouch(), to indicate when the user is attempting to change the position of the thumb via the touchscreen, though these methods are less-commonly used.

A Sample Usage

The sample project can be found in WidgetCatalog/SeekBar.

Layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center_vertical"
  tools:context=".MainActivity">

  <TextView
    android:id="@+id/value"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="0"
    android:ems="2"
    android:gravity="right|center_vertical"
    android:layout_marginRight="10dp"
    android:textAppearance="@android:style/TextAppearance.Large"/>

  <SeekBar
    android:id="@+id/seek_bar"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:layout_marginRight="10dp"
    android:max="50"/>

</LinearLayout>

(from WidgetCatalog/SeekBar/app/src/main/res/layout/activity_main.xml)

Activity:

package com.commonsware.android.wc.seekbar;

import android.app.Activity;
import android.os.Bundle;
import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;
import android.widget.TextView;

public class MainActivity extends Activity implements
    OnSeekBarChangeListener {
  TextView value=null;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    value=(TextView)findViewById(R.id.value);

    SeekBar seekBar=(SeekBar)findViewById(R.id.seek_bar);

    seekBar.setOnSeekBarChangeListener(this);
  }

  @Override
  public void onProgressChanged(SeekBar seekBar, int progress,
                                boolean fromUser) {
    value.setText(String.valueOf(progress));
  }

  @Override
  public void onStartTrackingTouch(SeekBar seekBar) {
    // no-op
  }

  @Override
  public void onStopTrackingTouch(SeekBar seekBar) {
    // no-op
  }
}

(from WidgetCatalog/SeekBar/app/src/main/java/com/commonsware/android/wc/seekbar/MainActivity.java)

Visual Representation

Figure 1070: Android 2.3.3

Figure 1071: Android 4.1

Figure 1072: Android 6.0, Landscape