[Android] Seekbar 커스텀하기 - Thumb 크기 바꾸기

[Android] Seekbar 커스텀하기 - Thumb 크기 바꾸기

Android Seekbar Custom & change Seekbar Thumb size programmatically

   Seekbar 기본

Seekbar를 사용할 때 기본으로 아래와 같이 xml에 정의 하여 사용한다 max 값정도 지정해주고 사용하면 된다.

<SeekBar
    android:id="@+id/sb"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:max="50" />

[ 적용된 Seekbar ]

   Seekbar 값 알아내기

Seekbar에 SeekBar.OnSeekBarChangeListener(를 통해 값을 알아 낸다.

sb.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
    @Override
    public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
        //progress가 바뀐 선택 값
    }
 
    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {
 
    }
 
    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {
 
    }
});

   Seekbar의 Thumb(선택자) 변경하기

anroid:thumb="사용할drawable" 로 정의하여 사용한다.

<SeekBar
    android:id="@+id/sb"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:thumb="@drawable/thumb"
    android:max="50" />

 

[ 적용된 Seekbar ]

위 적용된 모습을 보면 Thumb의 이미지 크기에 따라 Height 가 커지는걸 알 수 있고 Thumb에 백그라운드가 Alpha값이 적용되더라도 ProgressBar를 가리게 된다.

따라서 해당 Thumb의 위치를 올리거나 ProgressBar를 대체할 이미지를 찾아야 한다.

   Seekbar의 ProgressBar 안보이게 하기

android:progressDrawable = "@null" 안보이게 할 수 있다.

android:layout_height = "45dp" 처럼 값을 지정해주고

배경색상을 지정하면 아래와 같은 모습을 볼 수 있는데 높이에 따라 Thumb가 잘리는걸 볼 수 있다.

<SeekBar
    android:id="@+id/sb"
    android:layout_width="match_parent"
    android:layout_height="45dp"
    android:thumb="@drawable/thumb"
    android:background="@color/colorPrimary"
    android:progressDrawable="@null"
    android:layout_centerInParent="true"
    android:max="50" />

[ 적용된 Seekbar ]

   Seekbar의 Thumb 크기 바꾸기 

Seekbar의 크기에 맞추어 Thumb 크기를 조절해주면 아래의 결과를 볼 수 있다.

ProgressBar를 대체할 만한 배경을 대체해주면 Custom된 모습이 훨신 나아 보일 것이다.

public static void setSeekberThumb(final SeekBar seekBar, final Resources res) {
    seekBar.getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
        @Override
        public boolean onPreDraw() {
 
            if (seekBar.getHeight() > 0) {
                Drawable thumb = res.getDrawable(R.drawable.indicator);
                int h = seekBar.getMeasuredHeight();
                int w = h;
                Bitmap bmpOrg = ((BitmapDrawable) thumb).getBitmap();
                Bitmap bmpScaled = Bitmap.createScaledBitmap(bmpOrg, w, h, true);
                Drawable newThumb = new BitmapDrawable(res, bmpScaled);
                newThumb.setBounds(0, 0, newThumb.getIntrinsicWidth(), newThumb.getIntrinsicHeight());
                seekBar.setThumb(newThumb);
                seekBar.getViewTreeObserver().removeOnPreDrawListener(this);
            }
            return true;
        }
    });
}

[ 적용된 Seekbar ]

  Custom Seekbar 

https://android-arsenal.com/details/1/4630