三种ProgressBar的使用

作者: dayang | 来源:发表于2016-12-08 22:55 被阅读13849次
    一、普通的ProgressBar
    效果图
    普通ProgressBar.png
    xml
    <ProgressBar
            android:id="@+id/pbNormal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            />
    
    二、有进度的ProgressBar
    效果图
    有进度的ProgressBar.png
    xml:设置style,Horizontal
    <ProgressBar
           android:id="@+id/progress"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           style="@style/Widget.AppCompat.ProgressBar.Horizontal"
           />
    
    设置进度java文件
            final ProgressBar  bar= (ProgressBar) findViewById(R.id.progress);
            final TextView textView= (TextView) findViewById(R.id.tvProgress);
            new Thread(){
                @Override
                public void run() {
                    int i=0;
                    while(i<100){
                        i++;
                        try {
                            Thread.sleep(80);
                        } catch (InterruptedException e) {
                            e.printStackTrace();
                        }
                        final int j=i;
                        bar.setProgress(i);
                        runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                textView.setText(j+"%");
                            }
                        });
                    }
                }
            }.start();
    
    三、自定义有进度ProgressBar
    效果图
    自定义进度有ProgressBar.png
    progressBar进度条有两个部分组成,背景图形加载进度图形,使用<layer-list>标签,分别用backgroundprogress作为两个部分的id值,背景图形使用<shape>加载进度图形还需要用<clip>标签对图形<shape>标签进行包裹;
    res下的drawable文件夹下,创建样式
    custom_progress.xml
    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:id="@android:id/background">
            <shape android:shape="rectangle">
            <corners android:radius="5dp"/>
            <gradient android:startColor="#fff"
                      android:endColor="#fff"/>
            </shape>
        </item>
        <item android:id="@android:id/progress">
            <clip><!--可裁剪对象-->
                <shape android:shape="rectangle">
                <corners android:radius="5dp"/>
                <gradient android:angle="45" 
                          android:startColor="#f00"
                          android:endColor="#f90"/>
                </shape>
            </clip>
        </item>
    </layer-list>
    
    布局xml,需要指定ProgressBar的style
        <ProgressBar
            android:id="@+id/progressSelf"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            style="@style/Widget.AppCompat.ProgressBar.Horizontal"
            android:progressDrawable="@drawable/custom_progress"
            />
        <TextView
            android:id="@+id/tvProgress"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    
    设置进度java文件
            final ProgressBar bar = (ProgressBar) findViewById(R.id.progressSelf);
            final TextView textView= (TextView) findViewById(R.id.tvProgress);
            new Thread(){
                @Override
                public void run() {
                    int i=0;
                    while(i<100){
                        i++;
                        try {
                            Thread.sleep(80);
                        } catch (InterruptedException e) {
                            e.printStackTrace();
                        }
                        final int j=i;
                        bar.setProgress(i);
                        runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                textView.setText(j+"%");
                            }
                        });
                    }
                }
            }.start();
    

    相关文章

      网友评论

        本文标题:三种ProgressBar的使用

        本文链接:https://www.haomeiwen.com/subject/swskmttx.html