最近遇到一个项目需要实现如下图这种流程
看了网上很多都是要自定义时间轴配合ListView来实现，但是本项目的流程又区别于淘宝物流的跟踪图，所以自己写了一个流程图，代码如下：
item的布局 view_process_item.xml：
<?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="match_parent"
android:background="@color/col_ffffff"
android:orientation="vertical"
xmlns:tools="http://schemas.android.com/tools">
<LinearLayout
android:id="@+id/ll_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="120dp"
android:layout_height="40dp"
android:layout_gravity="center_vertical">
<TextView
android:id="@+id/tv_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:textSize="@dimen/text_12sp"
android:textColor="@color/col_3f6db7"
tools:text="撰写审计日志"/>
<TextView
android:id="@+id/tv_date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/tv_title"
android:paddingLeft="5dp"
android:textSize="@dimen/text_12sp"
android:textColor="@color/col_3f6db7"
tools:text="2018-12-10 10：50"/>
</RelativeLayout>
<LinearLayout
android:id="@+id/ll_line"
android:layout_width="14dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center_horizontal">
<TextView
android:id="@+id/line_before"
android:layout_width="1dp"
android:layout_height="40dp"
android:background="@color/col_3f6db7"
android:gravity="center_horizontal"/>
<TextView
android:layout_width="14dp"
android:layout_height="14dp"
android:background="@drawable/shape_circle_process"/>
<TextView
android:id="@+id/line_after"
android:layout_width="1dp"
android:layout_height="40dp"
android:background="@color/col_3f6db7"
android:gravity="center_horizontal"/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:minHeight="40dp"
android:padding="2dp"
android:layout_gravity="center"
android:gravity="center_vertical"
android:background="@drawable/shap_tangle_bg">
<TextView
android:id="@+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="@dimen/text_15sp"
tools:text="张三"/>
<TextView
android:id="@+id/tv_advice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/tv_name"
android:layout_marginLeft="10dp"
android:textSize="@dimen/text_15sp"
tools:text="同意"/>
<TextView
android:id="@+id/tv_result"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/tv_name"
android:textSize="@dimen/text_15sp"
tools:text="审核同意地方撒还记得哈返回撒到了范德萨看了凤凰读书了发大水范德萨范德萨发生"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>自定义的drawable:
1.进度节点圆圈 shape_circle_process.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
<corners android:radius="7dp"/>
<solid android:color="@color/col_3f6db7"/>
</shape>2.审批内容背景 shape_tangle_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<stroke android:color="@color/col_636363" android:width="1px"/>
<solid android:color="@color/col_f0f0f0"/>
</shape>Activity中的布局：
<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@color/col_ffffff"
tools:context=".business.table.tack.ProcessTakeTableActivity">
<ScrollView
android:id="@+id/scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:id="@+id/rlt_begin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="110dp"
android:layout_marginTop="20dp"
android:gravity="center_vertical"
android:visibility="gone">
<ImageView
android:id="@+id/iv_begin"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@drawable/icon_process_time"/>
<TextView
android:id="@+id/tv_begin"
android:layout_width="wrap_content"
android:layout_height="35dp"
android:layout_marginLeft="10dp"
android:layout_toRightOf="@id/iv_begin"
android:gravity="center_vertical"
android:minHeight="20dp"
android:textColor="@color/col_3f6db7"
android:textSize="@dimen/text_18sp"
android:text="流程开始"/>
</RelativeLayout>
<LinearLayout
android:id="@+id/ll_process_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"/>
<RelativeLayout
android:id="@+id/rlt_end"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="110dp"
android:layout_marginBottom="20dp"
android:visibility="gone">
<ImageView
android:id="@+id/iv_end"
android:layout_width="35dp"
android:layout_height="35dp"
android:src="@drawable/icon_process_time"/>
<TextView
android:id="@+id/tv_end"
android:layout_width="wrap_content"
android:layout_height="35dp"
android:layout_marginLeft="10dp"
android:layout_toRightOf="@id/iv_end"
android:gravity="center_vertical"
android:minHeight="20dp"
android:layout_alignBaseline="@id/iv_end"
android:textColor="@color/col_3f6db7"
android:textSize="@dimen/text_18sp"
android:text="流程结束"/>
</RelativeLayout>
</LinearLayout>
</ScrollView>
<TextView
android:id="@+id/tv_no_process_data"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="@string/no_data"
android:visibility="gone"/>
</LinearLayout>其中rlt_begin为流程开始的布局,ll_process_container控件为动态添加流程的容器，alt_end为流程结束的布局。
Activity中的代码：
initProcessView();//此方法为动态添加流程子节点的方法
Activity具体代码如下：
@BindView(R.id.scrollview)
ScrollView scrollView;
/**无数据提示*/
@BindView(R.id.tv_no_process_data)
TextView tvNoDate;
/**审批流程容器*/
@BindView(R.id.ll_process_container)
LinearLayout llProcessContainer;
@BindView(R.id.rlt_begin)
RelativeLayout rltBegin;
@BindView(R.id.rlt_end)
RelativeLayout rltEnd;
/**流程节点集合*/
private List<GetProcessTakeTableBean> processList=new ArrayList<>();
private void initProcessView() {
llProcessContainer.removeAllViews();
for(int i = 0; i <processList.size();i++){
LinearLayout linearLayout= (LinearLayout) LayoutInflater.from(this).inflate(R.layout.view_process_item,null);
TextView tvTitle=linearLayout.findViewById(R.id.tv_title);
TextView tvDate=linearLayout.findViewById(R.id.tv_date);
TextView tvName=linearLayout.findViewById(R.id.tv_name);
TextView tvAdvice=linearLayout.findViewById(R.id.tv_advice);
TextView tvResult=linearLayout.findViewById(R.id.tv_result);
TextView tvLineAfter=linearLayout.findViewById(R.id.line_after);
if(StringUtil.isNotEmpty(processList.get(i).getNode_NAME())){
tvTitle.setText(processList.get(i).getNode_NAME());
}
if(processList.get(i).getHandletime() != 0){
tvDate.setText(DateUtils.millis2String(processList.get(i).getHandletime(),"yyyy-MM-dd HH：mm"));
}
if(StringUtil.isNotEmpty(processList.get(i).getHandler_NAME())){
tvName.setText(processList.get(i).getHandler_NAME());
}
if(StringUtil.isNotEmpty(processList.get(i).getHandle_ADVICE())){
tvAdvice.setText(processList.get(i).getHandle_ADVICE());
}
if(StringUtil.isNotEmpty(processList.get(i).getHandle_RESULT())){
tvResult.setVisibility(View.VISIBLE);
tvResult.setText(processList.get(i).getHandle_RESULT());
}else{
tvResult.setVisibility(View.GONE);
}
rltBegin.setVisibility(View.VISIBLE);
int status=processList.get(i).getAudit_LEVEL();
switch (status){
case 0:
case 1:
case 2:
rltEnd.setVisibility(View.GONE);
if(i == processList.size()-1){
tvLineAfter.setVisibility(View.GONE);
}
break;
case 3:
rltEnd.setVisibility(View.VISIBLE);
break;
default:break;
}
llProcessContainer.addView(linearLayout);
}
}