Android控件之使用ListView实现时间轴效果

 实现思路：

该View是通过ListView实现的，通过实体两个字段内容content和时间time来展示每个ListItem

时间轴是使用上面一条线（20dp）和中间一个圆（15dp）和下面一条线（40dp）组装成的

在ListView中，设置其分割线为空，并且没有点击效果

效果图：

步骤一：使用xml画出一个灰色的圆点（time_cycle.xml）

步骤二：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）

其效果如图：

步骤四：编写父布局（activity_main.xml）

步骤五：编写子布局的适配器（KuaiDiAdapter.java）

public class KuaiDiAdapter extends BaseAdapter { 
//印章数据 
private List list; 
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 List list; 
@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实现时间轴效果，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！