1. 程式人生 > >Android中通過ListView的實現簡單新聞列表

Android中通過ListView的實現簡單新聞列表

Android中實現簡單的新聞列表

“本文主要針對Android新手,大神請繞道…”

使用到的第三方庫

Retrofit2+RxJava2 進行網路請和json資料的解析,註解框架:Butterknife 8.5.1 如果以上的框架還有同學不知道怎麼使用可以看看我寫的另外兩篇文章,主要是介紹了上面框架的簡單使用。如果想深入研究請自行百度。還有強大的圖片載入框架 : Glide

準備資料來源

我們需要的資料,因為是新聞頭條的資料,所以我就在聚合資料上面申請了一個免費的新聞頭條介面

通過網路請求會給我返回這樣的一個Json資料:

{
    "reason":"成功的返回",
    "result":{
        "stat":"1",
        "data":[
            {
                "uniquekey":"5f85f80847fc4709cee1ad9390b9ed9d",
                "title":"高虎城全面闡釋中國成就 南開學子交流新時代新內涵",
                "date":"2017-11-20 21:47",
                "category":"頭條",
                "author_name":"中國新聞網",
                "url":"http://mini.eastday.com/mobile/171120214733416.html",
                "thumbnail_pic_s":"http://07.imgmini.eastday.com/mobile/20171120/20171120214733_cc7ebdd495a11d003fd481317e23c036_3_mwpm_03200403.jpg",
                "thumbnail_pic_s02":"http://07.imgmini.eastday.com/mobile/20171120/20171120214733_cc7ebdd495a11d003fd481317e23c036_1_mwpm_03200403.jpg",
                "thumbnail_pic_s03":"http://07.imgmini.eastday.com/mobile/20171120/20171120214733_cc7ebdd495a11d003fd481317e23c036_2_mwpm_03200403.jpg"
            }, 
        ]
    },
    "error_code":0
}

我們需要通過上面請求回來的json資料建立對應的bean類。這裡我推薦 AndroidStudio 上的一個外掛 GsonFormat 通過該外掛可以根據json資料快速生成對應的類。

package com.example.administrator.myapplication.model;

import java.util.List;

/**
 * Created by zhengliang on 2017/11/20 0020.
 */

public class ListNewsVO{

    /**
     * reason : 成功的返回
     * result : 
     * error_code : 0
     */
    private String reason;
    private ResultEntity result;
    private int error_code;
    public static class ResultEntity {
        /**
         * stat : 1
         * data : [{...}]
         */
        private String stat;
        private List<DataEntity> data;
        public static class DataEntity {
            /**
             * uniquekey : 5f85f80847fc4709cee1ad9390b9ed9d
             * title : 高虎城全面闡釋中國成就 南開學子交流新時代新內涵
             * date : 2017-11-20 21:47
             * category : 頭條
             * author_name : 中國新聞網
             * url : 
             * thumbnail_pic_s02 : 
             * thumbnail_pic_s03 : 
             */
            private String uniquekey;
            private String title;
            private String date;
            private String category;
            private String author_name;
            private String url;
            private String thumbnail_pic_s;
            private String thumbnail_pic_s02;
            private String thumbnail_pic_s03;
        }
    }
}

為了減少篇幅,bean物件的getter和setter方法就沒貼出來了!

XML佈局檔案

建立一個現實新聞item的佈局檔案 item_news.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >
    <LinearLayout
        android:id="@+id/ll_item"
        android:foreground="?android:selectableItemBackgroundBorderless"
        android:layout_margin="10dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        tools:targetApi="lollipop">

        <ImageView
            android:id="@+id/iv_img"
            android:layout_width="80dp"
            android:layout_height="80dp"
            />

        <LinearLayout
            android:layout_marginLeft="8dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            >

            <TextView
                android:id="@+id/tv_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:textSize="18dp"/>

            <TextView
                android:id="@+id/tv_date"
                android:layout_marginTop="10dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="14dp"/>

        </LinearLayout>
    </LinearLayout>
    <View
        android:layout_alignParentBottom="true"
        android:layout_width="match_parent"
        android:layout_height="1px"
        android:background="#333333"/>
</RelativeLayout>

Java檔案

通過 item_news.xml 佈局檔案建立自定義的Adapter類:NewsItemListAdapter.java 繼承 RecyclerView.Adapter<> 類。

/**
 * Created by zhengliang on 2017/11/20 0020.
 */

public class NewsItemListAdapter extends RecyclerView.Adapter<NewsItemListAdapter.MyViewHolder> {
    private Context context;
    private List<ListNewsVO.ResultEntity.DataEntity> newsList = new ArrayList<>();
    private OnItemClickListener listener;



    public NewsItemListAdapter(Context context, ListNewsVO response) {
        this.context = context;

        if (response != null && response.getResult() != null) {
            this.newsList = response.getResult().getData();
        }
    }

    public void setListener(OnItemClickListener listener) {
        this.listener = listener;
    }

    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        return new MyViewHolder(LayoutInflater.from(context).inflate(R.layout.itme_news, parent, false));
    }

    @Override
    public void onBindViewHolder(MyViewHolder holder, final int position) {
        ListNewsVO.ResultEntity.DataEntity news = newsList.get(position);
        holder.tvTitle.setText(news.getTitle());
        holder.tvDate.setText(news.getDate());

        //載入圖片
        Glide.with(context)
                .load(news.getThumbnail_pic_s())
                .crossFade()
                .diskCacheStrategy(DiskCacheStrategy.ALL)//開啟快取
                .into(holder.ivImg);
        //設定Item的點選事件
        if (this.listener != null) {
            holder.LLItem.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    listener.onClick(view,position);
                }
            });
        }
    }

    @Override
    public int getItemCount() {
        return this.newsList.size();
    }

    static class MyViewHolder extends RecyclerView.ViewHolder {
        @BindView(R.id.tv_title)
        TextView tvTitle;
        @BindView(R.id.tv_date)
        TextView tvDate;
        @BindView(R.id.iv_img)
        ImageView ivImg;
        @BindView(R.id.ll_item)
        LinearLayout LLItem;

        MyViewHolder(View itemView) {
            super(itemView);
            ButterKnife.bind(this, itemView);
        }
    }

    /**
     * 自定義Item的點選事件介面
     */
    public interface OnItemClickListener{
        void onClick(View view,int position);
    }
}

最後看一下效果圖:

123.gif