Home Tutorials SeekBar Tutorial With Example

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
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

3 COMMENTS

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Realme 3 Pro :Specifications, Features and price

RealMe 3 Pro is official now, the successor of RealMe 2 Pro, and on the market, it would be directly targeting Redmi Note 7. Realme...

How to get Sharpshooter title in PUBG mobile in 10 hours

In this post, we are going to talk about how to get the “Sharpshooter” title in PUBG Mobile easily. About the Title To get the title of...

4 Best Google Chrome Ad blocker You Can Use To Block Annoying Ads

Internet businesses run on ads. They generate revenue from those blocks of ads which annoy you a lot. But which is the Best...

How to know who deleted you from friend list in Facebook?

Its social world, tons of people today interconnect and socialize with each other and exchange information or data. Facebook is one of the most...