实现思路:
该View是通过ListView实现的,通过实体两个字段内容content和时间time来展示每个ListItem
时间轴是使用上面一条线(20dp)和中间一个圆(15dp)和下面一条线(40dp)组装成的
在ListView中,设置其分割线为空,并且没有点击效果
效果图:
步骤一:使用xml画出一个灰色的圆点(time_cycle.xml)
<&#63;xml version="1.0" encoding="utf-8"&#63;>
步骤二:javabean的编写
public class KuaiDi { private String content; private String time; public KuaiDi(String time, String content) { this.cOntent= content; this.time = time; } 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; } }
步骤三:编写子布局(time_item.xml)
<&#63;xml version="1.0" encoding="utf-8"&#63;>
其效果如图:
步骤四:编写父布局(activity_main.xml)
<&#63;xml version="1.0" encoding="utf-8"&#63;>
步骤五:编写子布局的适配器(KuaiDiAdapter.java)
public class KuaiDiAdapter extends BaseAdapter { //印章数据 private Listlist; private LayoutInflater mInflater; public KuaiDiAdapter(Context context, List list) { this.list = list; mInflater = LayoutInflater.from(context); } @Override public int getCount() { return list.size(); } @Override public Object getItem(int position) { return list.get(position); } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View convertView, ViewGroup parent) { if (cOnvertView== null) { cOnvertView= mInflater.inflate(R.layout.time_item, null); } ViewHolder holder = getViewHolder(convertView); KuaiDi kd = list.get(position); holder.tv_content.setText(kd.getContent()); holder.tv_time.setText(kd.getTime()); return convertView; } /** * 获得控件管理对象 * * @param view * @return */ private ViewHolder getViewHolder(View view) { ViewHolder holder = (ViewHolder) view.getTag(); if (holder == null) { holder = new ViewHolder(view); view.setTag(holder); } return holder; } /** * 控件管理类 */ private class ViewHolder { private TextView tv_content, tv_time; ViewHolder(View view) { tv_cOntent= (TextView) view.findViewById(R.id.tv_content); tv_time = (TextView) view.findViewById(R.id.tv_time); } } }
步骤六:在父布局中设置适配器
public class MainActivity extends AppCompatActivity { private ListView lv; private KuaiDiAdapter adapter; private Listlist; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); lv = (ListView) findViewById(R.id.lv); list =new ArrayList<>(); list.add(new KuaiDi("2016-09-18 08:33:50","您的订单开始处理")); list.add(new KuaiDi("2016-09-18 08:40:23","您的订单待配货")); list.add(new KuaiDi("2016-09-18 08:51:33","您的包裹已出库")); list.add(new KuaiDi("2016-09-18 21:12:53","【深圳市龙华函件中心】已收寄")); list.add(new KuaiDi("2016-09-18 17:44:20","到达【深圳】")); list.add(new KuaiDi("2016-09-18 21:26:51","离开【深圳市龙华函件中心】,下一站【深圳市】")); list.add(new KuaiDi("2016-09-18 23:18:21","到达【深圳市处理中心】")); list.add(new KuaiDi("2016-09-19 01:14:30","离开【深圳市处理中心】,下一站【广州市】")); list.add(new KuaiDi("2016-09-19 04:42:11","到达【广东省广州邮件处理中心】")); adapter = new KuaiDiAdapter(this,list); lv.setAdapter(adapter); } }
以上所述是小编给大家介绍的Android控件之使用ListView实现时间轴效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!