android 时间轴 listview,android 时间轴listview的UI界面实现

实现一个时间轴的ListView，需要自定义ListView的Item布局，具体实现步骤如下：

1. 自定义ListView的item布局，可以使用LinearLayout实现垂直方向的布局，其中包含两个TextView，一个用于显示时间，一个用于显示内容。

2. 在Adapter中使用ViewHolder模式优化ListView的性能。

3. 在ListView的Adapter中实现getView方法，将数据绑定到item的TextView中。

4. 在ListView的Activity中设置Adapter，将数据传入Adapter中，实现时间轴ListView的界面效果。

下面是一个简单的示例代码：

1. item_time_line.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:paddingTop="8dp"
    android:paddingBottom="8dp"
    android:paddingStart="16dp"
    android:paddingEnd="16dp">

    <TextView
        android:id="@+id/tv_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="@color/colorAccent"/>

    <TextView
        android:id="@+id/tv_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:textSize="16sp"
        android:textColor="@color/colorPrimaryDark"/>

</LinearLayout>

2. TimeLineAdapter.java

public class TimeLineAdapter extends BaseAdapter {

    private List<TimeLineItem> mData;
    private LayoutInflater mInflater;

    public TimeLineAdapter(Context context, List<TimeLineItem> data) {
        mData = data;
        mInflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        return mData.size();
    }

    @Override
    public Object getItem(int position) {
        return mData.get(position);
    }

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

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.item_time_line, parent, false);
            holder = new ViewHolder();
            holder.tvTime = convertView.findViewById(R.id.tv_time);
            holder.tvContent = convertView.findViewById(R.id.tv_content);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        TimeLineItem item = mData.get(position);
        holder.tvTime.setText(item.getTime());
        holder.tvContent.setText(item.getContent());

        return convertView;
    }

    private static class ViewHolder {
        TextView tvTime;
        TextView tvContent;
    }
}

3. TimeLineActivity.java

public class TimeLineActivity extends AppCompatActivity {

    private ListView mListView;
    private List<TimeLineItem> mData;
    private TimeLineAdapter mAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_time_line);

        mListView = findViewById(R.id.list_view);

        mData = new ArrayList<>();
        mData.add(new TimeLineItem("2021-01-01", "事件1"));
        mData.add(new TimeLineItem("2021-02-02", "事件2"));
        mData.add(new TimeLineItem("2021-03-03", "事件3"));
        mData.add(new TimeLineItem("2021-04-04", "事件4"));
        mData.add(new TimeLineItem("2021-05-05", "事件5"));
        mData.add(new TimeLineItem("2021-06-06", "事件6"));
        mData.add(new TimeLineItem("2021-07-07", "事件7"));
        mData.add(new TimeLineItem("2021-08-08", "事件8"));
        mData.add(new TimeLineItem("2021-09-09", "事件9"));

        mAdapter = new TimeLineAdapter(this, mData);
        mListView.setAdapter(mAdapter);
    }
}

上述代码实现了一个简单的时间轴ListView，界面如下所示：