Android控件之使用ListView實現時間軸效果
更新時間：2016年11月21日 13:48:49 作者：K_Men
這篇文章主要介紹了Android基礎控件之使用ListView實現時間軸效果的相關資料,本文是以查看物流信息為例，給大家介紹了listview時間軸的實現代碼，需要的朋友可以參考下
實現思路：
該View是通過ListView實現的，通過實體兩個字段內容content和時間time來展示每個ListItem
時間軸是使用上面一條線（20dp）和中間一個圓（15dp）和下面一條線（40dp）組裝成的
在ListView中，設置其分割線為空，并且沒有點擊效果
效果圖：
步驟一：使用xml畫出一個灰色的圓點（time_cycle.xml）
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="#CBCBCB" /> <size android:width="15dp" android:height="15dp" /> </shape>
步驟二：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）
<?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="75dp" android:orientation="horizontal"> <!--線條部分--> <LinearLayout android:layout_width="wrap_content" android:layout_height="match_parent" android:gravity="center_horizontal" android:orientation="vertical" android:paddingLeft="30dp"> <View android:layout_width="3dp" android:layout_height="20dp" android:background="#CBCBCB" /> <ImageView android:layout_width="15dp" android:layout_height="15dp" android:background="@drawable/time_cycle" /> <View android:layout_width="3dp" android:layout_height="40dp" android:background="#CBCBCB" /> </LinearLayout> <!--文字部分--> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingLeft="30dp" android:paddingRight="30dp" android:paddingTop="20dp"> <TextView android:id="@+id/tv_content" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="【廣東省中國郵政集團公司深圳市龍華函件中心】已收寄" android:textColor="#ABABAB" /> <TextView android:id="@+id/tv_time" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/tv_content" android:text="2016-05-03 00:22:36" android:textColor="#ABABAB" /> </LinearLayout> </LinearLayout>
其效果如圖：
步驟四：編寫父布局（activity_main.xml）
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <ListView android:id="@+id/lv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:divider="@null" android:listSelector="@android:color/transparent" /> </RelativeLayout>
步驟五：編寫子布局的適配器（KuaiDiAdapter.java）
public class KuaiDiAdapter extends BaseAdapter {
//印章數據
private List<KuaiDi> list;
private LayoutInflater mInflater;
public KuaiDiAdapter(Context context, List<KuaiDi> 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<KuaiDi> 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實現時間軸效果，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！
相關文章
這篇文章主要介紹了Android 自定義View的構造函數詳細介紹的相關資料,這里對構造函數進行了對比按需使用，需要的朋友可以參考下2016-12-12
這篇文章主要介紹了Android 代碼一鍵實現銀行卡綁定功能，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-04-04
這篇文章主要為大家詳細介紹了Android實現微信支付功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-12-12
這篇文章主要介紹了Android手勢密碼的實現的相關資料,需要的朋友可以參考下2016-04-04
Android列表組件ListView使用詳解之動態(tài)加載或修改列表數據
今天小編就為大家分享一篇關于Android列表組件ListView使用詳解之動態(tài)加載或修改列表數據，小編覺得內容挺不錯的，現在分享給大家，具有很好的參考價值，需要的朋友一起跟隨小編來看看吧2019-03-03
下面小編就為大家?guī)硪黄狝ndroid給TextView添加點擊事件的實現方法。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-12-12
這篇文章主要介紹了Android Imageloader的配置的實現代碼的相關資料,需要的朋友可以參考下2017-07-07
本篇文章主要介紹了Android 遍歷文件夾中所有文件的實例代碼，可以獲得文件夾中所有文件的路徑及文件名，具有一定的參考價值，感興趣的小伙伴們可以參考一下。2017-06-06
這篇文章主要為大家詳細介紹了Android數據庫操作工具類的相關代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-10-10
這篇文章主要為大家詳細介紹了Android九宮格手勢密碼的代碼設計思路，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-03-03