Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android - How to change default SeekBar thickness?

I have this SeekBar:

        <SeekBar         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_marginTop="26dp"         android:id="@+id/seekbar"         android:visibility="gone"         android:maxHeight="3dp"/> 

I have tried to change this SeekBar thickness using maxHeight. But nothing changed. It looks like this:

enter image description here

I want to change this SeekBar's thickness to 3dp and make look like this: enter image description here

So my question is it possible to change SeekBar thickness somehow? If yes, how?

like image 392
Joe Rakhimov Avatar asked Aug 25 '15 19:08

Joe Rakhimov


People also ask

How do I change my SeekBar?

Now open MainActivity. java class Declare objects of SeekBar and TextView, inside onCreate method initialize both objects using findViewById() method. Perform an event of SeekBar change listener that will hold progress value, and by using this event set the progress value inside TextView. seekBar.

How can I increase my SeekBar size?

Edit the maxHeight to your desired height what you want to achieve. It will work perfectly. Show activity on this post. You have to add some padding for all directions and also set the min and max height of the SeekBar.

How do I change my thumb SeekBar?

Just add android:thumbTint="@color/yourColor" in your seekbar.

How can I make my own SeekBar?

Now go to the activity_main. xml create a layout and inside the layout add a SeekBar. Specify the height width of SeekBar and the max progress that you want to use set progress to 0. This will create a customized Seekbar inside activity_main.


1 Answers

You have to change progressDrawable and thumb of SeekBar to adjust it's thickness :

<SeekBar     android:id="@+id/seekBar"     android:layout_width="match_parent"     android:layout_height="wrap_content"     android:layout_below="@id/indSeekBar"     android:layout_marginTop="48dp"     android:progressDrawable="@drawable/seek_bar"     android:thumb="@drawable/seek_thumb"     /> 

Add in drawable folder seek_bar.xml :

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">     <item android:id="@android:id/background">         <shape             android:shape="line">             <stroke                 android:color="@color/seek_bar_background"                 android:width="@dimen/seek_bar_thickness"/>         </shape>     </item>     <item android:id="@android:id/secondaryProgress">         <clip>             <shape                 android:shape="line">                 <stroke                     android:color="@color/seek_bar_secondary_progress"                     android:width="@dimen/seek_bar_thickness"/>             </shape>         </clip>     </item>      <item android:id="@android:id/progress">         <clip>             <shape                 android:shape="line">                 <stroke                     android:color="@color/seek_bar_progress"                     android:width="@dimen/seek_bar_thickness"/>             </shape>         </clip>     </item>  </layer-list> 

seek_thumb.xml :

<shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="oval">     <size         android:height="@dimen/seek_bar_thumb_size"         android:width="@dimen/seek_bar_thumb_size"         />     <solid android:color="@color/seek_bar_progress"/> </shape> 

Add to dimension resources (change this to adjust thickness) :

<dimen name="seek_bar_thickness">4dp</dimen> <dimen name="seek_bar_thumb_size">20dp</dimen> 

Add color resources :

<color name="seek_bar_background">#ababab</color> <color name="seek_bar_progress">#ffb600</color> <color name="seek_bar_secondary_progress">#3399CC</color> 

enter image description here

like image 186
Vaibhav Jani Avatar answered Oct 18 '22 01:10

Vaibhav Jani