Android : How to change the seekbar tick mark color after the progress

77 Views Asked by At

I am trying to implement the seekbar in android. I have set the tickMark drawable which is "grey". On progress the thumb will be red but I also need to change the tickmark which are been progressed to turn as same color as thumb. Please refer the following code I have implemented and screenshot of the output. enter image description here

activity_main.xml :

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="16dp"
    tools:context=".MainActivity">

    <androidx.appcompat.widget.AppCompatSeekBar
        android:id="@+id/seekBar"
        style="@style/Widget.AppCompat.SeekBar.Discrete"
        android:layout_width="match_parent"
        android:layout_height="385dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:max="5"
        android:progress="0"
        android:progressTint="#E50D34"
        android:rotation="270"
        android:thumb="@drawable/sample_switcher_red"
        android:tickMark="@drawable/sample_switcher_grey" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="Progress: 0"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/seekBar" />

</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.kt :

package com.example.seekbardrivemode

import android.graphics.drawable.Drawable
import android.os.Bundle
import android.util.Log
import android.view.View
import android.widget.SeekBar
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity
import androidx.appcompat.widget.AppCompatSeekBar
import androidx.core.content.res.ResourcesCompat


class MainActivity : AppCompatActivity() {

    private lateinit var seekBar: SeekBar
    private lateinit var textView: TextView

//    mSeekBar.setOnTouchListener(new View.OnTouchListener() {
//        @Override
//        public boolean onTouch(View v, MotionEvent event) {
//            // True doesn't propagate the event
//            // the user cannot move the indicator
//            return true;
//        }
//    });

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

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

//        val seekbar = findViewById<AppCompatSeekBar>(R.id.seekBar)
        val drawableRed: Drawable? =
            ResourcesCompat.getDrawable(resources, R.drawable.sample_switcher_red, null)
        val drawableGrey: Drawable? =
            ResourcesCompat.getDrawable(resources, R.drawable.sample_switcher_grey, null)

        // Set a listener to track changes in the SeekBar
        seekBar.setOnSeekBarChangeListener(object : SeekBar.OnSeekBarChangeListener {
            override fun onProgressChanged(seekBar: SeekBar?, progress: Int, fromUser: Boolean) {
                // Update the TextView with the current progress value
                textView.text = "Progress: $progress"

                Log.d(progress.toString(), "onProgressChanged: qwerty")
            }

            override fun onStartTrackingTouch(seekBar: SeekBar?) {
                // Not needed in this example
            }

            override fun onStopTrackingTouch(seekBar: SeekBar?) {
                // Not needed in this example
            }
        })
    }
}

sample_switcher_red.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <!-- Colored rectangle-->
    <item>
        <rotate
            android:fromDegrees="0">
        <shape android:shape="rectangle">
            <size
                android:width="40dp"
                android:height="40dp" />
            <solid android:color="#E50D34" />
        </shape>
        </rotate>
    </item>

</layer-list>

sample_switcher_grey.xml :

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <!-- Colored rectangle-->
    <item>
        <rotate
            android:fromDegrees="0">
            <shape android:shape="rectangle">
                <size
                    android:width="40dp"
                    android:height="40dp" />
                <solid android:color="#9F9F9F" />
            </shape>
        </rotate>
    </item>

</layer-list>

I tried setting the drawable in onprogress, but I have failed. I am unable to get the index of the progress where I can be able to set the drawable according to the index.

0

There are 0 best solutions below