出处:
炎之铠邮箱:yanzhikai_yjk@qq.com
本文原创,转载请注明本出处!
介绍
对于进度条ProgressBar,在很多场景都会应用到它,最近项目要用到进度条,在网上搜了很多资料,发现Android源码自带的ProgressBar是一个好东西,只要有好看的UI图片,就可以通过ProgressBar的自定义样式来实现一些好看的进度条,并不一定要重写View来实现。
学习
网上很多文章都是写这个,我也不重复写了,不过网上有很多都是重复而且冗余的,所以这里推荐gitbooks里面一篇很详细明了的一系列文章,看了之后就可以明确知道如何利用自定义的样式,直接通过设置XML文件来做出一个漂亮的ProgressBar了。
补充总结
那一系列的文章已经很详细地讲解了ProgressBar的自定义使用,功能很强大,但是限制也还是有的:
最大的缺点我觉得就是不能设置文字来显示具体进度了,不过按照我的审美来说也不知道文字该加哪里好,所以到时候还是按需求来定制ProgressBar或者将它封装一下吧(封装这里后面具体介绍)。
还有就是不能实现一些比较复杂的特效。
总之,就是要按照需求想法来,如果自定义样式可以实现的,就没必要自己重写一个ProgressBar了,弄几张UI图片就完事了。
扩展——自定义ProgressDialog的实现
学会了使用ProgressBar,现在来做做它的扩展——做一个ProgressDialog,就是弹出一个带有ProgressBar的Dialog,Android自带的ProgressDialog比较简单,虽然也可以通过setProgressDrawable()的方法来实现进度条的自定义样式,但是也不能解决显示文字的问题,而且弹出一个框出来感觉有点丑。现在我们就来做一下这个自定义的ProgressDialog,先看效果(图片资源是借用上面的文章):
1. 设置背景为透明
在XML的styles文件里增加一个透明样式的style
@null
true
@android:color/transparent
true
@null
2. 在XML里组装自定义ProgressDialog
一个Dialog不是一个View,就是相当于一个触发器,当它启动的时候就提醒Activity弹出一个窗口,加载一些View,所以这里定义一个Layout,让Dialog启动的时候可以加载:
android:id="@+id/dialog_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@android:color/transparent"
android:gravity="center"
android:minHeight="60dp"
android:minWidth="180dp"
android:orientation="vertical"
android:padding="10dp">
android:layout_width="match_parent"
android:layout_height="160dp"
android:id="@+id/pb_Circle"
android:max="100"
android:progress="22"
android:indeterminateDrawable="@drawable/progress_indeterminate_gear"
android:indeterminate="true"
android:indeterminateBehavior="repeat"
android:indeterminateDuration="3000"
/>
android:id="@+id/tv_msg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#03a0ff"
android:textSize="22sp" />
android:id="@+id/tv_progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#26a0ff"
android:textSize="22sp" />
这里加了一个ProgressBar和两个TextView,用于显示加载动画和加载进度。
3.继承Dialog,初始化和配置控件
主要逻辑就是使用LayoutInflater把前面设置好的布局加载进来,然后设置相应的控件,逻辑非常简单:
public class CustomProgressDialog extends Dialog {
private ProgressBar progressBar;
private TextView tv_msg,tv_progress;
public CustomProgressDialog(Context context) {
//一开始就设置为透明背景
super(context, R.style.transparent_dialog);
createLoadingDialog(context);
}
public void createLoadingDialog(final Context context) {
LayoutInflater inflater = LayoutInflater.from(context);
//得到加载的view
View v = inflater.inflate(R.layout.custom_dialog_layout, null);
//加载布局
LinearLayout layout = (LinearLayout) v.findViewById(R.id.dialog_view);
progressBar = (ProgressBar) v.findViewById(R.id.pb_Circle);
tv_msg = (TextView) v.findViewById(R.id.tv_msg);
tv_progress = (TextView) v.findViewById(R.id.tv_progress);
//设置不可通过点击外面区域取消
setCanceledOnTouchOutside(false);
setOnCancelListener(new OnCancelListener() {
@Override
public void onCancel(DialogInterface dialog) {
Toast.makeText(context,"加载取消",Toast.LENGTH_SHORT).show();
}
});
// 设置布局,设为全屏
setContentView(layout, new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.MATCH_PARENT));
}
// 设置加载信息
public void setMessage(String msg){
tv_msg.setText(msg);
}
//设置进度条
public void setProgressBar(ProgressBar progressBar) {
this.progressBar = progressBar;
}
//获取进度条
public ProgressBar getProgressBar() {
return progressBar;
}
//设置进度
public void setProgress(int progress){
tv_progress.setText(progress*100/progressBar.getMax() + "%");
progressBar.setProgress(progress);
}
}
4.测试
这里使用Handler做一个定时器来更新ProgressDialog
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
private TimeHandler timeHandler = new TimeHandler();
private Button btn_pd;
private int progress = 0;
private CustomProgressDialog progressDialog;
private String[] MESSAGES = {"加载中","加载中.","加载中..","加载中..."};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btn_pd = (Button) findViewById(R.id.btn_pd);
btn_pd.setOnClickListener(this);
progressDialog = new CustomProgressDialog(this);
progressDialog.setMessage("加载中");
timeHandler.sendEmptyMessage(1);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.btn_pd:
showDialog();
progress = 0;
break;
}
}
private void showDialog(){
progressDialog.show();
}
class TimeHandler extends Handler{
@Override
public void handleMessage(Message msg) {
switch (msg.what){
case 1:
if (progress < 1000){
progress += 20;
progressDialog.setProgress(progress);
progressDialog.setMessage(MESSAGES[progress / 20 % 4]);
}else {
progress = 0;
}
sendEmptyMessageDelayed(1,500);
break;
}
}
}
}
demo地址
后话
前面说过,这个ProgressDialog实际上就是弹出一个窗口,加载一个layout,至于加载什么东西,layout里面都可以自定义,基于这个,我们可以拼凑各种各样的View进去,实现各种各样的效果。
这里做的Progress只是一个Demo,没有涉及一些属性的封装,使用的时候还需要自己再改善一下。下一篇文章将介绍一个自定义ProgressBar从创建到开源的过程,有兴趣可以看一下。