Android使用GridView和RecyclerView显示行业标签

使用GridView和RecyclerView显示行业标签，看一下图中的效果。

我们先使用GridView来实现图中的效果吧
activity_tag_grid.xml布局代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.ranlegeran.recyclerviewtest.TagGridViewActivity">


    <GridView
        android:id="@+id/mGridView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="4"
        android:verticalSpacing="10dp" />

</LinearLayout>

在布局中我们放置了一个GridView控件然后把它的显示样式设置为4列
然后我们需要为它提供一个item布局
tag_grid_view_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="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/grid_text_tag"
        android:layout_width="80dp"
        android:layout_height="50dp"
        android:layout_gravity="center_horizontal"
        android:gravity="center"
        android:text="金融"
        android:textSize="17sp" />

</LinearLayout>

接着我们需要一个适配器TagGrdiViewAdapter如下：

package com.ranlegeran.recyclerviewtest;

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

import java.util.HashMap;
import java.util.List;

/**
 * Created by RANLEGERAN on 2018/5/3.
 */

public class TagGrdiViewAdapter extends BaseAdapter {
    private Context mContext;
    private List<HashMap<String,String>> mData;
    private LayoutInflater mLayoutInflater;

    public TagGrdiViewAdapter(Context context, List<HashMap<String,String>> data) {
        mLayoutInflater = LayoutInflater.from(context);
        this.mData = data;
        this.mContext = 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 viewGroup) {
        ViewHolder holder = null;
        if (convertView == null) {
            holder = new ViewHolder();
            convertView = mLayoutInflater.inflate(R.layout.tag_grid_view_item, null);
            holder.mTextTag = (TextView) convertView.findViewById(R.id.grid_text_tag);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }
        holder.mTextTag.setText(mData.get(position).get("tag_value").toString());
        return convertView;
    }

    class ViewHolder {
        TextView mTextTag;
    }
}

最后就是我们Activity部分了TagGridViewActivity如下：

package com.ranlegeran.recyclerviewtest;

import android.content.Intent;
import android.os.Handler;
import android.os.Message;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.GridView;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import org.xutils.http.RequestParams;
import org.xutils.x;

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

public class TagGridViewActivity extends AppCompatActivity {
    private static final String URL = "http://www.renmaichina.com/api.php/Public/getIndustryTags";
    private GridView mGridView;
    private TagGrdiViewAdapter mAdapter;
    private List<HashMap<String,String>> mList;
    private HashMap<String,String> mMap;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_tag_grid);
        mGridView = (GridView) findViewById(R.id.mGridView);
        mList = new ArrayList<>();
        mAdapter = new TagGrdiViewAdapter(this, mList);
        mGridView.setAdapter(mAdapter);
        GetTagData();
    }

    private void GetTagData() {
        RequestParams params = new RequestParams(URL);
        x.http().get(params, new org.xutils.common.Callback.CommonCallback<String>() {
            @Override
            public void onSuccess(String result) {
                try {
                    JSONObject obj = new JSONObject(result);
                    JSONArray jsonArray = obj.getJSONArray("data");
                    for (int i = 0; i < jsonArray.length(); i++) {
                        mMap = new HashMap<>();
                        mMap.put("tag_value", jsonArray.getJSONObject(i).getString("tag_value"));
                        mList.add(mMap);
                    }
                } catch (JSONException e) {
                    e.printStackTrace();
                }
            }

            @Override
            public void onError(Throwable ex, boolean isOnCallback) {

            }

            @Override
            public void onCancelled(CancelledException cex) {

            }

            @Override
            public void onFinished() {

            }
        });
    }
}

这里的网络请求我使用的是Xutils3

接下来我们使用RecyclerView来实现图中的效果
activity_tag_recy_view.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="match_parent"
    tools:context="com.ranlegeran.recyclerviewtest.TagRecyclerViewActivity">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recy_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v7.widget.RecyclerView>

</RelativeLayout>

同样我们为它提供一个item布局
tag_recy_view_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="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_item_tag"
        android:layout_width="80dp"
        android:layout_height="50dp"
        android:layout_gravity="center_horizontal"
        android:gravity="center"
        android:maxLines="1"
        android:text="金融"
        android:textSize="17sp" />

</LinearLayout>

然后是它的适配器部分TagRecyclerViewAdapter如下：

package com.ranlegeran.recyclerviewtest;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

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

/**
 * Created by RANLEGERAN on 2018/5/3.
 */

public class TagRecyclerViewAdapter extends RecyclerView.Adapter<TagRecyclerViewAdapter.ViewHolder> {
    private Context mContext;
    public List<Map<String,Object>> mList = new ArrayList<>();
    private LayoutInflater mLayoutInflater;

    public TagRecyclerViewAdapter(List<Map<String,Object>> list, Context context) {
        this.mList = list;
        this.mContext = context;
        mLayoutInflater = LayoutInflater.from(context);
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = mLayoutInflater.inflate(R.layout.tag_recy_view_item, null);
        ViewHolder holder = new ViewHolder(view);
        return holder;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        holder.mTextTag.setText(mList.get(position).get("tag_value").toString());
    }

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

    class ViewHolder extends RecyclerView.ViewHolder {
        TextView mTextTag;

        public ViewHolder(View itemView) {
            super(itemView);
            mTextTag = itemView.findViewById(R.id.text_item_tag);
        }
    }
}

接着是我们的Activity部分如下：

package com.ranlegeran.recyclerviewtest;

import android.os.Handler;
import android.os.Message;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;

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

import java.io.IOException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import okhttp3.Call;
import okhttp3.Callback;
import okhttp3.Response;

public class TagRecyclerViewActivity extends AppCompatActivity {
    private static final String URL = "http://www.renmaichina.com/api.php/Public/getIndustryTags";
    private RecyclerView mRecyclerView;
    private List<Map<String,Object>> mList = new ArrayList<>();
    private String mResult;

    public Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            switch (msg.what) {
                case 1:
                    TagRecyclerViewAdapter mAdapter = new TagRecyclerViewAdapter(mList, TagRecyclerViewActivity.this);
                    mRecyclerView.setAdapter(mAdapter);
                    break;
                default:
                    break;
            }
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_tag_recy_view);
        mRecyclerView = (RecyclerView) findViewById(R.id.recy_view);
        GridLayoutManager layoutManage = new GridLayoutManager(getApplicationContext(),4);
        mRecyclerView.setLayoutManager(layoutManage);
        GetTagData();
    }

    private void GetTagData() {
        OkHttpUtils.sendOkHttpRequest(URL, new Callback() {

            @Override
            public void onResponse(Call call, Response response) throws IOException {
                mResult = response.body().string();
                ToShowTagData(mResult);
            }

            @Override
            public void onFailure(Call call, IOException e) {

            }

        });
    }

    private void ToShowTagData(String result) {
        try {
            JSONObject obj = new JSONObject(result);
            JSONArray jsonArray = obj.getJSONArray("data");
            for (int i = 0; i < jsonArray.length(); i++) {
                obj = jsonArray.getJSONObject(i);
                Map<String,Object> map = new HashMap<>();
                String tag_value = obj.getString("tag_value");
                map.put("tag_value", tag_value);
                mList.add(map);
            }
            Message msg = new Message();
            msg.what = 1;
            handler.sendMessage(msg);
        } catch (JSONException e) {
            e.printStackTrace();
        }
    }
}

我们使用了GridView和RecyclerView实现了同样的效果，运行一下吧。