UI组件-ProgressBar及其子类
前言
余生希望你和让你快乐的那个人度过。
ProgressBar组件
进度条也是UI界面中一种常用的组件，Android支持多种风格的进度条，通过style属性可以为ProgressBar指定风格。该属性支持如下几个属性值。
@android:style/Widget.ProgressBar.Horizontal:水平进度条
"@android:style/Widget.ProgressBar.Inverse:普通大小的环形进度条
"@android:style/Widget.ProgressBar.Large:大环形进度条
"@android:style/Widget.ProgressBar.Large.Inverse:大环形进度条
"@android:style/Widget.ProgressBar.Small:小环形进度条
"@android:style/Widget.ProgressBar.Small.Inverse:小环形进度条
代码示例
progress.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<!-- 定义一个大环形进度条 -->
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@android:style/Widget.ProgressBar.Large"
/>
<!-- 定义一个中等大小的环形进度条 -->
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<!-- 定义一个小环形进度条 -->
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@android:style/Widget.ProgressBar.Small"
/>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="任务完成的进度"
/>
<!-- 定义一个水平进度条 -->
<ProgressBar
android:id="@+id/bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="100"
style="@android:style/Widget.ProgressBar.Horizontal"
/>
</LinearLayout>
MainActivity.java
public class MainActivity extends Activity {
//该程序模拟填充长度为100的数组
private int[] data = new int[100];
int hashData = 0;
//记录ProgressBar的完成进度
int status = 0;
ProgressBar bar;
//创建一个负责更新进度的Handler
Handler mHandler = new Handler()
{
@Override
public void handleMessage(Message msg) {
//表明消息是由该程序发送的
if(msg.what == 1)
{
bar.setProgress(status);
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.progressbar);
bar = (ProgressBar) findViewById(R.id.bar);
//启动线程来执行任务
new Thread()
{
public void run()
{
while(status < 100)
{
//获取耗时操作的完成百分比
status = doWork();
//发送消息
mHandler.sendEmptyMessage(1);
}
}
}.start();
}
public int doWork() {
//为数组赋值
data[hashData++] = (int) (Math.random() * 100);
try {
Thread.sleep(1000);
}catch (InterruptedException e) {
e.printStackTrace();
}
return hashData;
}
}
效果
Screenshot_20171020-125343.png
提示
android:max属性，设置该进度条的最大值。
android:progress属性，设置该进度条的已完成进度值。
SeekBar组件
拖动条和进度条非常相似，只是进度条采用颜色填充来表明进度完成的程度，而拖动条则通过滑块的位置来标识数值。可以用来调节音量等等。
代码示例
seekbar.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="240dp"
android:src="@drawable/kaola"
/>
<!-- 定义一个拖动条，并改变它的滑块外观 -->
<SeekBar
android:id="@+id/seekbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="255"
android:progress="255"
/>
</LinearLayout>
MainActivity.java
public class MainActivity extends Activity {
ImageView image;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.seekbar);
image = (ImageView) findViewById(R.id.image);
SeekBar seekBar = (SeekBar) findViewById(R.id.seekbar);
seekBar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {
//当拖动条的滑块位置发送改变时触发该方法
@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
//动态改变图片透明度
image.setImageAlpha(progress);
}
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
}
});
}
}
效果
Screenshot_20171020-131641.png
RatingBar组件
星级评分条(RatingBar)与拖动条(SeekBar)的用法、功能十分相似，最大的区别在于RatingBar通过星星来表示进度。
代码示例
ratingbar.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="240dp"
android:src="@drawable/kaola"
/>
<!-- 定义一个拖动条，并改变它的滑块外观 -->
<RatingBar
android:id="@+id/ratingbar"
android:layout_gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:numStars="5"
android:max="255"
android:progress="255"
android:stepSize="0.5"
/>
</LinearLayout>
MainActivity.java
public class MainActivity extends Activity {
ImageView image;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.ratingbar);
image = (ImageView) findViewById(R.id.image);
RatingBar ratingbar = (RatingBar) findViewById(R.id.ratingbar);
ratingbar.setOnRatingBarChangeListener(new OnRatingBarChangeListener() {
@Override
public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
//动态改变图片透明度
//5颗星星就代表最大值255
image.setImageAlpha((int) (rating * 255 / 5));
}
});
}
}
效果
Screenshot_20171020-133417.png
