Android UI组件进阶(1)——带进度条的按钮

Android UI组件进阶(1)——带进度条的按钮



本节引言:

这个系列是继Android UI组件实例大全后的进阶系列,在该系列中我们将进一步的学习

Android UI组件,建议阅读本系列前线学习下UI组件实例大全系列,掌握基本组件的使用;

当然你也可以直接学习本系列!好了,废话不多说,直接开始第一节吧!本节要演示的是:

带进度条的按钮!相信大家在360手机助手到看到这个东东吧:

Android UI组件进阶(1)——带进度条的按钮_第1张图片Android UI组件进阶(1)——带进度条的按钮_第2张图片

本节要实现的就是下方这个点击后显示进度的按钮



效果图:

Android UI组件进阶(1)——带进度条的按钮_第3张图片




必备基础:

1.进度条的一些属性:

background:设置背景图片

max:设置进度条的最大值

progress:设置进度条的值

style="?android:attr/progressBarStyleHorizontal" :定义进度条为水平方向的风格

progressDrawable:当我们不想使用系统默认的Progress时可以自己定义一个,这个资源文件就是

用来调用我们自己定义的Progress图标的一般是在drawable下建立一个.xml件使用layer-list来组

织这些图标.


2.Handler的相关方法:

对UI的操作要么在主线程中进行,要么在handler中进行,切忌别在新线程中直接操作UI组件,会报异常的!

handleMessage(msg):使用Handle需要重写的主要方法,使用msg.what判断标识码,执行对应操作

sendEmptyMessage(0x123):发送一个空信息给handle,标识码为0x123

sendEmptyMessageDelayed(0x321,500);发送一个空信息给handler,标识码为0x321,延迟500毫秒后发送




工程解析:

Android UI组件进阶(1)——带进度条的按钮_第4张图片



相关代码:

MainActivity.java

[java]   view plain copy print ?
  1. package com.jay.uidemo.progressbuttondemo;  
  2.   
  3.   
  4. import android.app.Activity;  
  5. import android.os.Bundle;  
  6. import android.os.Handler;  
  7. import android.os.Message;  
  8. import android.view.View;  
  9. import android.widget.Button;  
  10. import android.widget.ProgressBar;  
  11. import android.widget.TextView;  
  12.   
  13. public class MainActivity extends Activity {  
  14.   
  15.     int i=0;  
  16.     ProgressBar progressBar=null;  
  17.     Button downLoadBtn=null;  
  18.     Handler handler=new Handler(){  
  19.         public void handleMessage(Message msg) {  
  20.             switch (msg.what) {  
  21.             case 0x123:  
  22.                 downLoadBtn.setClickable(false);  
  23.                 i+=20;  
  24.                 progressBar.setProgress(i);  
  25.                 if(i!=100){  
  26.                     handler.sendEmptyMessageDelayed(0x123,500);  
  27.                     downLoadBtn.setText(i+"%");  
  28.                 }else if(i==100){  
  29.                     downLoadBtn.setText("下载完成");  
  30.                     handler.sendEmptyMessageDelayed(0x321,500);  
  31.                 }  
  32.                 break;  
  33.             case 0x321:  
  34.                 downLoadBtn.setText("打开");  
  35.                 downLoadBtn.setClickable(true);  
  36.                 downLoadBtn.setBackgroundResource(R.drawable.aa_button_after);  
  37.                 handler.sendEmptyMessageDelayed(0x110,1000);  
  38.                 break;  
  39.             case 0x110:  
  40.                 progressBar.setProgress(0);  
  41.                 downLoadBtn.setBackgroundResource(R.drawable.btn_selector);           
  42.                 downLoadBtn.setText("下载");  
  43.             default:  
  44.                 break;  
  45.             }  
  46.         };  
  47.     };  
  48.       
  49.     @Override  
  50.     protected void onCreate(Bundle savedInstanceState) {  
  51.         super.onCreate(savedInstanceState);  
  52.         setContentView(R.layout.activity_main);  
  53.           
  54.          TextView tx = (TextView) findViewById(R.id.texttitle);  
  55.           progressBar=(ProgressBar) findViewById(R.id.progressBar);  
  56.           downLoadBtn=(Button) findViewById(R.id.downLoadBtn);  
  57.           downLoadBtn.setOnClickListener(new View.OnClickListener() {  
  58.               
  59.             @Override  
  60.             public void onClick(View v) {  
  61.                  i= 0;  
  62.                 handler.sendEmptyMessage(0x123);  
  63.             }  
  64.         });  
  65.           
  66.     }  
  67. }  


drawable中的btn_selctor.xml

[html]   view plain copy print ?
  1. xml version="1.0" encoding="utf-8"?>  
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android" >  
  3.     <item android:state_pressed="false" android:drawable="@android:color/transparent">item>  
  4.     <item android:state_pressed="true" android:drawable="@drawable/aa_button_gray_pressed">item>  
  5. selector>  


drawable中的progress_selctor.xml

[html]   view plain copy print ?
  1. xml version="1.0" encoding="utf-8"?>  
  2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
  3.     <item android:id="@android:id/progress">  
  4.         <clip android:gravity="left"  
  5.             android:clipOrientation="horizontal"  
  6.             android:drawable="@drawable/aa_button_normal"/>  
  7.     item>  
  8. layer-list>  

activity_main.xml:

[html]   view plain copy print ?
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:paddingBottom="@dimen/activity_vertical_margin"  
  6.     android:paddingLeft="@dimen/activity_horizontal_margin"  
  7.     android:paddingRight="@dimen/activity_horizontal_margin"  
  8.     android:paddingTop="@dimen/activity_vertical_margin"  
  9.     tools:context="com.jay.uidemo.progressbuttondemo.MainActivity" >  
  10.   
  11.     <TextView  
  12.         android:id="@+id/texttitle"  
  13.         android:layout_width="wrap_content"  
  14.         android:layout_height="wrap_content"  
  15.         android:text="带有进图条的按钮" />  
  16.      <RelativeLayout   
  17.             android:layout_width="fill_parent"  
  18.             android:layout_height="50dp"  
  19.             android:gravity="bottom"  
  20.             android:layout_centerHorizontal="true"  
  21.             android:layout_centerVertical="true"  
  22.             >  
  23.             <ProgressBar  
  24.                 android:id="@+id/progressBar"  
  25.                 style="?android:attr/progressBarStyleHorizontal"  
  26.                 android:layout_width="fill_parent"  
  27.                 android:layout_height="fill_parent"  
  28.                 android:background="@drawable/aa_button_gray_normal"  
  29.                 android:max="100"  
  30.                 android:progress="0"  
  31.                 android:progressDrawable="@drawable/progress_selector" />  
  32.              <Button  
  33.                 android:id="@+id/downLoadBtn"  
  34.                 android:layout_width="fill_parent"  
  35.                 android:layout_height="fill_parent"  
  36.                 android:text="下载"  
  37.                 android:layout_centerHorizontal="true"  
  38.                 android:layout_centerVertical="true"  
  39.                 android:background="@drawable/btn_selector"  
  40.                  />  
  41.            
  42.         RelativeLayout>  
  43. RelativeLayout>  


源码下载:

http://pan.baidu.com/s/1hql9qOc

你可能感兴趣的:(Android UI组件进阶(1)——带进度条的按钮)