Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Changing the size of the seekbar programmatically but cant get the thumb to be larger than the bar

I have to make a seekbar where i can change almost everything programmatically. And now I'm having a problem to change the thumb and the bar size. Everything works great if the bar is larger or the same size as the thumb, but if the thumb is larger than the bar, I can't get it to show the entire thumb with the correct size of the bar.

Here's my code to create the thumb:

   public void setSeekBarThumb(int width, int height, int rColor, int gColor, int bColor){

        ShapeDrawable thumb = new ShapeDrawable( new OvalShape() );
        thumb.setIntrinsicHeight( height );
        thumb.setIntrinsicWidth( width );
        thumb.setBounds(new Rect(0, 0, width, height));


        StateListDrawable states = new StateListDrawable();
        states.addState(new int[] {android.R.attr.state_pressed},thumb  );//add to the state list with the state pressed

        thumb = new ShapeDrawable( new OvalShape() );
        thumb.setIntrinsicHeight( height );
        thumb.setIntrinsicWidth( width );
        thumb.setBounds(new Rect(0, 0, width, height));

        states.addState(new int[] { },thumb );//add to the state list with no state

        seekbar.setThumb(states); 
        seekbar.setThumbOffset(0);
  }

heres my code to create the bar:

   public void setSeekBarProgress(int width, int height, int rColor, int gColor, int bColor){
        GradientDrawable shape = new GradientDrawable(Orientation.BOTTOM_TOP, new int[]{Color.WHITE,Color.rgb(rColor, gColor, bColor)});
        shape.setCornerRadius(50);
        shape.setSize(width, height);
        shape.setBounds(0, 0, width, height);
        ClipDrawable clip = new ClipDrawable(shape, Gravity.LEFT,ClipDrawable.HORIZONTAL);

        shape = new GradientDrawable(Orientation.BOTTOM_TOP, new int[]{Color.WHITE, getResources().getColor(R.color.DimGray)});
        shape.setCornerRadius(50);//change the corners of the rectangle 
        shape.setSize(width, height);
        shape.setBounds(0, 0, width, height);

        LayerDrawable mylayer= new LayerDrawable(new Drawable[]{shape, clip,});

        seekbar.setProgressDrawable(mylayer); 
        seekbar.setProgress(50);

  }

Here is my code to put everything together, where I set the height of the seek bar:

  public MySeekBar(Activity activity, AbsoluteLayout ParentLayout, SeekBarParameters parameters)
  {        
        super(activity.getApplicationContext());



        seekbar =(SeekBar)activity.getLayoutInflater().inflate(R.layout.horizontal_seek_bar, ParentLayout,false);
        seekbar.setMax(100);    
         setSeekBarThumb(parameters.widthThumb, parameters.heightThumb,0,100,0);
         setSeekBarProgress(parameters.width, parameters.height,255,69,0); 

         int drawHeight;
         if(parameters.height>parameters.heightThumb) drawHeight=parameters.height;
         else drawHeight=parameters.heightThumb; 

        AbsoluteLayout.LayoutParams params = new   AsoluteLayout.LayoutParams(parameters.width,drawHeight,parameters.xPosition, parameters.yPosition);
        ParentLayout.addView(seekbar, params);                       

  }

The XML code where I inflate the bar from:

  <SeekBar xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:gravity="center"
      android:layout_gravity="center"
      android:max="100"
      android:progress="0"
      android:secondaryProgress="0"
      android:maxHeight="10000dip"
      android:id="@+id/slider"
   />

To change the size of the seek bar I use ParentLayout.addView(seekbar, params).
When adding the view, if I use the height that I want to the bar, the thumb gets cutted. If I use the height of the thumb, the bar gets to the same height of the thumb. Android resizes the bar to the size I use to add the view.
I tryed setting the size of the GradientDrawable that is the bar with shape.setSize(width, height), I also tried shape.setBounds(0, 0, width, height), and I tried creating another image with the right size and adding to the LayerDrawable mylayer. But nothing worked.

When creating this through XML it's possible to use paddingTop and paddingBottom to get the bar to the right size. But I don't know how to do this to the GradientDrawable programmatically.

like image 465
Alan Avatar asked Oct 31 '12 13:10

Alan


People also ask

How do you change the size of your thumb in SeekBar?

Show activity on this post. Then I used vector code in . xml file, which has attrs android:width="28dp" and android:height="28dp" in the vector tag. Here we can change the size of the thumb.

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 SeekBar value?

In Order to the seekBar to Change while you are in the Activity you need to Call the method setProgress(), and pass it a boolean animate value.

How do I change SeekBar thickness?

You can use the Slider provided by the Material Components Library. Use the app:trackHeight="xxdp" (the default value is 4dp ) to change the height of the track bar. It requires the version 1.2. 0 of the library.


1 Answers

well, too bad there were no responses but i was able to answer the question myself. The answer is to use InsetDrawable. You have to put the one of the drawables of the bar into a InsetDrawable.

Thats the code:

  public void setSeekBarProgress(int width, int height, int rColor, int gColor, int bColor){
        GradientDrawable shape2 = new GradientDrawable(Orientation.BOTTOM_TOP, new int[]{Color.WHITE,Color.rgb(rColor, gColor, bColor)});
        shape2.setCornerRadius(50);                     
        ClipDrawable clip = new ClipDrawable(shape2, Gravity.LEFT,ClipDrawable.HORIZONTAL);

        GradientDrawable shape1 = new GradientDrawable(Orientation.BOTTOM_TOP, new int[]{Color.WHITE, getResources().getColor(R.color.DimGray)});
        shape1.setCornerRadius(50);//change the corners of the rectangle    
        InsetDrawable d1=  new InsetDrawable(shape1,5,5,5,5);//the padding u want to use        


        LayerDrawable mylayer = new LayerDrawable(new Drawable[]{d1,clip});


        seekbar.setProgressDrawable(mylayer); 

        seekbar.setProgress(50);

  }

I hope this can help someone else with the same problem.

like image 171
Alan Avatar answered Oct 15 '22 13:10

Alan