Android實現時間軸

mync 8年前發布 | 25K 次閱讀 Android Android開發 移動開發

昨天群里有討論時間軸的項目,沒有接觸過,以為很吊,研究之后才知道表面都是忽悠人的,使用listview就能實現了,也沒有什么新鮮的東西

廢話少說,直接上圖

圖片和文字都可以私人訂制

沒什么好說的,直接上代碼吧!相信你能看懂

1.時間軸item的布局文件


<?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"
    >

    <LinearLayout
        android:id="@+id/left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <View
            android:layout_width="1dp"
            android:layout_height="25dp"
            android:layout_marginLeft="60dp"
            android:background="#A6A6A6" />

        <ImageView
            android:id="@+id/left_imageview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="50dp"
            android:src="@drawable/medicalcheck2" />

        <View
            android:layout_width="1dp"
            android:layout_height="25dp"
            android:layout_marginLeft="60dp"
            android:background="#A6A6A6" />
    </LinearLayout>

    <LinearLayout
        android:layout_alignLeft="@id/left"
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:orientation="vertical" 
        android:gravity="center"
        android:layout_marginLeft="100dp">

        <TextView 
            android:id="@+id/right_textview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="aaa"/>
    </LinearLayout>

</RelativeLayout>
2.圖片和文字的model



package com.sdufe.thea.guo.model;


public class TimeLineModel {

    private int imageview;
    private String text;

    public int getImageview() {
        return imageview;
    }

    public void setImageview(int imageview) {
        this.imageview = imageview;
    }

    public String getText() {
        return text;
    }

    public void setText(String text) {
        this.text = text;
    }

    public TimeLineModel(int imageview, String text) {
        super();
        this.imageview = imageview;
        this.text = text;
    }

}
3時間軸的適配器



package com.sdufe.thea.guo.adapter;

import java.util.List;

import com.sdufe.thea.guo.R;
import com.sdufe.thea.guo.model.TimeLineModel;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class TimeLineAdapter extends BaseAdapter {

    Context context;
    List<TimeLineModel> list;

    public TimeLineAdapter(Context context, List<TimeLineModel> list) {
        super();
        this.context = context;
        this.list = list;
    }

    @Override
    public int getCount() {
        if (list!=null) {
            return list.size();
        }
        return 0;
    }

    @Override
    public Object getItem(int position) {
        if (list!=null) {
            return list.get(position);
        }
        return null;
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHold hold;
        if (convertView==null) {
            hold=new ViewHold();
            convertView=LayoutInflater.from(context).inflate(R.layout.timeline_item, null);
            convertView.setTag(hold);
        }else {
            hold=(ViewHold) convertView.getTag();
        }
        hold.imageView=(ImageView) convertView.findViewById(R.id.left_imageview);
        hold.show=(TextView) convertView.findViewById(R.id.right_textview);

        hold.imageView.setImageResource(list.get(position).getImageview());
        hold.show.setText(list.get(position).getText());
        return convertView;
    }

    static class ViewHold{
        public TextView show;
        public ImageView imageView;
    }

}

布局中的文件都跟listview的使用一樣,也貼一下代碼吧,方便你我他



package com.sdufe.thea.guo;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.Window;
import android.widget.ListView;

import com.sdufe.thea.guo.adapter.TimeLineAdapter;
import com.sdufe.thea.guo.model.TimeLineModel;

public class MainActivity extends Activity {

    private ListView listView;
    private List<TimeLineModel> list;
    private TimeLineAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);

        initData();
        initView();

    }

    private void initView() {
        listView=(ListView) findViewById(R.id.listview);
        adapter=new TimeLineAdapter(this, list);

        listView.setAdapter(adapter);
    }

    private void initData() {
        list=new ArrayList<TimeLineModel>();

        list.add(new TimeLineModel(R.drawable.medicalcheck2, "哈哈"));
        list.add(new TimeLineModel(R.drawable.nurse_visit2, "呵呵"));
        list.add(new TimeLineModel(R.drawable.nursingcareplan2, "嘿嘿"));
        list.add(new TimeLineModel(R.drawable.medicalcheck2, "哈哈"));
        list.add(new TimeLineModel(R.drawable.nurse_visit2, "啦啦"));
        list.add(new TimeLineModel(R.drawable.nursingcareplan2, "咳咳"));
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

}

ok,代碼上完了,不要被很多app的外表唬住



代碼下載地址:http://download.csdn.net/detail/elinavampire/8179393

github下載地址:https://github.com/zimoguo/TimeLineDemo


 本文由用戶 mync 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!