花样Android ProgressBar 史上最强大讲解/定制ProgressBar

专访周家安：我的十年编程自学之路        2013年全国百所高校巡讲讲师招募

花样Android ProgressBar 史上最强大讲解/定制ProgressBar

分类： Android 技术文档 2012-09-06 14:51 238人阅读 评论(0) 收藏 举报

android encoding frameworks java html layout

目录(?)[+]

1. UI线程里初始化
2. handler里回调 显示 隐藏
3. 重画Progressbar的进度

 花样Android ProgressBar 史上最强大讲解

// UI线程里初始化 

[java]  view plain copy

1. mProgressBar = new ProgressBar(AppConfig.getContext());  
2.   
3. FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(  
4.         LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);  
5. // 居中  
6. params.gravity = Gravity.CENTER;  
7.   
8. AppConfig.getMainActivity().addContentView(mProgressBar, params);  
9. mProgressBar.setVisibility(View.INVISIBLE);  

// handler里回调 显示 | 隐藏

[java]  view plain copy

1. case MSG_PROGRESSBAR_SHOW:  
2.     mProgressBar.setVisibility(View.VISIBLE);  
3.     break;  
4.       
5. case MSG_PROGRESSBAR_HIDE:  
6.     // 多次请求时，只响应第一个HIDE消息  
7.     mHandler.removeMessages(MSG_PROGRESSBAR_SHOW);  
8.     mProgressBar.setVisibility(View.INVISIBLE);  
9.     break;  

// 重画Progressbar的进度

1.indeterminate mode | 没有具体进度的进度条

1.1 定制动画文件

[html] view plain copy print ?

1. <ProgressBar  
2.   android:layout_width="wrap_content"  
3.   android:layout_height="wrap_content"  
4.   android:indeterminateDrawable="@drawable/progress_my_style"  
5.   style="?android:attr/progressBarStyle"  
6. />  

<ProgressBar
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:indeterminateDrawable="@drawable/progress_my_style"
  style="?android:attr/progressBarStyle"
/>

注：style="?android:attr/progressBarStyle" 这是默认样式 ,可换改

step2: 在drawable文件夹下建立progress_my_style.xml文件：内容可如下：

[html] view plain copy print ?

1. <animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"  
2.   android:drawable="@drawable/spinner_color"  
3.   android:pivotX="50%"  
4.   android:pivotY="50%"  
5.   />  

<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
  android:drawable="@drawable/spinner_color"
  android:pivotX="50%"
  android:pivotY="50%"
  />

注意：
1. android:drawable="@drawable/spinner_color" 这里，你需要在drawable下建立spinner_color.png图片（自己画成你所想到的效果（渐变））

2. progress_my_style.xml文件内容参考至D:\andrirod\android-sdk-windows\platforms\android-7\data\res\drawable\progress_medium_white.xml文件内容,

android:framesCount与android:frameDuratiion是frameworks内部的属性,无法直接使用，所以省略)

以上是在XML中直接定义，下面是我在代码里直接定义的：

[java]  view plain copy

1. mProgressBar.setIndeterminateDrawable(AppConfig.getResources().getDrawable(R.drawable.style_common_processbar));  

style_common_processbar.xml还是需要定义在xml里的

[html]  view plain copy

1. <?xml version="1.0" encoding="UTF-8"?>  
2. <animated-rotate   
3.     android:drawable="@drawable/icon"  
4.     android:pivotX="50.0%"   
5.     android:pivotY="50.0%"   
6.     xmlns:android="http://schemas.android.com/apk/res/android">      
7. </animated-rotate>  

结果是就是用图片icon旋转来表示进度，图片制作参考 android的 drawable_hdpi 下的 spinner_black_48.png

1.2 定制颜色和形状

利用shape来定制颜色和形状

[java]  view plain copy

1. // 定制模式  
2. mProgressBar.setIndeterminateDrawable(AppConfig.getResources().getDrawable(R.drawable.style_common_processbar));  

style_common_processbar.xml

[html]  view plain copy

1. <?xml version="1.0" encoding="UTF-8"?>  
2. <rotate   
3.     xmlns:android="http://schemas.android.com/apk/res/android"  
4.     android:duration="30"   
5.     android:fromDegrees="0.0"   
6.     android:toDegrees="360.0"   
7.     android:pivotX="50.0%"   
8.     android:pivotY="50.0%"   
9.     android:repeatCount="infinite">  
10.     <shape   
11.         android:shape="ring"   
12.         android:innerRadiusRatio="3.2"   
13.         android:thicknessRatio="5.333"   
14.         android:useLevel="false">  
15.         <size   
16.             android:height="16.0dip"   
17.             android:width="16.0dip" />  
18.         <gradient   
19.             android:startColor="#4cffffff"   
20.             android:endColor="#ffff0000"   
21.             android:useLevel="false"   
22.             android:type="sweep"   
23.             android:centerY="0.5"   
24.             android:centerColor="#4cffffff" />  
25.     </shape>  
26. </rotate>  

通过修改
android:shape=["rectangle" | "oval" | "line" | "ring"] 来修改形状
gradient来修改颜色属性 

2.progress mode | 有百分比进度的进度条

代码调用：

mProgressBar.setProgressDrawable(AppConfig.getResources().getDrawable(R.drawable.color));

color.xml

[html]  view plain copy

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/background" android:drawable="@drawable/bg" />  
4.         <item android:id="@android:id/secondaryProgress" android:drawable="@drawable/secondary" />  
5.         <item android:id="@android:id/progress" android:drawable="@drawable/progress" />  
6. </layer-list>  

http://blog.csdn.net/xpwang168/article/details/6678465