Android 自定義橫向進度條(可動態設定最大值)
阿新 • • 發佈:2018-12-16
自定義橫向進度條
主佈局檔案中包 含
<LinearLayout android:id="@+id/linearlayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/color_white_real" android:orientation="vertical" android:paddingBottom="@dimen/x5" android:paddingLeft="@dimen/x15" android:paddingTop="@dimen/y15"></LinearLayout>
進度條佈局:
<?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="wrap_content" android:layout_marginBottom="@dimen/x10" android:gravity="center_vertical" android:orientation="horizontal"> <LinearLayout android:id="@+id/lin_coma" android:layout_width="@dimen/x75" android:layout_height="wrap_content" android:orientation="horizontal"> <TextView android:id="@+id/name" android:layout_width="wrap_content" android:layout_height="match_parent" android:maxEms="5" android:singleLine="true" android:ellipsize="end" android:text="哈/哈/哈啊啊啊啊啊" android:textColor="#ff969696" android:textSize="12sp" /> </LinearLayout> <LinearLayout android:id="@+id/bar_container" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:layout_marginRight="@dimen/x10" android:gravity="left|center_vertical" android:orientation="horizontal"> <TextView android:id="@+id/bar" android:layout_width="wrap_content" android:layout_height="@dimen/y12" android:background="#0CD3F4" /> <TextView android:id="@+id/percent" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="0.00%" android:layout_marginLeft="@dimen/x10" android:layout_marginRight="@dimen/x10" android:textColor="@color/color_light_bule" android:textSize="12sp" /> </LinearLayout> </LinearLayout>
通過往linnarlayout中迴圈添加布局實現進度條
//獲取data集合中包含的進圖條資料,迴圈新增到一個新的double集合中, private void showColumnar(List<SuccessCaseMyMainlistBean.DataBean> data) { doubles = new ArrayList<>(); for (int i = 0; i < data.size(); i++) { int progress = data.get(i).getArticleNumber(); doubles.add(progress); } //切記在每次開始載入時清空linearlayout的UI linearlayout.removeAllViews(); //賦值 for (int i = 0; i < data.size(); i++) { //隨機產生一個進度 // final double ranNum = Math.random() * 100; int ranNum = data.get(i).getArticleNumber(); if (ranNum <= 0) { ranNum = 0; } //設定最大值 final int finalMaxScale = Collections.max(doubles); item = LayoutInflater.from(context).inflate(R.layout.success_columnar_item, linearlayout, false); LinearLayout lincoma = item.findViewById(R.id.lin_coma); TextView name = item.findViewById(R.id.name); TextView percent = item.findViewById(R.id.percent); final View bar = item.findViewById(R.id.bar); LinearLayout container = item.findViewById(R.id.bar_container); name.setText(data.get(i).getJobTitle()); bar.setBackgroundResource(R.mipmap.line_porgess); percent.setText(NumberUtil.formatString(new BigDecimal(ranNum))); final double finalRanNum = ranNum; //計算出進度條應該顯示的寬度 final LinearLayout.LayoutParams lp = (LinearLayout.LayoutParams) bar.getLayoutParams(); // lp.width = (int) ((width - width / 3) * finalRanNum / finalMaxScale); //用你的螢幕寬度-你的佈局中除進度條外其他佈局的寬度*進度/最大值 //其中PxUtils是把dp轉換為px,確保在不同螢幕下的適配 lp.width = (int) ((this.width - PxUtils.dpToPx(170, context)) * finalRanNum / finalMaxScale); //設定動畫,1.5秒內從0.0寬度變成1.0寬度(1.0代表100%) final ObjectAnimator anim = ObjectAnimator.ofFloat(bar, "alpha", 0.0F, 1.0F).setDuration(500); //動畫監聽 anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator valueAnimator) { //事實計算寬度,應該顯示的寬度乘以當前進度,再事實設定給bar bar.setLayoutParams(lp); } }); //動畫開始 anim.start(); //設定/隔斷並新增隔斷到linearlayout TextView textView = new TextView(context); textView.setHeight(PxUtils.dpToPx(10, context)); linearlayout.addView(textView); //新增item到新增隔斷到linearlayout linearlayout.addView(item); } }