android开发中-使用Dialog ProgressDialog

 

ProgressDialog是AlertDialog的子类,我们用它来显示有进度条的Dialog。这种带有进度的UI控件在好多UI框架中都可以看到,当用户执行一个操作时间较长的操作时,在一个设计良好的系统中应该要显示一个进度条提示用户目前处理的进度到哪了。在安装应用程序和网络交互应用中最常见到进度条,安装应用程序由于耗时长,所以需要指示用户进度,网络交互由于网络环境的不稳定也需要指示用户交互的进度(尤其是当你在上传或下载大文件时)。所以进度条是一个很常用到的控件。

Android为我们提供了一个很好用的内置处理进度条的Dialog,它就是ProgressDialog。ProgressDialog里的进度条分为两种:可确定值进度条和不可确定值进度条。可确定值进度条是指:系统能指示目前进度值,需要更新目前进度条的值,如果进度条到达一定值就表示完成进度。不可确定值进度条是指:系统指示需要等待,但是没有给出目前进度,所以你无法得知目前进度到哪里,只是能看到系统在处理,还需要等待的界面,所以说它没有一个确定值。

我们来看一个最简单的显示ProgressDialog的代码:

 

上面代码直接显示了一个ProgressDialog,它是属于不可确定值进度条的ProgressDialog,它的参数很简单第一个参数是Context上下文信息,第二个参数是Dialog的title标题,第三个参数则是Dialog的body要显示的信息,代码的效果如下:

可以看到ProgressDialog显示了一个在转动的小圆圈,这个小圆圈将会永久转动直到Dialog消失掉,所以这是一个不可确定值的进度条。运行代码我们发现这个Dialog不可取消掉,它会一直存在直到你用代码控制让dialog消失,所以它是不可取消的,如果要让用户可以取消,要再后面添加两个参数,分别是:

 

 

上面使用show方法创建的不可确定值的ProgressDialog比较简单,如果要创建一个可确定值的进度条dialog就会比较麻烦,因为你需要编写一些额外的代码来控制进度条。这边创建ProgressDialog就需要通过new 创建一个新对象,它没有Builder可以通过配置来生成。所以我们要做的就是:

  1. 创建ProgressDialog对象
  2. 设置它内部的进度条是可确定值的
  3. 将它显示出来
  4. 更新进度条值,当进度完成后隐藏对话框

 

我们根据上面这几步,创建一个可复用的可确定值的ProgressDialog。首先我们要给需要managed的Dialog分配一个id值,然后重写onCreateDialog方法创建ProgressDialog。

 

在这里我们重写Activity的onCreateDialog方法,让ProgressDialog变成是可复用的managed dialog。当点击按钮时我们调用:

 

将onCreateDialog方法里创建的ProgressDialog对象显示出来:

上面就是可确定值进度条ProgressDialog的效果,可是它的进度条不会动,这是因为你还没用代码去控制进度条的进度,所以这边我们需要编写一些额外代码,当窗体显示时首先让进度条归零,然后用一个线程让进度条每100ms增加1,所以总共要10秒才能读完整个进度条。我们用Handler对象来处理,因为android中使用的是UI单线程模式,你自己创建线程不能访问UI控件,否则会抛出异常。而Handler会将需要执行的代码放到UI线程去执行。所以我们先定义一个Handler内部类来改变进度条的值。

 

然后添加按钮事件,当用户点击显示可确定值ProgressDialog时,首先将进度条清0,然后发送第一条开始更新进度条的handler消息,因为handler消息处理方法内部有循环调用发送消息,所以只要第一次触发程序就会每100ms发送一个更新消息,直到进度条值到达100,隐藏掉对话框。所有代码如下:

 

 

代码运行效果如下:

用户可以看到在走动的进度条,当进度条达到100时ProgressDialog就自动消失。这边一个难点就是Handler的用法,这个以后会再仔细介绍,现在先了解Handler就是可以将代码放到UI线程去执行即可。

 

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Element UI是一套基于Vue.js的组件库,其el-dialog是其的一个组件,用于实现弹窗对话框的功能。下面是关于el-dialog使用介绍: 1. 引入Element UI库:在Vue项目,首先需要引入Element UI库。可以通过npm安装,然后在项目的入口文件引入Element UI的样式和组件。 2. 使用el-dialog组件:在需要使用弹窗对话框的地方,可以使用el-dialog组件进行布局和交互。以下是el-dialog的基本用法: ```html <template> <div> <el-button @click="showDialog">打开对话框</el-button> <el-dialog :visible.sync="dialogVisible" title="对话框标题"> <p>对话框内容</p> <span slot="footer" class="dialog-footer"> <el-button @click="dialogVisible = false">取 消</el-button> <el-button type="primary" @click="dialogVisible = false">确 定</el-button> </span> </el-dialog> </div> </template> <script> export default { data() { return { dialogVisible: false }; }, methods: { showDialog() { this.dialogVisible = true; } } }; </script> ``` 在上述代码,通过点击按钮打开对话框,使用`:visible.sync`绑定`dialogVisible`变量控制对话框的显示与隐藏。`title`属性设置对话框的标题,`slot="footer"`用于自定义对话框的底部按钮。 3. 自定义对话框内容:可以在el-dialog组件内部编写自定义的对话框内容,可以是文本、表单、图片等任意HTML元素。 4. 更多配置选项:el-dialog还提供了一些其他的配置选项,如`width`设置对话框的宽度,`modal`设置是否显示遮罩层等。可以根据实际需求进行配置。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值