UI组件-ProgressBar及其子类

小鱼儿 2021-04-24 05:40 427阅读 0赞

## 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 #####

##### 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;
        }
    }

#### 效果 ####

![img\_c5503892dcf91af80da2966cf157ef5f.png][img_c5503892dcf91af80da2966cf157ef5f.png]

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) {
    
                }
            });
        }
    
    }

#### 效果 ####

![img\_2d869092356c499c2a30c23163f08745.png][img_2d869092356c499c2a30c23163f08745.png]

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));
                }
            });
        }
    }

#### 效果 ####

![img\_a8062cd1b34a8af30c43b684226bd624.png][img_a8062cd1b34a8af30c43b684226bd624.png]

Screenshot\_20171020-133417.png

#### 提示 ####

###### android:isIndicator属性，设置该星级评分条是否允许用户改变。 ######

###### android:numStars属性，设置该星级评分条总共有多少星级。 ######

###### android:rating属性，设置该星级评分条默认的星级。 ######

###### android:stepSize属性，设置每次最少需要改变多少个星级。 ######

--------------------

[img_c5503892dcf91af80da2966cf157ef5f.png]: /images/20210424/1619242848307.png
[img_2d869092356c499c2a30c23163f08745.png]: /images/20210424/1619242835268.png
[img_a8062cd1b34a8af30c43b684226bd624.png]: /images/20210424/1619242821705.png