Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make double seekbar in android?

I am building an android application where the user select the a maximum value by seekbar.

I need another button on the same seekbar so that user can select maximum and minimum value from a particular unique seekbar.

Here is my code of single seek bar -

package com.ui.yogeshblogspot;

public class CustomSeekBarExActivity extends Activity implements OnSeekBarChangeListener{
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
 SeekBar bar=(SeekBar)findViewById(R.id.seekBar1);
 bar.setOnSeekBarChangeListener(this);
}

@Override
public void onProgressChanged(SeekBar seekBar, int progress,
        boolean fromUser) {
    // TODO Auto-generated method stub
    TextView tv=(TextView)findViewById(R.id.textView2);
    tv.setText(Integer.toString(progress)+"%");

}

@Override
public void onStartTrackingTouch(SeekBar seekBar) {
    // TODO Auto-generated method stub

}

@Override
public void onStopTrackingTouch(SeekBar seekBar) {
    // TODO Auto-generated method stub

}
}

Here is my xml code of seek bar -

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" 
android:background="#FFFFFF">

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Choose Your Progress"
    android:textColor="#000000"
    android:textAppearance="?android:attr/textAppearanceMedium" />

<SeekBar
    android:id="@+id/seekBar1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    android:layout_gravity="center"
    android:progressDrawable="@xml/progress"
    android:max="100"
    android:thumb="@xml/thumb"/>

<TextView
    android:id="@+id/textView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textColor="#000000"
    android:gravity="center"
    android:layout_gravity="center"
    android:paddingTop="10dp"
    android:textAppearance="?android:attr/textAppearanceMedium" />

</LinearLayout>
like image 443
Hitesh Matnani Avatar asked Nov 10 '14 04:11

Hitesh Matnani


People also ask

How do I change the color of my SeekBar line in Android?

If you are using default SeekBar provided by android Sdk then their is a simple way to change the color of that . just go to color. xml inside /res/values/colors. xml and change the colorAccent.

What is SeekBar?

A SeekBar is an extension of ProgressBar that adds a draggable thumb. The user can touch the thumb and drag left or right to set the current progress level or use the arrow keys. Placing focusable widgets to the left or right of a SeekBar is discouraged. Clients of the SeekBar can attach a SeekBar.


2 Answers

The Android widget class library has only one slider control, seekbar with only one thumb control. Did some research online and found this cool custom widget, range-seek-bar.

you can followed any one of below

https://github.com/edmodo/range-bar

https://code.google.com/p/range-seek-bar/

https://github.com/Larpon/RangeSeekBar

like image 43
Thirumoorthy Avatar answered Sep 24 '22 01:09

Thirumoorthy


Fully Customize two way and single way seek bar you can provide thumb color etc http://codingsignals.com/crystal-range-seekbar-in-android/

Add in your gradle

dependencies {
compile 'com.crystal:crystalrangeseekbar:1.0.0' 
}

Two way seekbar

<com.crystal.crystalrangeseekbar.widgets.BubbleThumbRangeSeekbar
android:id="@+id/rangeSeekbar5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:corner_radius="10"
app:min_value="0"
app:max_value="100"
app:steps="5"
app:bar_color="#F7BB88"
app:bar_highlight_color="#E07416"
app:left_thumb_image="@drawable/thumb"
app:right_thumb_image="@drawable/thumb"
app:left_thumb_image_pressed="@drawable/thumb_pressed"
app:right_thumb_image_pressed="@drawable/thumb_pressed"
app:data_type="_integer"/>
like image 193
Asif Avatar answered Sep 26 '22 01:09

Asif