android 项目学习随笔十七（ListViewGridView显示组图）

Posted 2020-08-19 ecollab

ListView、GridView显示组图，处理机制相同

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="10dp"
        android:background="@drawable/pic_list_item_bg"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/iv_icon"
            android:layout_width="match_parent"
            android:layout_height="160dp"
            android:scaleType="centerCrop"
            android:src="@drawable/news_pic_default" />

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="8dp"
            android:singleLine="true"
            android:text="标题"
            android:textColor="#000"
            android:textSize="18sp" />
    </LinearLayout>

</LinearLayout>

list_item_photo.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" >

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <ListView
            android:id="@+id/lv_list"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:cacheColorHint="#fff"
            android:divider="@null" >
        </ListView>

        <GridView
            android:id="@+id/gv_list"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:numColumns="2"
            android:visibility="gone" >
        </GridView>
    </FrameLayout>

</LinearLayout>

pager_menu_detail_photo.xml

import java.util.ArrayList;

/**
 * 组图对象封装
 * 
 */
public class PhotoBean {
    public int retcode;
    public PhotoData data;

    public class PhotoData {
        public ArrayList<PhotoNewsData> news;
    }

    public class PhotoNewsData {
        public String id;
        public String listimage;
        public String pubdate;
        public String title;
        public String url;
    }
}

PhotoBean

import java.util.ArrayList;

import android.app.Activity;
import android.text.TextUtils;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;

import com.google.gson.Gson;
import com.itheima.zhsh66.R;
import com.itheima.zhsh66.base.BaseMenuDetailPager;
import com.itheima.zhsh66.domain.PhotoBean;
import com.itheima.zhsh66.domain.PhotoBean.PhotoNewsData;
import com.itheima.zhsh66.global.Constants;
import com.itheima.zhsh66.utils.CacheUtils;
import com.lidroid.xutils.BitmapUtils;
import com.lidroid.xutils.HttpUtils;
import com.lidroid.xutils.ViewUtils;
import com.lidroid.xutils.exception.HttpException;
import com.lidroid.xutils.http.ResponseInfo;
import com.lidroid.xutils.http.callback.RequestCallBack;
import com.lidroid.xutils.http.client.HttpRequest.HttpMethod;
import com.lidroid.xutils.view.annotation.ViewInject;

/**
 * 菜单详情页-组图
 * 
 */
public class PhotosMenuDetailPager extends BaseMenuDetailPager implements
        OnClickListener {

    @ViewInject(R.id.lv_list)
    private ListView lvList;
    @ViewInject(R.id.gv_list)
    private GridView gvList;

    private ArrayList<PhotoNewsData> mPhotoList;

    private boolean isList = true;// 当前界面状态

    private ImageButton btnDisplay;

    public PhotosMenuDetailPager(Activity activity, ImageButton btnDisplay) {
        super(activity);
        this.btnDisplay = btnDisplay;
        btnDisplay.setOnClickListener(this);
    }

    @Override
    public View initView() {
        View view = View.inflate(mActivity, R.layout.pager_menu_detail_photo,
                null);
        ViewUtils.inject(this, view);
        return view;
    }

    @Override
    public void initData() {
        String cache = CacheUtils.getCache(Constants.PHOTOS_URL, mActivity);
        if (!TextUtils.isEmpty(cache)) {
            processResult(cache);
        }

        getDataFromServer();
    }

    private void getDataFromServer() {
        HttpUtils utils = new HttpUtils();
        utils.send(HttpMethod.GET, Constants.PHOTOS_URL,
                new RequestCallBack<String>() {

                    @Override
                    public void onSuccess(ResponseInfo<String> responseInfo) {
                        processResult(responseInfo.result);

                        CacheUtils.setCache(Constants.PHOTOS_URL,
                                responseInfo.result, mActivity);
                    }

                    @Override
                    public void onFailure(HttpException error, String msg) {
                        error.printStackTrace();
                        Toast.makeText(mActivity, msg, Toast.LENGTH_SHORT)
                                .show();
                    }
                });
    }

    protected void processResult(String result) {
        Gson gson = new Gson();
        PhotoBean photoBean = gson.fromJson(result, PhotoBean.class);
        mPhotoList = photoBean.data.news;

        lvList.setAdapter(new PhotoAdapter());
        gvList.setAdapter(new PhotoAdapter());
    }

    class PhotoAdapter extends BaseAdapter {

        private BitmapUtils mBitmapUtils;

        public PhotoAdapter() {
            mBitmapUtils = new BitmapUtils(mActivity);
            mBitmapUtils.configDefaultLoadingImage(R.drawable.news_pic_default);
        }

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

        @Override
        public PhotoNewsData getItem(int position) {
            return mPhotoList.get(position);
        }

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

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ViewHolder holder = null;
            if (convertView == null) {
                convertView = View.inflate(mActivity, R.layout.list_item_photo,
                        null);
                holder = new ViewHolder();
                holder.tvTitle = (TextView) convertView
                        .findViewById(R.id.tv_title);
                holder.ivIcon = (ImageView) convertView
                        .findViewById(R.id.iv_icon);

                convertView.setTag(holder);
            } else {
                holder = (ViewHolder) convertView.getTag();
            }

            PhotoNewsData item = getItem(position);

            holder.tvTitle.setText(item.title);
            mBitmapUtils.display(holder.ivIcon, item.listimage);

            return convertView;
        }

    }

    static class ViewHolder {
        public TextView tvTitle;
        public ImageView ivIcon;
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
        case R.id.btn_display:
            // 如果当前是列表, 要切换成grid, 如果是grid,就切换成列表
            if (isList) {
                isList = false;

                lvList.setVisibility(View.GONE);
                gvList.setVisibility(View.VISIBLE);

                btnDisplay.setImageResource(R.drawable.icon_pic_list_type);
            } else {
                isList = true;

                lvList.setVisibility(View.VISIBLE);
                gvList.setVisibility(View.GONE);

                btnDisplay.setImageResource(R.drawable.icon_pic_grid_type);
            }

            break;

        default:
            break;
        }
    }
}

PhotosMenuDetailPager

共用一个Adapter

protected void processResult(String result) {
Gson gson = new Gson();
PhotoBean photoBean = gson.fromJson(result, PhotoBean.class);
mPhotoList = photoBean.data.news;

lvList.setAdapter(new PhotoAdapter());
gvList.setAdapter(new PhotoAdapter());
}

缓存到本地

public void initData() {
String cache = CacheUtils.getCache(Constants.PHOTOS_URL, mActivity);
if (!TextUtils.isEmpty(cache)) {
processResult(cache);
}

getDataFromServer();
}

------------------------------------------------------------------------------

初始化标题按钮（Base ）

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

    <include layout="@layout/title_bar" />

    <FrameLayout
        android:id="@+id/fl_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </FrameLayout>

</LinearLayout>

View Code

import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.FrameLayout;
import android.widget.ImageButton;
import android.widget.TextView;

import com.itheima.zhsh66.MainActivity;
import com.itheima.zhsh66.R;
import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;

/**
 * 五个标签页的基类
 * 
 */
public abstract class BasePager {

    public Activity mActivity;

    // 标签页面的根布局
    public View mRootView;

    public TextView tvTitle;
    public ImageButton btnMenu;
    // 帧布局容器, 将来要动态向里面添加内容
    public FrameLayout flContent;

    // 组图切换按钮
    public ImageButton btnDisplay;

    public BasePager(Activity activity) {
        mActivity = activity;
        initView();
    }

    /**
     * 初始化布局
     */
    public void initView() {
        mRootView = View.inflate(mActivity, R.layout.base_pager, null);
        tvTitle = (TextView) mRootView.findViewById(R.id.tv_title);
        btnMenu = (ImageButton) mRootView.findViewById(R.id.btn_menu);
        flContent = (FrameLayout) mRootView.findViewById(R.id.fl_content);
        btnDisplay = (ImageButton) mRootView.findViewById(R.id.btn_display);

        btnMenu.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                toggle();
            }
        });
    }

    /**
     * 侧边栏展开或者收起的方法
     */
    private void toggle() {
        MainActivity mainUI = (MainActivity) mActivity;
        SlidingMenu slidingMenu = mainUI.getSlidingMenu();
        slidingMenu.toggle();// 开关(如果状态为开,它就关;如果状态为关,它就开)
    }

    /**
     * 初始化数据
     */
    public abstract void initData();
}

BasePager

------------------------------------------------------------------------------

对按钮的传递、调用

if (pager instanceof PhotosMenuDetailPager) {

import java.util.ArrayList;

import android.app.Activity;
import android.text.TextUtils;
import android.view.View;
import android.widget.Toast;

import com.google.gson.Gson;
import com.itheima.zhsh66.MainActivity;
import com.itheima.zhsh66.base.BaseMenuDetailPager;
import com.itheima.zhsh66.base.BasePager;
import com.itheima.zhsh66.base.impl.menudetail.InteractMenuDetailPager;
import com.itheima.zhsh66.base.impl.menudetail.NewsMenuDetailPager;
import com.itheima.zhsh66.base.impl.menudetail.PhotosMenuDetailPager;
import com.itheima.zhsh66.base.impl.menudetail.TopicMenuDetailPager;
import com.itheima.zhsh66.domain.NewsMenuData;
import com.itheima.zhsh66.global.Constants;
import com.itheima.zhsh66.utils.CacheUtils;
import com.lidroid.xutils.HttpUtils;
import com.lidroid.xutils.exception.HttpException;
import com.lidroid.xutils.http.ResponseInfo;
import com.lidroid.xutils.http.callback.RequestCallBack;
import com.lidroid.xutils.http.client.HttpRequest.HttpMethod;

/**
 * 新闻中心
 * 
 */
public class NewsCenterPager extends BasePager {

    // 菜单详情页集合
    private ArrayList<BaseMenuDetailPager> mMenuDetailPagers;
    private NewsMenuData mNewsMenuData;// 新闻分类信息网络数据

    public NewsCenterPager(Activity activity) {
        super(activity);
    }

    @Override
    public void initData() {
        System.out.println("新闻中心初始化...");
        tvTitle.setText("新闻");

        // 1.首先先看本地有没有缓存
        // 2.有缓存,直接加载缓存
        String cache = CacheUtils.getCache(Constants.CATEGORIES_URL, mActivity);
        if (!TextUtils.isEmpty(cache)) {
            // 有缓存
            System.out.println("发现缓存....");
            processResult(cache);
        }

        // 即使发现有缓存,仍继续调用网络, 获取最新数据
        getDataFromServer();
    }

    /**
     * 从服务器获取数据 需要权限: <uses-permission
     * android:name="android.permission.INTERNET"/>
     */
    private void getDataFromServer() {
        HttpUtils utils = new HttpUtils();
        utils.send(HttpMethod.GET, Constants.CATEGORIES_URL,
                new RequestCallBack<String>() {

                    @Override
                    public void onSuccess(ResponseInfo<String> responseInfo) {
                        // 请求成功
                        String result = responseInfo.result;// 获取json字符串
                        // System.out.println("result:" + result);
                        processResult(result);
                        // 写缓存
                        CacheUtils.setCache(Constants.CATEGORIES_URL, result,
                                mActivity);
                    }

                    @Override
                    public void onFailure(HttpException error, String msg) {
                        // 请求失败
                        error.printStackTrace();
                        Toast.makeText(mActivity, msg, Toast.LENGTH_SHORT)
                                .show();
                    }
                });
    }

    /**
     * 解析json数据
     * 
     * @param result
     */
    protected void processResult(String result) {
        // gson->json
        Gson gson = new Gson();
        mNewsMenuData = gson.fromJson(result, NewsMenuData.class);
        System.out.println("解析结果:" + mNewsMenuData);

        // 获取侧边栏对象
        MainActivity mainUI = (MainActivity) mActivity;
        LeftMenuFragment leftMenuFragment = mainUI.getLeftMenuFragment();
        // 将网络数据设置给侧边栏
        leftMenuFragment.setData(mNewsMenuData.data);

        // 初始化4个菜单详情页
        mMenuDetailPagers = new ArrayList<BaseMenuDetailPager>();
        mMenuDetailPagers.add(new NewsMenuDetailPager(mActivity,
                mNewsMenuData.data.get(0).children));
        mMenuDetailPagers.add(new TopicMenuDetailPager(mActivity));
        mMenuDetailPagers.add(new PhotosMenuDetailPager(mActivity, btnDisplay));
        mMenuDetailPagers.add(new InteractMenuDetailPager(mActivity));

        // 菜单详情页-新闻作为初始页面
        setCurrentMenuDetailPager(0);
    }

    // 给新闻中心页面的FrameLayout填充布局
    protected void setCurrentMenuDetailPager(int position) {
        BaseMenuDetailPager pager = mMenuDetailPagers.get(position);
        // 移除之前所有的view对象, 清理屏幕
        flContent.removeAllViews();
        flContent.addView(pager.mRootView);
        pager.initData();// 初始化数据

        // 更改标题
        tvTitle.setText(mNewsMenuData.data.get(position).title);

        // 组图页面需要显示切换按钮
        if (pager instanceof PhotosMenuDetailPager) {
            btnDisplay.setVisibility(View.VISIBLE);
        } else {
            btnDisplay.setVisibility(View.GONE);
        }
    }

}

NewsCenterPager