When using a custom thumb drawable with a SeekBar
view, the thumb drawable is clipped at the left and right edges of the view.
How can I fix this behavi
I ran into this issue myself, and I believe the "correct"
decision would be to modify android:thumbOffset
as the default style for a SeekBar sets it to 8px.
For default SeekBar I used these settings and it works fine:
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:thumbOffset="8dp"
You should be able to fix this by setting paddingLeft and paddingRight
on your SeekBar
to half the thumb width (remember to use density-independent units). You can also control the space allowed at the edges for a seek bar's thumb by calling setThumbOffset.
<androidx.appcompat.widget.AppCompatSeekBar
android:id="@+id/progress_loan_period"
android:layout_width="@dimen/dp_0"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/dp_15"
android:progressDrawable="@drawable/seek_bar"
android:thumb="@drawable/ic_slider"
android:paddingStart="@dimen/dp_0"
android:paddingEnd="@dimen/dp_0"
android:thumbOffset="-0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@id/label_loan_period" />
This gets the job done
Just for clarification.
On some places I have seen
android:thumbOffset="8dp"
and some
android:thumbOffset="8px"
so I looked at the source code. this is the original style
<style name="Widget.SeekBar">
<item name="android:indeterminateOnly">false</item>
<item name="android:progressDrawable">@android:drawable/progress_horizontal</item>
<item name="android:indeterminateDrawable">@android:drawable/progress_horizontal</item>
<item name="android:minHeight">20dip</item>
<item name="android:maxHeight">20dip</item>
<item name="android:thumb">@android:drawable/seek_thumb</item>
<item name="android:thumbOffset">8dip</item>
<item name="android:focusable">true</item>
</style>
from
https://android.googlesource.com/platform/frameworks/base/+/refs/heads/master/core/res/res/values/styles.xml