首页 > 解决方案 > 自定义搜索栏

问题描述

我的目标是在我的 SeekBar 中得到这样的结果 在此处输入图像描述

这是我的代码

  <SeekBar
                    android:id="@+id/seekBar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:max="10"
                    android:splitTrack="false"
                    android:progress="1"
                    android:progressDrawable="@drawable/seek_bar_ruler"
                    android:thumb="@drawable/seek_bar_slider" />

seek_bar_ruler.xml 代码

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background"
    android:height="@dimen/dimen_p_20">
    <shape android:shape="rectangle">
        <solid
            android:color="#D8D8D8" />
        <corners android:radius="@dimen/dimen_p_16" />
    </shape>
</item>
<item android:id="@android:id/progress"
    android:height="@dimen/dimen_p_20">
    <clip>
        <shape android:shape="rectangle">
            <solid
                android:color="#0099FF" />
            <corners android:radius="@dimen/dimen_p_16" />
        </shape>
    </clip>
</item>

seek_bar_slider.xml

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

<solid android:color="@android:color/white" />
<stroke
    android:width="@dimen/dimen_p_10"
    android:color="@color/light_blue"
    />
<size
    android:width="@dimen/dimen_p_40"
    android:height="@dimen/dimen_p_40"
    />

使用我的代码,我得到了这样的结果在此处输入图像描述

如您所见,第二张图片来自 Scatch 文件,第二张图片来自代码,两者都不相同。我有几个问题 1) 有什么方法可以在拇指 xml 文件中添加阴影吗?(如第一张图片) 2)如何降低进度高度?在第二张图片中,进度高度很大 3) 当进度为 0 位置时,拇指图像'不在左侧,谢谢

标签: androidandroid-xmlandroid-drawableandroid-seekbar

解决方案


对于 API 级别 23 及更高级别

在 seek_bar_ruler.xml 中,包装<layer-list><inset>设置android:insetTop如下:

<inset xmlns:android="http://schemas.android.com/apk/res/android"
     android:insetTop="8dp">

     <layer-list>
         <item
             android:id="@android:id/background"
             android:height="6dp"> <!--changed-->
             <shape android:shape="rectangle">
                 <solid android:color="#D8D8D8" />
                 <corners android:radius="16dp" />
             </shape>
         </item>

         <item
             android:id="@android:id/progress"
             android:height="6dp">  <!--changed-->
             <clip>
                 <shape android:shape="rectangle">
                     <solid android:color="#0099FF" />
                     <corners android:radius="16dp" />
                 </shape>
             </clip>
         </item>
     </layer-list>

 </inset>

结果 :


推荐阅读