SeekBar Tutorial With Example

SeekBar is an extension of ProgressBar that adds a draggable thumb. The user can touch thumb and drag left or right to set the SeekBar progress level.

SeekBar and RatingBar are the subclasses of AbsSeekBar. Users can attach a SeekBar.OnSeekBarChangeListener to be notified of the user’s movements.

These are the three methods inside OnSeekBarChangeListener

  • onProgressChanged(SeekBar seekBar, int progress, boolean fromUser): It is used to tell any change in the level of SeekBar and we can pass the value from progress. 
  • onStartTrackingTouch(SeekBar seekBar): It is used to tell the user has started a touch gesture.
  • onStopTrackingTouch(SeekBar seekBar): It is used to tell that the user has finished a touch gesture and we can show that value on the screen.

Read More: How to implement Android Splash Screen

SeekBar Tutorial With Example

Step 1 – Create a new project and give the desired name

Step 2 – You have to open an activity_main.xml file and copy the below code.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <SeekBar
        android:id="@+id/seekBar"
        android:layout_width="match_parent"
        android:layout_height="13dp"
        android:layout_marginTop="64dp"
        android:progress="20"
        app:layout_constraintTop_toBottomOf="@+id/textView"
        tools:layout_editor_absoluteX="0dp" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginTop="64dp"
        android:layout_marginEnd="8dp"
        android:fontFamily="sans-serif-black"
        android:text="ANDROIDHIRE"
        android:textAlignment="center"
        android:textSize="30sp"
        android:typeface="monospace"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />


</android.support.constraint.ConstraintLayout>

We have set the default value of SeekBar to 20, to set the default value use this tag android:progress="20"

Even you can do drag and drop the Seekbar and text from the Palette. Where you can find SeekBar? It is in the Widget section

Step 3 – Open the activitymain.java file, copy and paste the below code.

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.SeekBar;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    SeekBar seekBar;
    TextView textView;
    private int progressChangedValue;


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

        seekBar = findViewById(R.id.seekBar);
        textView =findViewById(R.id.textView);

        seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {

                textView.setTextSize(progress);
                progressChangedValue = progress;

            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {


            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {

                Toast.makeText(MainActivity.this, "Seek bar progress is :" + progressChangedValue,
                        Toast.LENGTH_SHORT).show();

            }
        });
    }
}

In this java code, we are saving the SeekBar Progress in the progressChangedValue and then we show showing that value when the user Stop Touch the SeekBar and using Toast the value will pop up on the screen.

When you drag the SeekBar the size of the text will change.

If are facing any problem in this Android SeekBar Tutorial With Example then you can comment below and we will help to resolve your query.

Aditya Singh
Aditya Singh
Hi, I’m Aditya Singh. The Co-Founder of this blog AndroidHire. I’m Part-Time blogger, and digital marketer. If you want to contribute then you can contact us at contact@androidhire.com

Latest news

Everything about Android Latest Version

When Google launched the Google Android-powered Nexus One telephone on January 5, 2010, Jobs, Apple Chief executive officer responded to that development in a...

Use of “Services.dart” Package in the Flutter

We often come at a point where we need some flexibility, in our app UI. so in this blog, I want to share two...

One Plus 8T: All you need to know!

One Plus unveiled its 2020 flagship in a virtual event named One Plus 8T. In this post we would go through its specifications ,...

Twitter may launch new features to simplify direct messages.

Twitter is said to be working on a couple of new features that could make it easier to manage direct messages and retweeting. The...

Related news

Everything about Android Latest Version

When Google launched the Google Android-powered Nexus One telephone on January 5, 2010, Jobs, Apple Chief executive officer responded to that development in a...

Use of “Services.dart” Package in the Flutter

We often come at a point where we need some flexibility, in our app UI. so in this blog, I want to share two...

One Plus 8T: All you need to know!

One Plus unveiled its 2020 flagship in a virtual event named One Plus 8T. In this post we would go through its specifications ,...

Twitter may launch new features to simplify direct messages.

Twitter is said to be working on a couple of new features that could make it easier to manage direct messages and retweeting. The...