SeekBar: Seekbar中的一些细节要点

1. 修改SeekBar中进度条的高度

android:maxHeight和android:minHeight 。前者是用来指定进度条最大高度的(此高度并非SeekBar整个控件的高度),后者是用来指定最小高度,一般将这两个属性值设置成一致即可。

2. 滑块和背景之间有截断的问题

android:thumbOffset。通常设置thumb后,滑动图片会被隐藏一部分。设置thumbOffset就可以解决该问题:android:thumbOffset="0dp", 该现象在5.0上居多。

3. 滑块四周不透明

android:splitTrack="false"。有时候发现UI给的滑块图片四周是透明的,但是放上去之后发现四周是不透明的,这是因为“The Material seek bar has split track enabled by default”。

4. 默认Seekbar左右两边有一定距离的padding

android:paddingStart="0dp"
android:paddingLeft="0dp"
android:paddingEnd="0dp"
android:paddingRight="0dp"

在XML文件里将其padding都设置为0。

5. 默认拖拽滑块时四周会出现阴影

android:duplicateParentState="true"。若不需要该效果,可指定该属性。

附:自定义Seekbar完整定义:

进度条

复制代码
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 背景 -->
    <item android:id="@android:id/background">
        <shape android:shape="rectangle">
            <solid android:color="#ACACAC" />
            <corners android:radius="2dp" />
        </shape>
    </item>

    <!-- 进度 -->
    <item android:id="@android:id/progress">
        <clip>
            <shape android:shape="rectangle">
                <solid android:color="#2382F7" />
                <corners android:radius="2dp" />
            </shape>
        </clip>
    </item>
</layer-list>
复制代码

滑块

复制代码
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#FFFFFF" />
    <stroke
        android:width="1dp"
        android:color="#BBBBBB" />
    <size
        android:width="26dp"
        android:height="26dp" />
</shape>
复制代码

XML:

复制代码
<SeekBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="20dp"
        android:layout_marginTop="20dp"
        android:layout_marginEnd="20dp"
        android:max="100"
        android:maxHeight="2dp"
        android:minHeight="2dp"
        android:progress="0"
        android:progressDrawable="@drawable/app_vivo_seek_bar_bg"
        android:thumb="@drawable/app_vivo_seek_bar_thumb"
        android:progress="40" />
复制代码

效果:

 

参考链接:

1. Android 仿vivo的SeekBar样式

2. android seekbar 踩坑之路

 



如果您觉得阅读本文对您有帮助,请点一下“推荐”按钮,您的“推荐”将是我最大的写作动力!欢迎各位转载,但是未经作者本人同意,转载文章之后必须在文章页面明显位置给出作者和原文连接,否则保留追究法律责任的权利。
posted @   夜行过客  阅读(5065)  评论(0编辑  收藏  举报
编辑推荐:
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
阅读排行:
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· 单线程的Redis速度为什么快?
· 展开说说关于C#中ORM框架的用法!
· Pantheons:用 TypeScript 打造主流大模型对话的一站式集成库
点击右上角即可分享
微信分享提示