Add an item at current progressBar position - 创建自定义进度条

Add an item at current progressBar position - Creating a custom progress bar

我正在尝试创建一个如下所示的自定义进度条:

我设法创建了布局,但我不知道如何将那个圆圈放在当前 progressBar 进度位置。有人知道如何实现吗?

我的 xml 布局如下所示:

<!-- Define the background properties like color etc -->
<item android:id="@android:id/background">
    <shape>
        <solid android:color="#ffffff" />
        <corners android:radius="1dip" />
    </shape>
</item>

<!-- Define the progress properties like start color, end color etc -->
<item android:id="@android:id/progress">
    <clip>
        <shape>
            <solid android:color="#42cbf4"
                android:width="40dp"/>
        </shape>
    </clip>
</item>

我还为透明背景添加了一个linearLayout 我尝试在进度项中放置另一个椭圆形,或为 secondProgress 创建另一个形状,但没有任何效果。 现在,它看起来像这样:

这种ProgressBar叫做"seek bar",网上有很多实现。也许你可以在 The Android Arsenal by typing "seek" in search. By the way, I've found a simple but pretty one on the site; you can find it here.

上搜索它

我找到了我要找的东西。我使用 SeekBar 而不是 ProgressBar,它实现了我需要的 thumb。对于自定义,我使用了相同的布局,对于拇指,我使用了这个片段:

thumb.xml:

<?xml version="1.0" encoding="UTF-8"?>

<gradient
    android:angle="270"
    android:endColor="#026b91"
    android:startColor="#026b91" />

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

custom_progress_bar.xml:

<!-- Define the background properties like color etc -->
<item android:id="@android:id/background">
    <shape>
        <solid android:color="#ffffff" />
        <corners android:radius="1dip" />
    </shape>
</item>

<!-- Define the progress properties like start color, end color etc -->
<item android:id="@android:id/progress">
    <clip>
        <shape>
            <solid android:color="#42cbf4"
                android:width="40dp"/>
        </shape>
    </clip>
</item>

为了将这些自定义添加到我的进度条中,我使用了以下代码:

<SeekBar
   android:id="@+id/seekBar"
   android:thumb="@drawable/thumb"
   android:progressDrawable="@drawable/custom_progress_bar"
   android:layout_width="match_parent"
   android:layout_height="wrap_content" />

有关更多信息,我使用了此线程