klienta kciuk na SeekBar w Androidzie

Question

Chcę utworzyć własny kciuk do SeekBar który powinien wyglądać tak:

Jednym z rozwiązań mogłoby być this one, gdzie png zdjęcia zostaną wykorzystane do opracowania kciuka.

Uważam, że powinno być możliwe do wykorzystania tylko XML, ponieważ jest on bardzo podobny do tego kciuka:

thumb.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval"> 

    <size android:height="30dp" android:width="30dp"/> 
    <stroke android:width="18dp" android:color="#882EA5DE"/> 
    <solid android:color="#2EA5DE" /> 
    <corners android:radius="1dp" /> 

</shape> 

wystarczy dodać drugą granicę (biały obrót wokół), dzięki czemu mogę pominąć, aby zarządzać wszystkimi obrazami dla różnych rozdzielczości ekranu (hdpi/mdpi/xhdpi/xxhdpi).

Próbowałem różnych kombinacji z kształtami "owalne" i "pierścień", ale nie mógł uzyskać wymagany wynik. Jak możesz to zrobić?

Answer 1

I nie udało się znaleźć rozwiązanie tylko xml, dlatego użyłem obrazek aby rozwiązać ten problem, z niewielką pomocą z this answer:

1. Utworzony obraz kciuka seekbar_thumb_icon.png i zapisane to w różnych rozdzielczościach w mapach (hdpi/mdpi/xhdpi/xxhdpi).

2. określono "android: kciuk =" @ układ/seekbar_thumb”dla SeekBar:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<item> 
<shape> 
    <size 
     android:height="30dp" 
     android:width="30dp" /> 

    <solid android:color="@android:color/transparent" /> 
</shape> 
</item> 
<item android:drawable="@drawable/balance_icon_48px"/> 

</layer-list> 

Inne style:

<SeekBar 
android:id="@+id/seekbar" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:progressDrawable="@layout/seekbar_style" 
android:thumb="@layout/seekbar_thumb" /> 

seekbar_style.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="match_parent" 
    android:layout_width="match_parent"> 

    <item android:id="@android:id/background" 
     android:drawable="@layout/seekbar_background" /> 

    <item android:id="@android:id/progress"> 
     <clip android:drawable="@layout/seekbar_progress" /> 
    </item> 
</layer-list> 

seekbar_background.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:shape="line"> 

    <stroke android:width="2dp" android:color="#868686"/> 
    <corners android:radius="1dp" /> 
</shape> 

seekbar_progress.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:shape="line"> 

    <stroke android:width="2dp" android:color="#ffffff"/> 
    <corners android:radius="1dp" /> 
</shape>