使用Android安卓开发一款适合小情侣的app----时间轴效果Listview

今天我们来到这个页面的开发，这个页面还是新建一个新的fragment2，这个页面使用的listview完成时间轴的效果，listView的每一个子项是可以点击的，然后可以跳转到详情详情界面。这里的小心心效果和首页的差不多使用的第三方库KsgLikeView，只不过这个定时执行频率更快,可以通过点击左边的按钮来控制小心心的开启和关闭状态。时间轴的内容数据是通过volley请求后台json数据获取的（后台地址是用springboot写的，然后部署到云主机的，此处就不给后台的链接了），我们当然也可以把数据进行写死放到集合里。

下面我们来看一下布局
fragment2

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/f2bg">
<LinearLayout
    android:id="@+id/shijianzhou1"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:orientation="horizontal"
    android:gravity="center"
    >

    <TextView
        android:id="@+id/shijianzhou"
        android:layout_width="200dp"
        android:layout_height="50dp"
        android:gravity="center"
        android:text="我们的时间轴"
        android:textSize="25sp"/>

    <ImageView
        android:id="@+id/img_f2_shuaxin"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:layout_gravity="center"
        android:background="@drawable/shuaxin" />
</LinearLayout>
    <ListView
        android:id="@+id/f2_Listview"
        android:divider="@null"
        android:layout_below="@id/shijianzhou1"
        android:layout_marginLeft="30dp"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </ListView>
    <TextView
        android:id="@+id/f2_aixikaiguan"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="开启"
        android:gravity="center"
        android:background="@drawable/heart0"
        android:layout_alignParentRight="true"
       android:layout_centerVertical="true"
       android:layout_centerHorizontal="true"
        />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.kaisengao.likeview.like.KsgLikeView
            android:id="@+id/f2_live_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:ksg_curve_duration="4500"
            app:ksg_default_image="@drawable/heart0"
            app:ksg_enter_duration="1500"
            app:layout_constraintDimensionRatio="H,1:4"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    </LinearLayout>
</RelativeLayout>

listview的布局样式

<?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="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/show_time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/image"
            android:padding="3dp"
            android:text="123232"
            android:textSize="16dp" />

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical">
            <ImageView
                android:id="@+id/image"
                android:layout_width="15dp"
                android:layout_height="15dp"
                android:layout_marginLeft="20dp"
                android:layout_marginRight="20dp"
                android:src="@drawable/point" />

            <View
                android:id="@+id/line_normal"
                android:layout_width="3dp"
                android:layout_height="100dp"
                android:layout_below="@+id/image"
                android:layout_marginLeft="26dp"
                android:background="@color/colorAccent" />
        </LinearLayout>

        <TextView
            android:id="@+id/show_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"

            android:padding="3dp"
            android:text="dddddwwwwwwwwwwwwwwwwddd"
            android:textSize="15dp" />


    </LinearLayout>





</LinearLayout>

fragment2代码

package com.glc.myapplication.fragment;

import android.content.Intent;
import android.content.res.AssetManager;
import android.graphics.Typeface;
import android.media.Image;
import android.os.Bundle;
import android.os.Handler;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

import com.android.volley.Request;
import com.android.volley.RequestQueue;
import com.android.volley.Response;
import com.android.volley.RetryPolicy;
import com.android.volley.VolleyError;
import com.android.volley.toolbox.JsonArrayRequest;
import com.android.volley.toolbox.JsonObjectRequest;
import com.android.volley.toolbox.Volley;
import com.glc.myapplication.R;
import com.glc.myapplication.XiangQingActivity;
import com.glc.myapplication.entity.Title;
import com.kaisengao.likeview.like.KsgLikeView;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import java.lang.reflect.Type;
import java.sql.Time;
import java.util.ArrayList;
import java.util.Collections;
import java.util.LinkedList;
import java.util.List;
import java.util.Timer;
import java.util.TimerTask;

public class fragment2 extends Fragment {
    private ListView lv;
    private TextView shijian;
    private List<Title> titles = new ArrayList<>();
    private BaseAdapter adapter;
    private KsgLikeView ksgLikeView;
    private Handler handler;
    private TextView aixinkaigaun;
    private int flag=1;
    private ImageView shuaxin;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment2, null);

    }

    @Override
    public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        lv = view.findViewById(R.id.f2_Listview);
        shijian = view.findViewById(R.id.shijianzhou);
        shuaxin=view.findViewById(R.id.img_f2_shuaxin);

        ksgLikeView=view.findViewById(R.id.f2_live_view);
        aixinkaigaun=view.findViewById(R.id.f2_aixikaiguan);
        ksgLikeView.addLikeImage(R.drawable.heart0);
        ksgLikeView.addLikeImage(R.drawable.heart1);
        ksgLikeView.addLikeImage(R.drawable.heart2);
        ksgLikeView.addLikeImage(R.drawable.heart3);
        ksgLikeView.addLikeImage(R.drawable.heart4);
        ksgLikeView.addLikeImage(R.drawable.heart5);
        ksgLikeView.addLikeImage(R.drawable.heart6);
        ksgLikeView.addLikeImage(R.drawable.heart7);
        ksgLikeView.addLikeImage(R.drawable.heart8);

        //设置字体样式
        AssetManager mgr = getActivity().getAssets();
        shijian.setTypeface(Typeface.createFromAsset(mgr, "font/fanxing.ttf"));

        shuaxin.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                titles.clear();
                getData();
            }
        });
       //爱心发射开关按钮
        aixinkaigaun.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if(flag==0){
                    aixinkaigaun.setText("开启");
                    aixinkaigaun.setBackgroundDrawable(getActivity().getResources().getDrawable(R.drawable.heart0));
                    autoLove();

                    flag=1;
                }else if(flag==1){
                    aixinkaigaun.setText("关闭");
                    aixinkaigaun.setBackgroundDrawable(getActivity().getResources().getDrawable(R.drawable.heart6));
                    handler.removeCallbacksAndMessages(null);

                    flag=0;

                }
            }
        });
        autoLove();
        getData();




    }

    //请求得到服务器数据
    private void getData() {
        JSONObject jsonObject = new JSONObject();
        String url = "此处是后台接口";
        RequestQueue requestQueue = Volley.newRequestQueue(getActivity());
        JsonArrayRequest jsonObjectRequest = new JsonArrayRequest(Request.Method.GET, url, jsonObject, new Response.Listener<JSONArray>() {
            @Override
            public void onResponse(JSONArray jsonArray) {
                Log.d("nihao", jsonArray.toString());
                for (int i = 0; i < jsonArray.length(); i++) {
                    try {
                        JSONObject jsonObject1 = (JSONObject) jsonArray.get(i);
                        String title = jsonObject1.getString("title");
                        String time = jsonObject1.getString("time");
                        String content = jsonObject1.getString("content");
                        Log.d("haha", title + "," + time + "," + content);
                        titles.add(new Title(title, time, content));
                    } catch (JSONException e) {
                        e.printStackTrace();
                    }
                }
                adapter = new BaseAdapter() {
                    @Override
                    public int getCount() {
                        return jsonArray.length();
                    }

                    @Override
                    public Object getItem(int i) {
                        return null;
                    }

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

                    @Override
                    public View getView(int i, View view, ViewGroup viewGroup) {
                        view = View.inflate(getContext(), R.layout.lv_item, null);
                        TextView textView_time = view.findViewById(R.id.show_time);
                        TextView textView_title = view.findViewById(R.id.show_title);
                        View view1=view.findViewById(R.id.line_normal);
                        textView_time.setText(titles.get(i).getTime());
                        textView_title.setText(titles.get(i).getTitle());
                        //listView的每一项的点击事件
                        lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                            @Override
                            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                                Log.d("woshiss", titles.get(0).getTitle());
                                //跳转传值bundle
                                Intent intent = new Intent(getActivity(), XiangQingActivity.class);
                                Bundle bundle = new Bundle();
                                bundle.putString("title", titles.get(i).getTitle());
                                bundle.putString("time", titles.get(i).getTime());
                                bundle.putString("content", titles.get(i).getContent());
                                intent.putExtras(bundle);
                                startActivity(intent);
                            }
                        });
                        //最后一项时，竖线不再显示
//                        if(i==jsonArray.length()-1){
//                            view1.setVisibility(View.GONE);
//                        }

                        return view;
                    }
                };
                //设置适配器
                lv.setAdapter(adapter);

            }
        }, new Response.ErrorListener() {
            @Override
            public void onErrorResponse(VolleyError volleyError) {
                Toast.makeText(getActivity(), volleyError+"", Toast.LENGTH_SHORT).show();
                Log.d("错误fragment2", volleyError.toString());
            }
        });
        requestQueue.add(jsonObjectRequest);
    }

    //定时执行小心心
    private void  autoLove(){
        handler=new Handler();
       handler.post(new Runnable() {
           @Override
           public void run() {
            ksgLikeView.addFavor();
            handler.postDelayed(this,1);
           }
       });
    }

    @Override
    public void onDestroy() {
        super.onDestroy();
        handler.removeCallbacksAndMessages(null);
    }
}

后台json格式数据

这样我们就完成这个页面的开发了