安卓自定義流程進(jìn)度圖控件實(shí)例代碼
更新時(shí)間：2017年06月19日 09:07:35 作者：Zhuzzzzzzx
本篇文章主要介紹了安卓自定義流程進(jìn)度圖控件實(shí)例代碼，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
先上效果圖：
如圖，可實(shí)現(xiàn)設(shè)置：總流程數(shù)、已完進(jìn)度程數(shù)、已完成顏色，各個(gè)標(biāo)題
使用方法
1.導(dǎo)入compile 'com.github.pavlospt:circleview:1.3'依賴包（因?yàn)橛玫搅薈ircleView）
2.直接把下面兩個(gè)文件一個(gè)java一個(gè)xml，復(fù)制粘貼進(jìn)項(xiàng)目（代碼放在了文章最后，暫時(shí)還沒弄成開源庫，有時(shí)間直接做成依賴包倒進(jìn)去）
在xml中寫入ProcessImg控件
在java文件中實(shí)例化ProcessImg對(duì)象
根據(jù)需要調(diào)用幾個(gè)方法
1.對(duì)象.setColor( int color )
設(shè)置已完成的進(jìn)度的顏色，傳入顏色的整型值
2.對(duì)象.setProcess( int total , int process )
設(shè)置總流程數(shù)和已完成進(jìn)度數(shù)，第一個(gè)參數(shù)為總流程數(shù)（1~6，因?yàn)槌^6個(gè)堆在一排很難看），第二個(gè)為已完成數(shù)，均為整型變量
3.對(duì)象.setTitle( int position , String text )
設(shè)置各流程的標(biāo)題，第一個(gè)參數(shù)為標(biāo)題對(duì)應(yīng)的流程數(shù)（1~total），第二個(gè)參數(shù)為String格式標(biāo)題文本
源碼
源碼很簡(jiǎn)單，注釋也比較清楚，應(yīng)該能看懂
process_img.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/processImg_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:baselineAligned="false"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="20dp">
<LinearLayout
android:id="@+id/process1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:visibility="gone">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<View
android:id="@+id/view1l"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
<com.github.pavlospt.CircleView
android:id="@+id/circle1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
app:cv_backgroundColorValue="#00000000"
app:cv_fillColor="#00000000"
app:cv_strokeColorValue="#00000000"
app:cv_subtitleText=""
app:cv_titleColor="#fff"
app:cv_titleSize="20sp"
app:cv_titleText="1"/>
<View
android:id="@+id/view1r"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
</LinearLayout>
<TextView
android:id="@+id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="text1"
android:textColor="#00000000"/>
</LinearLayout>
<LinearLayout
android:id="@+id/process2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:visibility="gone">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<View
android:id="@+id/view2l"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
<com.github.pavlospt.CircleView
android:id="@+id/circle2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
app:cv_backgroundColorValue="#00000000"
app:cv_fillColor="#00000000"
app:cv_strokeColorValue="#00000000"
app:cv_subtitleText=""
app:cv_titleColor="#fff"
app:cv_titleSize="20sp"
app:cv_titleText="2"/>
<View
android:id="@+id/view2r"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
</LinearLayout>
<TextView
android:id="@+id/text2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="text2"
android:textColor="#00000000"/>
</LinearLayout>
<LinearLayout
android:id="@+id/process3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:visibility="gone">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<View
android:id="@+id/view3l"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
<com.github.pavlospt.CircleView
android:id="@+id/circle3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
app:cv_backgroundColorValue="#00000000"
app:cv_fillColor="#00000000"
app:cv_strokeColorValue="#00000000"
app:cv_subtitleText=""
app:cv_titleColor="#fff"
app:cv_titleSize="20sp"
app:cv_titleText="3"/>
<View
android:id="@+id/view3r"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
</LinearLayout>
<TextView
android:id="@+id/text3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="text3"
android:textColor="#00000000"/>
</LinearLayout>
<LinearLayout
android:id="@+id/process4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:visibility="gone">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<View
android:id="@+id/view4l"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
<com.github.pavlospt.CircleView
android:id="@+id/circle4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
app:cv_backgroundColorValue="#00000000"
app:cv_fillColor="#00000000"
app:cv_strokeColorValue="#00000000"
app:cv_subtitleText=""
app:cv_titleColor="#fff"
app:cv_titleSize="20sp"
app:cv_titleText="4"/>
<View
android:id="@+id/view4r"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
</LinearLayout>
<TextView
android:id="@+id/text4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="text4"
android:textColor="#00000000"/>
</LinearLayout>
<LinearLayout
android:id="@+id/process5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:visibility="gone">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<View
android:id="@+id/view5l"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
<com.github.pavlospt.CircleView
android:id="@+id/circle5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
app:cv_backgroundColorValue="#00000000"
app:cv_fillColor="#00000000"
app:cv_strokeColorValue="#00000000"
app:cv_subtitleText=""
app:cv_titleColor="#fff"
app:cv_titleSize="20sp"
app:cv_titleText="5"/>
<View
android:id="@+id/view5r"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
</LinearLayout>
<TextView
android:id="@+id/text5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="text5"
android:textColor="#00000000"/>
</LinearLayout>
<LinearLayout
android:id="@+id/process6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:visibility="gone">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<View
android:id="@+id/view6l"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
<com.github.pavlospt.CircleView
android:id="@+id/circle6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
app:cv_backgroundColorValue="#00000000"
app:cv_fillColor="#00000000"
app:cv_strokeColorValue="#00000000"
app:cv_subtitleText=""
app:cv_titleColor="#fff"
app:cv_titleSize="20sp"
app:cv_titleText="6"/>
<View
android:id="@+id/view6r"
android:layout_width="0dp"
android:layout_height="5dp"
android:layout_weight="2"
android:background="#00000000"/>
</LinearLayout>
<TextView
android:id="@+id/text6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="text6"
android:textColor="#00000000"/>
</LinearLayout>
</LinearLayout>
ProcessImg.java
import android.content.Context;
import android.graphics.Color;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;
import com.github.pavlospt.CircleView;
import com.zxzhu.processtest.R;
import java.util.ArrayList;
import java.util.List;
/**
* Created by zxzhu on 2017/6/18.
*/
public class ProcessImg extends LinearLayout {
private String TAG = "ProcessImg";
private CircleView circleView1, circleView2, circleView3, circleView4, circleView5, circleView6;
private TextView textView1, textView2, textView3, textView4, textView5, textView6;
//view代表流程連接線
private View view1l, view1r, view2l, view2r, view3l, view3r, view4l, view4r, view5l, view5r, view6l, view6r;
private LinearLayout process1, process2, process3, process4, process5, process6;
private List<LinearLayout> layouts = new ArrayList<>();//用于控制流程個(gè)數(shù)的列表
private List<View> views = new ArrayList<>();
private List<TextView> texts = new ArrayList<>();
private List<CircleView> circleViews = new ArrayList<>();
private Context context;
private int color = Color.parseColor("#E0E0E0");
private int total = 0, process = 0;
public ProcessImg(Context context) {
super(context);
this.context = context;
initViews();
}
public ProcessImg(Context context, AttributeSet attributeSet) {
super(context, attributeSet);
this.context = context;
initViews();
}
private void initViews() {
LayoutInflater.from(context).inflate(R.layout.process_img, this);
circleView1 = (CircleView) findViewById(R.id.circle1);
circleView2 = (CircleView) findViewById(R.id.circle2);
circleView3 = (CircleView) findViewById(R.id.circle3);
circleView4 = (CircleView) findViewById(R.id.circle4);
circleView5 = (CircleView) findViewById(R.id.circle5);
circleView6 = (CircleView) findViewById(R.id.circle6);
process1 = (LinearLayout) findViewById(R.id.process1);
process2 = (LinearLayout) findViewById(R.id.process2);
process3 = (LinearLayout) findViewById(R.id.process3);
process4 = (LinearLayout) findViewById(R.id.process4);
process5 = (LinearLayout) findViewById(R.id.process5);
process6 = (LinearLayout) findViewById(R.id.process6);
textView1 = (TextView) findViewById(R.id.text1);
textView2 = (TextView) findViewById(R.id.text2);
textView3 = (TextView) findViewById(R.id.text3);
textView4 = (TextView) findViewById(R.id.text4);
textView5 = (TextView) findViewById(R.id.text5);
textView6 = (TextView) findViewById(R.id.text6);
view1l = findViewById(R.id.view1l);
view1r = findViewById(R.id.view1r);
view2l = findViewById(R.id.view2l);
view2r = findViewById(R.id.view2r);
view3l = findViewById(R.id.view3l);
view3r = findViewById(R.id.view3r);
view4l = findViewById(R.id.view4l);
view4r = findViewById(R.id.view4r);
view5l = findViewById(R.id.view5l);
view5r = findViewById(R.id.view5r);
view6l = findViewById(R.id.view6l);
view6r = findViewById(R.id.view6r);
circleViews.add(circleView1);
circleViews.add(circleView2);
circleViews.add(circleView3);
circleViews.add(circleView4);
circleViews.add(circleView5);
circleViews.add(circleView6);
layouts.add(process1);
layouts.add(process2);
layouts.add(process3);
layouts.add(process4);
layouts.add(process5);
layouts.add(process6);
texts.add(textView1);
texts.add(textView2);
texts.add(textView3);
texts.add(textView4);
texts.add(textView5);
texts.add(textView6);
views.add(view1l);
views.add(view1r);
views.add(view2l);
views.add(view2r);
views.add(view3l);
views.add(view3r);
views.add(view4l);
views.add(view4r);
views.add(view5l);
views.add(view5r);
views.add(view6l);
views.add(view6r);
}
/**
* 設(shè)置已完成流程顏色
*
* @param color
*/
public void setColor(int color) {
this.color = color；
setProcess(total, process);
}
/**
* 設(shè)置進(jìn)度
*
* @param total 總共流程個(gè)數(shù)(不超過6)
* @param process 當(dāng)前進(jìn)度
*/
public void setProcess(int total, int process) {
this.total = total;
this.process = process;
//使流程總數(shù)的view顯示出來
for (int i = 0; i < total; i++) {
layouts.get(i).setVisibility(VISIBLE);
}
// 設(shè)置已完成進(jìn)度的顏色
for (int i = 0; i < circleViews.size(); i++) {
if (i < process) {
circleViews.get(i).setFillColor(color);
circleViews.get(i).setBackgroundColor(color);
circleViews.get(i).setStrokeColor(color);
texts.get(i).setTextColor(color);
} else {
//未完成設(shè)置為灰色
circleViews.get(i).setFillColor(Color.parseColor("#CCCCCC"));
circleViews.get(i).setBackgroundColor(Color.parseColor("#CCCCCC"));
texts.get(i).setTextColor(Color.parseColor("#CCCCCC"));
circleViews.get(i).setStrokeColor(color);
circleViews.get(i).setStrokeColor(Color.parseColor("#CCCCCC"));
}
}
//設(shè)置流程連接線的顏色
for (int i = 0; i < views.size(); i++) {
if (i < process * 2) {
views.get(i).setBackgroundColor(color);
} else {
views.get(i).setBackgroundColor(Color.parseColor("#CCCCCC"));
}
}
views.get(0).setBackgroundColor(Color.parseColor("#00000000"));
if (total != 0) {
views.get(2 * total - 1).setBackgroundColor(Color.parseColor("#00000000"));
}
}
/**
* 設(shè)置各進(jìn)度標(biāo)題
*
* @param position
* @param text
*/
public void setTitle(int position, String text) {
texts.get(position - 1).setText(text);
}
}
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
微信在前段時(shí)間的更新中也實(shí)現(xiàn)了暗黑模式,而蘋果系統(tǒng)也早就支持暗黑模式,Android也一樣可以實(shí)現(xiàn),下面這篇文章主要給大家介紹了關(guān)于Android如何快速適配暗黑模式的相關(guān)資料,需要的朋友可以參考下2021-08-08
android studio編譯jar包或者aar包的方法教程詳解
這篇文章主要介紹了android studio編譯jar包或者aar包的方法教程，本文通過圖文并茂的形式給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03
Android ProgressBar 模擬進(jìn)度條效果的實(shí)現(xiàn)
這篇文章主要介紹了Android ProgressBar 模擬進(jìn)度條效果的實(shí)現(xiàn),本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-04-04
android自定義開關(guān)控件-SlideSwitch的實(shí)例
本篇文章主要介紹了android自定義開關(guān)控件-SlideSwitch的實(shí)例，實(shí)現(xiàn)了手機(jī)控件開關(guān)的功能，感興趣的小伙伴們可以參考一下。2016-11-11
Android實(shí)現(xiàn)一個(gè)絲滑的自動(dòng)輪播控件實(shí)例代碼
輪播圖對(duì)大家來說應(yīng)該再熟悉不過了，下面這篇文章主要給大家介紹了關(guān)于Android實(shí)現(xiàn)一個(gè)絲滑的自動(dòng)輪播控件的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-08-08
關(guān)于Android?Webview?設(shè)置Cookie問題詳解
大家好，本篇文章是關(guān)于Android?Webview?設(shè)置Cookie問題詳解，感興趣的同學(xué)可以看看，希望對(duì)你起到幫助，有用的話記得收藏，方便下次瀏覽2021-11-11
下面小編就為大家分享一篇Android 不解壓直接讀取zip包的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-01-01
android apk反編譯到j(luò)ava源碼的實(shí)現(xiàn)方法
Android由于其代碼是放在dalvik虛擬機(jī)上的托管代碼，所以能夠很容易的將其反編譯為我們可以識(shí)別的代碼,本文將詳細(xì)介紹，需要的朋友可以參考下2012-12-12
Android開發(fā)懸浮按鈕 Floating ActionButton的實(shí)現(xiàn)方法
這篇文章主要介紹了Android開發(fā)懸浮按鈕 Floating ActionButton的實(shí)現(xiàn)方法，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-09-09
Android實(shí)現(xiàn)excel/pdf/word/odt/圖片相互轉(zhuǎn)換
這篇文章主要為大家詳細(xì)介紹了Android如何實(shí)現(xiàn)excel/pdf/word/odt/圖片之間的相互轉(zhuǎn)換，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以了解一下2023-04-04