android 仿快递步骤_Android开发-类似物流快递进度效果
释放双眼,带上耳机,听听看~!
老规矩先看图:
前言
写这篇之前,也考虑了好几种方案。网上有采用自定义控件的,有引用三方依赖的。但是考虑到后期更改样式问题,还是自己写吧。后期还可以补全动画效果,简单粗暴。
一布局:
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white">
android:id="@+id/rv_myRecycler"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="@dimen/ds_25dp"
android:background="@color/white"
android:nestedScrollingEnabled="false" />
布局很简单,常规的 RecyclerView,设置id。
二java部分:
package com.yc.stscf.fragment.contract;
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import com.yc.stscf.R;
import com.yc.stscf.adapter.ContractProcessAdapter;
import com.yc.stscf.base.BaseFragment;
import com.yc.stscf.model.ContractProcessBean;
import java.util.ArrayList;
import java.util.List;
import butterknife.BindView;
/**
* ================================================
*
* @author :Vip
* @version :V 1.0.0
* @date :2019/7/9 15:47
* 描 述:这是一个小demo
* 修订历史:
* ================================================
*/
public class ContractProcessFragment extends BaseFragment {
@BindView(R.id.rv_myRecycler)
RecyclerView rvMyRecycler;
/**
* 总布局
**/
private View view = null;
/**
* 标志位,标志已经初始化完成
**/
private boolean isPrepared;
ContractProcessAdapter contractProcessAdapter;
List dataBeanList = new ArrayList<>();
@SuppressLint("InflateParams")
@Override
protected View initLayout(LayoutInflater inflater, ViewGroup container, boolean b) {
view = inflater.inflate(R.layout.fragment_contract_process, null);
isPrepared = true;
return view;
}
@Override
protected void initView(Bundle savedInstanceState) {
if (rvMyRecycler.getRecycledViewPool() != null) {
rvMyRecycler.getRecycledViewPool().setMaxRecycledViews(0, 10);
}
rvMyRecycler.setLayoutManager(new LinearLayoutManager(mContext, LinearLayoutManager.VERTICAL, false));
contractProcessAdapter = new ContractProcessAdapter(R.layout.item_contract_process, dataBeanList);
rvMyRecycler.setAdapter(contractProcessAdapter);
initData();
}
@Override
protected void lazyLoad() {
if (!isPrepared || !isVisible) {
return;
}
}
private void initData() {
/**
* 标题,状态,姓名,内容,时间
**/
ContractProcessBean.DataBean dataBean = new ContractProcessBean.DataBean();
dataBean.setTitle("合同发起");
dataBean.setState("0");
dataBean.setName("曲大胆");
dataBean.setContent("融资合同已发起");
dataBean.setTime("2019-10-10 09:20");
ContractProcessBean.DataBean dataBean1 = new ContractProcessBean.DataBean();
dataBean1.setTitle("业务主管");
dataBean1.setState("1");
dataBean1.setName("滴答星仔");
dataBean1.setContent("申请资质符合要求,同意融资申请。");
dataBean1.setTime("2019-10-30 09:20");
ContractProcessBean.DataBean dataBean2 = new ContractProcessBean.DataBean();
dataBean2.setTitle("风控主管");
dataBean2.setState("2");
dataBean2.setName("滴答星仔");
dataBean2.setContent("申请资质不符合要求,驳回重新申请。");
dataBean2.setTime("2019-9-30 09:20");
ContractProcessBean.DataBean dataBean3 = new ContractProcessBean.DataBean();
dataBean3.setTitle("萝卜主管");
dataBean3.setState("3");
dataBean3.setName("滴答星仔");
dataBean3.setContent("申请资质不符合要求,驳回重新申请。");
dataBean3.setTime("2017-9-30 09:20");
ContractProcessBean.DataBean dataBean4 = new ContractProcessBean.DataBean();
dataBean4.setTitle("资料审核");
dataBean4.setState("4");
dataBean4.setName("滴答星仔");
dataBean4.setContent("审核中,驳回重新申请。");
dataBean4.setTime("2017-8-30 09:20");
dataBeanList.add(dataBean);
dataBeanList.add(dataBean1);
dataBeanList.add(dataBean2);
dataBeanList.add(dataBean3);
dataBeanList.add(dataBean4);
contractProcessAdapter.notifyDataSetChanged();
}
}
上面很简单。常规的数据赋值绑定适配器,没做什么特别操作。
三适配器布局:
package com.yc.stscf.adapter;
import android.view.View;
import com.chad.library.adapter.base.BaseQuickAdapter;
import com.chad.library.adapter.base.BaseViewHolder;
import com.yc.stscf.R;
import com.yc.stscf.model.ContractProcessBean;
import com.yc.stscf.model.FinancingProcessBean;
import java.util.List;
/**
* ================================================
*
* @author :Vip
* @version :V 1.0.0
* @date :2019/7/9 15:47
* 描 述:适配器
* 修订历史:
* ================================================
*/
public class ContractProcessAdapter extends BaseQuickAdapter {
public void upData(List data) {
mData = data;
}
/**
* 移除所有数据
**/
public void removeAll() {
if (mData != null && mData.size() > 0) {
for (int i = mData.size() - 1; i >= 0; i--) {
mData.remove(i);
}
}
}
public ContractProcessAdapter(int itemRecycler, List mList) {
super(itemRecycler, mList);
}
@Override
protected void convert(final BaseViewHolder helper, final ContractProcessBean.DataBean item) {
helper.setText(R.id.tv_num, helper.getPosition() + 1 + "");
/**
* 标题,状态,姓名,内容,时间
**/
switch (item.getState()) {
case "0":
//全显示
helper.setText(R.id.tv_title, item.getTitle()).setTextColor(R.id.tv_title, mContext.getResources().getColor(R.color.cs_333333));
helper.setText(R.id.tv_state, "提交").setTextColor(R.id.tv_state, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_name, item.getName()).setTextColor(R.id.tv_name, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_time, item.getTime()).setTextColor(R.id.tv_time, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_content, item.getContent()).setTextColor(R.id.tv_content, mContext.getResources().getColor(R.color.cs_999999));
helper.getView(R.id.tv_time).setVisibility(View.VISIBLE);
helper.getView(R.id.tv_content).setVisibility(View.VISIBLE);
helper.getView(R.id.rl_right).setBackground(mContext.getDrawable(R.drawable.ic_liucheng_bai));
break;
case "1":
//部分显示
helper.setText(R.id.tv_title, item.getTitle()).setTextColor(R.id.tv_title, mContext.getResources().getColor(R.color.cs_333333));
helper.setText(R.id.tv_state, "审核中").setTextColor(R.id.tv_state, mContext.getResources().getColor(R.color.cs_F88441));
helper.setText(R.id.tv_name, item.getName()).setTextColor(R.id.tv_name, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_time, item.getTime()).setTextColor(R.id.tv_time, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_content, item.getContent()).setTextColor(R.id.tv_content, mContext.getResources().getColor(R.color.cs_999999));
helper.getView(R.id.tv_time).setVisibility(View.GONE);
helper.getView(R.id.tv_content).setVisibility(View.GONE);
helper.getView(R.id.rl_right).setBackground(mContext.getDrawable(R.drawable.ic_liucheng_cheng));
break;
case "2":
//部分显示
helper.setText(R.id.tv_title, item.getTitle()).setTextColor(R.id.tv_title, mContext.getResources().getColor(R.color.cs_cccccc));
helper.setText(R.id.tv_state, "未开始").setTextColor(R.id.tv_state, mContext.getResources().getColor(R.color.cs_cccccc));
helper.setText(R.id.tv_name, item.getName()).setTextColor(R.id.tv_name, mContext.getResources().getColor(R.color.cs_cccccc));
helper.setText(R.id.tv_time, item.getTime()).setTextColor(R.id.tv_time, mContext.getResources().getColor(R.color.cs_cccccc));
helper.setText(R.id.tv_content, item.getContent()).setTextColor(R.id.tv_content, mContext.getResources().getColor(R.color.cs_cccccc));
helper.getView(R.id.tv_time).setVisibility(View.GONE);
helper.getView(R.id.tv_content).setVisibility(View.GONE);
helper.getView(R.id.rl_right).setBackground(mContext.getDrawable(R.drawable.ic_liucheng_bai));
break;
case "3":
//全显示
helper.setText(R.id.tv_title, item.getTitle()).setTextColor(R.id.tv_title, mContext.getResources().getColor(R.color.cs_333333));
helper.setText(R.id.tv_state, "同意").setTextColor(R.id.tv_state, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_name, item.getName()).setTextColor(R.id.tv_name, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_time, item.getTime()).setTextColor(R.id.tv_time, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_content, item.getContent()).setTextColor(R.id.tv_content, mContext.getResources().getColor(R.color.cs_999999));
helper.getView(R.id.tv_time).setVisibility(View.VISIBLE);
helper.getView(R.id.tv_content).setVisibility(View.VISIBLE);
helper.getView(R.id.rl_right).setBackground(mContext.getDrawable(R.drawable.ic_liucheng_bai));
break;
case "4":
helper.setText(R.id.tv_title, item.getTitle()).setTextColor(R.id.tv_title, mContext.getResources().getColor(R.color.cs_333333));
helper.setText(R.id.tv_state, "驳回").setTextColor(R.id.tv_state, mContext.getResources().getColor(R.color.cs_dc4545));
helper.setText(R.id.tv_name, item.getName()).setTextColor(R.id.tv_name, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_time, item.getTime()).setTextColor(R.id.tv_time, mContext.getResources().getColor(R.color.cs_999999));
helper.setText(R.id.tv_content, item.getContent()).setTextColor(R.id.tv_content, mContext.getResources().getColor(R.color.cs_999999));
helper.getView(R.id.tv_time).setVisibility(View.VISIBLE);
helper.getView(R.id.tv_content).setVisibility(View.VISIBLE);
helper.getView(R.id.rl_right).setBackground(mContext.getDrawable(R.drawable.ic_liucheng_hong));
break;
default:
break;
}
if (helper.getPosition() == mData.size() - 1) {
helper.getView(R.id.view_line_color).setVisibility(View.GONE);
} else {
helper.getView(R.id.view_line_color).setVisibility(View.VISIBLE);
}
}
}
适配器引用了三方依赖,已经使用了缓存机制。这里大家替换成自己的baseAdapter即可, 这里在方法里由主界面传了RecyclerView和数据源list.
这里去设置进度的1234
根据状态去显示颜色灰暗
根据当前位置,去比对,使最后一个竖线隐藏。
四实体类:
package com.yc.stscf.model;
import java.io.Serializable;
import java.util.List;
/**
* ================================================
*
* @author :Vip
* @version :V 1.0.0
* @date :2019/7/9 15:47
* 描 述:常规实体类
* 修订历史:
* ================================================
*/
public class ContractProcessBean implements Serializable {
private String msg;
private String code;
private List data;
public String getMsg() {
return msg;
}
public void setMsg(String msg) {
this.msg = msg;
}
public String getCode() {
return code;
}
public void setCode(String code) {
this.code = code;
}
public List getData() {
return data;
}
public void setData(List data) {
this.data = data;
}
public static class DataBean {
/**
* 标题,状态,姓名,内容,时间
**/
String title;
String state;
String name;
String content;
String time;
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getState() {
return state;
}
public void setState(String state) {
this.state = state;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
public String getTime() {
return time;
}
public void setTime(String time) {
this.time = time;
}
}
}
五适配器子项布局
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/white"
android:gravity="center"
android:orientation="vertical">
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:ignore="UselessParent">
android:id="@+id/rl_left"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/ds_28dp"
android:layout_marginRight="@dimen/ds_10dp"
android:orientation="vertical"
tools:ignore="RtlHardcoded">
android:id="@+id/tv_num"
android:layout_width="@dimen/ds_22dp"
android:layout_height="@dimen/ds_22dp"
android:layout_marginTop="@dimen/ds_9dp"
android:background="@drawable/bg_f88441_360_round"
android:gravity="center_vertical|center_horizontal"
android:text="1"
android:textColor="@color/white"
android:textSize="@dimen/ds_13sp"
tools:ignore="HardcodedText" />
android:id="@+id/view_line_color"
android:layout_width="@dimen/ds_2dp"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_marginTop="@dimen/ds_9dp"
android:background="@color/cs_f7823f" />
android:id="@+id/rl_right"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/ds_20dp"
android:layout_marginRight="@dimen/ds_22dp"
android:background="@drawable/ic_liucheng_bai"
tools:ignore="RtlHardcoded,UselessParent">
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginBottom="@dimen/ds_14dp"
android:layout_marginLeft="@dimen/ds_20dp"
android:layout_marginRight="@dimen/ds_20dp"
android:layout_marginTop="@dimen/ds_14dp"
tools:ignore="RtlHardcoded,UselessLeaf">
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/ds_10dp"
android:text="合同发起"
android:textColor="@color/cs_333333"
android:textSize="@dimen/ds_14sp"
tools:ignore="HardcodedText" />
android:id="@+id/tv_state"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:gravity="right"
android:text="状态"
android:textColor="@color/cs_999999"
android:textSize="@dimen/ds_12sp"
tools:ignore="HardcodedText" />
android:id="@+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_title"
android:layout_marginLeft="@dimen/ds_10dp"
android:layout_marginTop="@dimen/ds_5dp"
android:text="曲丽丽"
android:textColor="@color/cs_999999"
android:textSize="@dimen/ds_12sp"
tools:ignore="HardcodedText" />
android:id="@+id/tv_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_name"
android:layout_marginLeft="@dimen/ds_10dp"
android:layout_marginTop="@dimen/ds_5dp"
android:text="申请资质符合要求,同意融资申请。"
android:textColor="@color/cs_999999"
android:textSize="@dimen/ds_12sp"
tools:ignore="HardcodedText" />
android:id="@+id/tv_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_content"
android:layout_marginLeft="@dimen/ds_10dp"
android:layout_marginTop="@dimen/ds_5dp"
android:text="2019-10-10 09:20"
android:textColor="@color/cs_999999"
android:textSize="@dimen/ds_11sp"
tools:ignore="HardcodedText" />
子项布局的,一些图片没有提供,大家可以自行替换。黄色的原点可以放个小图片。里面的ds间距就正常给多少多少dp即可
最后就大功告成了!
总结 :
我个人是非常不建议这部分的逻辑用画笔去画。
缺点一是增加了开发者的学习成本,很多开发者更加喜欢简单粗暴好用的逻辑。
缺点二是无法灵活,无法轻松的按产品及ui的需求去改变自己的样式。
补充:
1.样式上。线条的长度可以随着右边文本内容的增大而变长。
2.右侧的内容,外层的图片是.9图片,可以自动拉伸不变形,配合左边达到很自然的效果。
3.如果有遗漏的,欢迎留言。
android 仿快递步骤_Android开发-类似物流快递进度效果相关推荐
- android 仿快递步骤_Android实现仿美团、顺丰快递数据加载效果
我们都知道在Android中,常见的动画模式有两种:一种是帧动画(Frame Animation),一种是补间动画(Tween Animation).帧动画是提供了一种逐帧播放图片的动画方式,播放事先 ...
- android 仿快递步骤_【干货速递,建议收藏】Android 流式布局,一篇搞定
今天我们来看Android的流式布局. 所谓流式布局指的是ViewGroup中同一行的宽度不足以容纳下一个子view时,进行换行处理,而不需要考虑子view的大小,每一行的高度以其中最高者为准. Ta ...
- Android仿拼多多实现图片叠加部分覆盖效果
Android仿拼多多实现图片叠加部分覆盖效果 需要实现的效果如下: 代码部分: AppIconStackView: public class AppIconStackView extends Vie ...
- android加载h5页面加进度条,使用Android仿微信加载H5页面的进度条
这篇文章主要为大家详细介绍了Android仿微信加载H5页面进度条,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 前言 Android中WebView打卡前端页面时受到网路环境,页面内容大小的影响 ...
- android浮窗播放器,Android仿优酷视频的悬浮窗播放效果
之前接了需求要让视频播放时可以像优酷视频那样在悬浮窗里播放,并且悬浮窗和主播放页面之间要实现无缝切换,项目中使用的是自封装的ijkplayer 这个要求就代表不能在悬浮窗中新建视频控件,所以需要在悬浮 ...
- android计步器简书,自定义View-仿QQ运动步数进度效果
自定义View-仿QQ运动步数进度效果 一.写在前面 (1) 图一,仿QQ步数运行效果 (2) 图二,完整的圆效果 完整代码请看这 二.正文开始 (1)首先来个三部曲,自定义属性,布局设置,属性获取 ...
- Android仿支付宝UI功能开发,Android类似支付宝我的界面切片
Android界面制作-类似支付宝我的界面,内含整个项目.效果图 内含以下栏目: 头像.姓名 账单.总资产.余额. 银行卡.保险服务.公益等 资源下载: 视频地址(优酷):http://v.youku ...
- android 中间凹背景_Android开发仿百度地图的凹陷BottomNavigationView
释放双眼,带上耳机,听听看~! 百度的: 71529789c6c948803e1075c2c7e00809.jpg 我的: e9347423eb2031228af77ad63d7b01d7.jpg 使 ...
- Android仿支付宝UI功能开发,Android 自定义view仿支付宝咻一咻功能
支付宝上有一个咻一咻的功能,就是点击图片后四周有水波纹的这种效果,今天也写一个类似的功能. 效果如下所示: 思路: 就是几个圆的半径不断在变大,这个可以使用动画缩放实现,还有透明动画 还有就是这是好几 ...
最新文章
- 个人学习某个系统或平台的3问式的整理和细化指引
- 通过Redis实现分布式锁
- Qt Creator编辑MIME类型
- js svg 转成文件_如何缩小 SVG 文件的大小?去掉冗余的标签,压缩它的大小
- php判断桌面宽度,js获取页面宽度高度及屏幕分辨率
- svg 地图_找地图素材?有这个网站就够了!
- nw.js 打包换桌面图标_我如何使用CometChat和NW.js构建桌面聊天应用程序(以及方法)
- Python tkinter版猜数游戏
- 软件测试--selenium安装使用
- android服务绑定异步,Android中异步类AsyncTask用法总结
- php裁剪图片白边,php生成缩略图自动填充白边例子
- python接口自动化(二十二)--unittest执行顺序隐藏的坑(详解)
- Python学习路程-常用设计模式学习
- [转] 春晚诗朗诵《心里话》之程序员版!!
- ADO.NET访问数据集的表、行和列
- vs2015连接oracle(11g)的方法
- python pyhook监听扫码_Python2.7:使用Pyhook模块监听鼠标键盘事件-获取坐标实例
- PL(Procedural Language)/SQL程序设计语言
- python飞机大战实验报告心得_飞机大战实训报告
- python加权随机_Python中的加权随机
热门文章
- 三维数学基础(一)坐标系、向量、矩阵
- java 内置锁_深入理解java内置锁(synchronized)和显式锁(ReentrantLock)
- 《全景探秘游戏设计艺术》精华 用户体验 游戏平衡性
- 华盛顿大学公开课Programming Languages by Dan Grossman 简介
- PBRT中的误差舍入管理(浮点运算)
- shiro将session认证改成token认证_初步学习Shiro框架 第一集
- 8266不通过usb供电_HomePod mini?电源线同样不可拆卸:但或能用USB-C移动电源供电...
- oracle 5表关联查询,Oracle学习笔记5 - 表查询
- Metal:对开发者和用户来说意味着什么
- 【刘文彬】EOS商业落地利器:多签名操作与应用