Implementing a slider SeekBar in Android

Question

I want to implement a slider  which is basically two lines  one vertical and one horizontal  crossing where the screen is touched  I have managed to make one but I have to issues    The slider is not very smooth  there is a slight delay when I m moving the finger If I place two sliders it is not multitouch  and I d like to use both of them simultaneously   Here is the code    public class Slider extends View        private Controller controller   new Controller        private boolean initialisedSlider      private int sliderWidth  sliderHeight      private Point pointStart      private Paint white      private int mode       final static int VERTICAL   0  HORIZONTAL   1  BOTH   2       public Slider Context context            super context           setFocusable true                  TODO Auto-generated constructor stub           public Slider Context context  AttributeSet attrs            super context  attrs                setFocusable true               pointStart   new Point            initialisedSlider   false             mode   Slider BOTH              Override     protected void onDraw Canvas canvas            if  initialisedSlider                initialisedSlider   true              sliderWidth   getMeasuredWidth                sliderHeight   getMeasuredHeight                 pointStart x    int  sliderWidth 2 0               pointStart y    int  sliderHeight 2 0               controller   new Controller pointStart  3                white   new Paint                white setColor 0xFFFFFFFF                      canvas drawLine controller getCoordX   0                          controller getCoordX   sliderHeight                           white           canvas drawLine 0  controller getCoordY                             sliderWidth  controller getCoordY                             white               public boolean onTouchEvent MotionEvent event            int eventaction   event getAction                 int X    int event getX             int Y    int event getY             switch  eventaction             case MotionEvent ACTION DOWN              if isInBounds X Y                     updateController X  Y                             break          case MotionEvent ACTION MOVE              if isInBounds X Y                     updateController X  Y                             break          case MotionEvent ACTION UP              if isInBounds X Y                     updateController X  Y                             break                    invalidate              return true              private boolean isInBounds int x  int y            return   x lt   sliderWidth    amp  amp   x gt   0                      amp  amp   y lt   sliderHeight    amp  amp   y gt   0               private void updateController int x  int y            switch mode            case Slider HORIZONTAL              controller setCoordX x               break          case Slider VERTICAL              controller setCoordY y               break          case Slider BOTH              controller setCoordX x               controller setCoordY y               break                       private class Controller           private int coordX  coordY          Controller                        Controller Point point  int width                setCoordX point x               setCoordY point y                     public void setCoordX int coordX                this coordX   coordX                    public int getCoordX                 return coordX                    public void setCoordY int coordY                this coordY   coordY                    public int getCoordY                 return coordY                      And the XML file     lt LinearLayout xmlns android  http   schemas android com apk res android      android layout width  fill parent      android layout height  fill parent      android orientation  vertical   gt        lt TextView         android layout width  fill parent          android layout height  wrap content          android text   string hello    gt       lt com android lasttest Slider          android id    id slider          android layout width  100dp           android layout height  100dp           android layout gravity  center horizontal           android adjustViewBounds  true   gt       lt com android lasttest Slider          android id    id slider          android layout width  150dp           android layout height  150dp           android layout gravity  center horizontal           android adjustViewBounds  true   gt       lt com android lasttest Slider          android id    id slider          android layout width  200dp           android layout height  200dp           android layout gravity  center horizontal           android adjustViewBounds  true   gt    lt  LinearLayout gt

User · Accepted Answer

Android provides slider which is horizontal

http://developer.android.com/reference/android/widget/SeekBar.html

and implement OnSeekBarChangeListener

http://developer.android.com/reference/android/widget/SeekBar.OnSeekBarChangeListener.html

If you want vertical Seekbar then follow this link

http://hoodaandroid.blogspot.in/2012/10/vertical-seek-bar-or-slider-in-android.html

User · Answer

For future readers   Starting from material components android 1 2 0-alpha01  you have slider component  ex    lt com google android material slider Slider         android id    id slider          android layout width  match parent          android layout height  wrap content          android valueFrom  20f          android valueTo  70f          android stepSize  10    gt       Release notes Material Design Spec Docs

User · Answer

How to implement a SeekBar  Add the SeekBar to your layout  lt  xml version  quot 1 0 quot  encoding  quot utf-8 quot   gt   lt LinearLayout     xmlns android  quot http   schemas android com apk res android quot      android orientation  quot vertical quot      android layout width  quot match parent quot      android layout height  quot match parent quot  gt        lt TextView         android id  quot   id textView quot          android layout margin  quot 20dp quot          android layout width  quot wrap content quot          android layout height  quot wrap content quot   gt        lt SeekBar         android id  quot   id seekBar quot          android max  quot 100 quot          android progress  quot 50 quot          android layout width  quot match parent quot          android layout height  quot wrap content quot   gt    lt  LinearLayout gt   Notes  max is the highest value that the seek bar can go to  The default is 100  The minimum is 0  The xml min value is only available from API 26  but you can just programmatically convert the 0-100 range to whatever you need for earlier versions  progress is the initial position of the slider dot  called a  quot thumb quot    For a vertical SeekBar use android rotation  quot 270 quot    Listen for changes in code public class MainActivity extends AppCompatActivity        TextView tvProgressLabel        Override     protected void onCreate Bundle savedInstanceState            super onCreate savedInstanceState           setContentView R layout activity main               set a change listener on the SeekBar         SeekBar seekBar   findViewById R id seekBar           seekBar setOnSeekBarChangeListener seekBarChangeListener            int progress   seekBar getProgress            tvProgressLabel   findViewById R id textView           tvProgressLabel setText  quot Progress   quot    progress              SeekBar OnSeekBarChangeListener seekBarChangeListener   new SeekBar OnSeekBarChangeListener               Override         public void onProgressChanged SeekBar seekBar  int progress  boolean fromUser                   updated continuously as the user slides the thumb             tvProgressLabel setText  quot Progress   quot    progress                       Override         public void onStartTrackingTouch SeekBar seekBar                   called when the user first touches the SeekBar                     Override         public void onStopTrackingTouch SeekBar seekBar                   called after the user finishes moving the SeekBar                     Notes  If you don t need to do any updates while the user is moving the seekbar  then you can just update the UI in onStopTrackingTouch   See also  SeekBar Tutorial With Example In Android Studio

[android] Implementing a slider (SeekBar) in Android

Examples related to android

Examples related to slider

Examples related to touch

Examples related to seekbar