20. 【Android教程】拖动条 SeekBar

简介: 20. 【Android教程】拖动条 SeekBar

这一节要学的控件是 ProgressBar 的升级版,对于 ProgressBar 而言只能展示进度,而不能与用户互动,也就是没有接收用户输入的能力。而本节要学习的 SeekBar 是一种可以“Seek”的 ProgressBar,用户不但可以通过 SeekBar 观察到进度,还可以随时手动修改进度,相信对此场景你一定不会陌生。没错,在视频播放的场景用 SeekBar 实现在合适不过。

1. SeekBar 的特性

前面提到从功能上讲 SeekBar 是 ProgressBar 的升级版,而通过观察 SeekBar 的继承关系,可以发现从代码上来讲它是继承自 ProgressBar 的,所以 ProgressBar 所有的功能 SeekBar 都可以直接使用,另外 SeekBar 在 ProgressBar 的基础之上增加了一个可拖拽的小滑块,用户可以通过拖拽随时改变当前的进度值。适用于各种带互动性质的进度相关场景,比如音频、视频等。

2. SeekBar 的基本用法

SeekBar 的用法比较简单,也比较直观。属性和API基本都和 ProgressBar 类似,而由于需要接收用户的输入,所以在 ProgressBar 的基础之上需要增加一个回调接口,用来监听用户的操作。

2.1 SeekBar 常用属性

SeekBar 的属性都非常好理解,当然也包含了上一节 ProgressBar 的所有属性,这里挑几个常用的做一下讲解:


android:max:

拖拽进度条的最大值。

android:progress:

拖拽进度条的当前进度值。

android:secondaryProgress:

二级滑动条的进度值。

android:thumb:

拖拽滑块的样式资源,默认通常是一个小圆点,大多数时候我们会自定义一个更好看的样式。

android:progressDrawable:

  • 自定义 SeekBar 的进度显示样式,可以设置已走进度和未走进度的不同样式。示例如下,编写 xml 代码,设置android:progressDrawable
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <SeekBar
        android:id="@+id/seekBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:max="100"
        android:progress="60"
        android:progressDrawable="@drawable/seekbar_progress" />
 
</FrameLayout>

在 drawable 资源目录了下创建“seekbar_progress.xml”文件,编写图像资源:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <gradient
                android:endColor="#055CEB"
                android:startColor="#f00"
                android:useLevel="true" />
        </shape>
    </item>
 
</layer-list>

这样就可以为 SeekBar 增加一个渐变的样式,效果如下:

2.2 SeekBar 的常用 API

  • getMax:
    获取当前 SeekBar 的最大进度值
  • getProgress:
    获取当前 SeekBar 的进度值

2.3 SeekBar 回调接口

SeekBar 提供了一个回调接口专门用于处理用户的操作:

SeekBar.OnSeekBarChangeListener

接口中声明了 3 个方法:

  1. 当 SeekBar 的进度发送变化时回调,用来实时监听进度的变化。
public void onProgressChanged (SeekBar seekBar, int progresValue, boolean fromUser)
  1. 参数解析:
  • seekBar: 进度变化的 SeekBar 对象
  • progressValue: 进度变化之后的进度值
  • fromUser: 是否是用户操作,可用来区分进度是通过 API 变化的还是用户拖拽变化的
  1. 当进度条开始被拖拽的时候回调,监听拖拽的起始事件。
  2. public void onStartTrackingTouch(SeekBar seekBar)

参数解析:

seekbar: 被拖拽的 SeekBar 对象


当进度条拖拽结束的时候回调,用来监听拖拽结束事件。

public void onStopTrackingTouch(SeekBar seekBar)
  1. 参数解析:
    seekBar: 被拖拽的 SeekBar 对象

3. SeekBar 完整示例

以上就是 SeekBar 常用的属性和 API 及回调的用法,接下来我们一起通过刚刚学习的知识实现一个简单功能。首先添加一个 SeekBar 并为其添加回调接口实时监听进度变化,然后通过将进度展示到 TextView 上,完整的布局代码如下:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <SeekBar
        android:id="@+id/seekBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:max="100"
        android:progress="60"
        android:progressDrawable="@drawable/seekbar_progress" />
</RelativeLayout>

在以上布局中我们在屏幕中央添加了一个 SeekBar 并在其下方添加了一个 TextView 用来展示 SeekBar 当前的进度。接着编写 Java 代码,主要完成两个任务:


获取 SeekBar 的实例

注册 SeekBar 的状态监听器,实时监控 SeekBar 的进度变化并通过 Toast 打印当前进度

package com.emercy.myapplication;
 
import android.app.Activity;
 
import android.os.Bundle;
import android.widget.SeekBar;
import android.widget.Toast;
 
public class MainActivity extends Activity {
 
    private SeekBar seekBar;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        seekBar = findViewById(R.id.seekBar);
        seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                Toast.makeText(MainActivity.this, "当前进度为 : " + progress, Toast.LENGTH_LONG).show();
            }
 
            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {
 
            }
 
            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {
 
            }
        });
    }
}

通过 Toast 观察,我们在拖拽的同时,可以实时监听到 SeekBar 的状态,效果图如下:




4. 小结

本节学习了一个进度条控件,可以 xml 设置其初始态、样式等属性,而在使用中通过 Java Api 结合业务需求修改各个属性值,达到一个类似视频进度条的 UI 样式。


相关文章
|
8月前
|
网络协议 Android开发 数据安全/隐私保护
Android手机上使用Socks5全局代理-教程+软件
Android手机上使用Socks5全局代理-教程+软件
5509 2
|
8月前
|
缓存 网络协议 安全
49. 【Android教程】HTTP 使用详解
49. 【Android教程】HTTP 使用详解
131 1
|
3月前
|
Android开发 数据安全/隐私保护 虚拟化
安卓手机远程连接登录Windows服务器教程
安卓手机远程连接登录Windows服务器教程
543 4
|
3月前
|
Android开发
布谷语音软件开发:android端语音软件搭建开发教程
语音软件搭建android端语音软件开发教程!
|
8月前
|
XML 存储 JSON
51. 【Android教程】JSON 数据解析
51. 【Android教程】JSON 数据解析
192 2
|
8月前
|
Android开发
Android中如何快速的实现RecycleView的拖动重排序功能
使用`ItemTouchHelper`和自定义`Callback`,在`RecyclerView`中实现拖动排序功能。定义`ItemTouchHelperAdapter`接口,`Adapter`实现它以处理`onItemMove`方法。`SimpleItemTouchHelperCallback`设置拖动标志,如`LEFT`或`RIGHT`(水平拖动),并绑定到`RecyclerView`以启用拖动。完成这些步骤后,即可实现拖放排序。关注公众号“AntDream”获取更多内容。
140 3
|
8月前
|
XML 前端开发 API
Android中实现Bitmap在自定义View中的放大与拖动
Android中实现Bitmap在自定义View中的放大与拖动
171 1
|
8月前
|
存储 编解码 Android开发
58. 【Android教程】音频录制:MediaRecord
58. 【Android教程】音频录制:MediaRecord
84 2
|
8月前
|
Web App开发 移动开发 前端开发
52. 【Android教程】网页视图:WebView
52. 【Android教程】网页视图:WebView
127 1
|
8月前
|
XML 存储 JavaScript
50. 【Android教程】xml 数据解析
50. 【Android教程】xml 数据解析
92 1

热门文章

最新文章

  • 1
    如何修复 Android 和 Windows 不支持视频编解码器的问题?
  • 2
    Android历史版本与APK文件结构
  • 3
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 4
    【04】flutter补打包流程的签名过程-APP安卓调试配置-结构化项目目录-完善注册相关页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程
  • 5
    当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
  • 6
    APP-国内主流安卓商店-应用市场-鸿蒙商店上架之必备前提·全国公安安全信息评估报告如何申请-需要安全评估报告的资料是哪些-优雅草卓伊凡全程操作
  • 7
    【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 8
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 9
    Android经典面试题之Kotlin中Lambda表达式和匿名函数的区别
  • 10
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 1
    【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
    20
  • 2
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
    29
  • 3
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    35
  • 4
    Android历史版本与APK文件结构
    122
  • 5
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    30
  • 6
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
    24
  • 7
    APP-国内主流安卓商店-应用市场-鸿蒙商店上架之必备前提·全国公安安全信息评估报告如何申请-需要安全评估报告的资料是哪些-优雅草卓伊凡全程操作
    60
  • 8
    【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    37
  • 9
    当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
    73
  • 10
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    122