效果图:
思路:
用两个控件组成TextView和ProgressBar,说到这你就有点眉目了吧,那如何让数字跟随这ProgressBar进度一起动呢,主要是不断改变TextView距离左边的间距
案例代码:
布局文件:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/tv_move"
android:textSize="20sp"
android:layout_marginTop="30dp"
android:layout_centerHorizontal="true"
android:text="开始"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<LinearLayout
android:id="@+id/full"
android:layout_centerInParent="true"
android:orientation="vertical"
android:layout_width="330dp"
android:layout_height="60dp">
<TextView
android:id="@+id/progesss_value1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingBottom="8dp"
android:paddingLeft="4dp"
android:paddingRight="4dp"
android:paddingTop="2dp"
android:textColor="#ff0000"
android:textSize="12sp"
android:text="0%" />
<FrameLayout
android:layout_width="330dp"
android:layout_height="30dp">
<ProgressBar
android:layout_gravity="center"
android:id="@+id/progesss1"
style="@style/Widget.AppCompat.ProgressBar.Horizontal"
android:layout_width="330dp"
android:layout_height="wrap_content"
android:background="@drawable/myprogressbar"
android:indeterminateDrawable="@android:drawable/progress_indeterminate_horizontal"
android:indeterminateOnly="false"
android:max="100"
android:maxHeight="50dp"
android:minHeight="16dp"
android:progress="0"
android:progressDrawable="@drawable/myprogressbar"
/>
<ImageView
android:id="@+id/iv_cicle"
android:layout_width="24dp"
android:layout_height="24dp"
android:src="@mipmap/red_cicle"
android:layout_gravity="center_vertical"
android:visibility="gone"/>
</FrameLayout>
</LinearLayout>
</RelativeLayout>
Activity代码:
/**
* 设置进度显示在对应的位置
*/
public void setPos() {
int w = progesss.getWidth();
Log.e("w=====", "" + w);
ViewGroup.MarginLayoutParams params = (ViewGroup.MarginLayoutParams) progesssValue.getLayoutParams();
ViewGroup.MarginLayoutParams paramsImage = (ViewGroup.MarginLayoutParams) iv_cicle.getLayoutParams();
int pro = progesss.getProgress();
int tW = progesssValue.getWidth();
if (w * pro / 100 + tW * 0.3 > w) {
params.leftMargin = (int) (w - tW * 1.1);
paramsImage.leftMargin = (int) (w - tW * 1.1)+5;
} else if (w * pro / 100 < tW * 0.7) {
params.leftMargin = 0;
paramsImage.leftMargin = 0;
} else {
params.leftMargin = (int) (w * pro / 100 - tW * 0.7);
paramsImage.leftMargin = (int) (w * pro / 100 - tW * 0.7)+5;
}
if (pro == 100){
paramsImage.leftMargin = w- iv_cicle.getWidth()+5;
params.leftMargin = w- iv_cicle.getWidth()-40;
}
progesssValue.setText(pro+"%");
progesssValue.setLayoutParams(params);
iv_cicle.setLayoutParams(paramsImage);
}
findViewById(R.id.tv_move).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
progress = 0;
progesss.setProgress(progress);
setPos();
handler.removeMessages(WHAT_INCREASE);
handler.sendEmptyMessage(WHAT_INCREASE);
}
});
需要demo源码的请评论,点赞。谢谢大家