Android中得TextView跟隨ProgressBar顯示

效果如圖：

 

1.樣式：progressbar_color.xml

<?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
 <!-- 背景 gradient是漸變,corners定義的是圓角 -->
 <item android:id="@android:id/background">
  <shape>
   <corners android:radius="5dp" />
   <solid android:color="#9a9a9a" />
  </shape>
 </item>
 <!-- 進度條 -->
 <item android:id="@android:id/progress">
  <clip>
   <shape>
    <corners android:radius="5dp" />
    <solid android:color="#E14f50" />
   </shape>
  </clip>
 </item>
 </layer-list>

2.Activity的佈局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/activity_main"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 android:layout_margin="5dp">
 <TextView
      android:layout_marginTop="50dp"
      android:id="@+id/progress_precent"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="0%"
      android:textColor="#ff00"
      android:textSize="12sp"
      android:padding="3dp"/>
 <ProgressBar
      android:id="@+id/pb_progressbar"
      style="?android:attr/progressBarStyleHorizontal"
      android:layout_width="match_parent"
      android:layout_height="5dp"
      android:max="100"
      android:progress="0"
      android:progressDrawable="@drawable/progressbar_color" />
 <Button
      android:id="@+id/btn_start"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="30dp"
      android:text="start" />
</LinearLayout>

3.Activity代碼

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewTreeObserver;
import android.widget.Button;
import android.widget.ProgressBar;
import android.widget.TextView;


public class MainActivity extends Activity {
    //控件聲明
    TextView tvPrecent;
    ProgressBar pbProgressbar;
    Button btnStart;
    //要展示的進度，最多爲100，可自行調整
    private int status = 73;
    //當前進度
    private int currentStatue;
    //當前位置
    private float currentPosition;
    //得到屏幕的總寬度
    private int width;
    private float scrollDistance;
    //文本的寬度
    private int tvWidth;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //1.初始化控件
        tvPrecent = (TextView) findViewById(R.id.progress_precent);
        pbProgressbar = (ProgressBar) findViewById(R.id.pb_progressbar);
        btnStart = (Button) findViewById(R.id.btn_start);

        //2.得到progressBar控件的寬度
        ViewTreeObserver vto2 = pbProgressbar.getViewTreeObserver();
        vto2.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                pbProgressbar.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                width = pbProgressbar.getWidth();
            }
        });

        //3.初始化監聽
        initListener();

    }

    /**
     * 開始按鈕的點擊事件
     */
    private void initListener() {
        //1.
        btnStart.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                currentStatue = 0;
                currentPosition = 0;
                pbProgressbar.setProgress(0);
                //效果的實現
                initAchieve();
            }
        });
    }


    /**
     *監聽頁面ProgressBar
     */
    private void initAchieve() {
        //開啓分線程
        new Thread(new Runnable() {
            @Override
            public void run() {
                //每一段要移動的距離
                scrollDistance = (float) ((1.0 / pbProgressbar.getMax()) * width);
                for (int i = 0; i < status; i++) {
                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            // 控制進度條的增長進度
                            pbProgressbar.incrementProgressBy(1);
                            currentStatue++;
                            tvPrecent.setText(currentStatue + "%");
                            // 得到字體的寬度
                            tvWidth = tvPrecent.getWidth();
                            currentPosition += scrollDistance;
                            //做一個平移動畫的效果
                            if (tvWidth + currentPosition <= width - tvPrecent.getPaddingRight()) {
                                tvPrecent.setTranslationX(currentPosition);
                            }
                        }
                    });
                    try {
                        Thread.sleep(80);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                }
            }
        }).start();
    }
}