GridView实现图片加载

一、简单写法

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

    <GridView
        android:id="@+id/gridview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnWidth="90dp"
        android:numColumns="auto_fit"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        android:stretchMode="columnWidth"
        android:gravity="center"
        ></GridView>

</LinearLayout>

ExampleActivity.java

package com.administrator.gridviewdemo;


import android.app.Activity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.GridView;

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

/**
 * GridView展示文字
 */

public class ExampleActivity extends Activity {

    private GridView gridView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_example);
        gridView= (GridView) findViewById(R.id.gridview);
        List<String> strList=new ArrayList<String>();
        for(int i=0;i<9;i++)
        {
            strList.add("haha"+i);
        }
        //最简单的适配器，数组适配器
        ArrayAdapter<String>arrayAdapter=new ArrayAdapter<String>(this,android.R.layout.simple_expandable_list_item_1,strList);
        gridView.setAdapter(arrayAdapter);
    }
}

二、用GridView展示已安装的应用

(一)、首先需要GridView展示的单条条目布局：

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

    <ImageView
        android:id="@+id/img_appIcon"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:scaleType="centerCrop"/>
    <TextView
        android:id="@+id/tv_appName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:text="测试"
        android:layout_marginTop="5dp"/>
</LinearLayout>

(二)、然后需要把在主要引用的页面中，创建GridView用于加载条目的布局位置

activity_example2.xml

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

    <GridView
        android:id="@+id/gridview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnWidth="90dp"
        android:numColumns="3"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        android:stretchMode="columnWidth"
        android:gravity="center"
        />

</LinearLayout>

(三)、需要为GridView增加用于接收数据的实体类

AppInfo.class

package com.administrator.gridviewdemo;

import android.graphics.drawable.Drawable;

/**
 * Created by Administrator on 2018/5/11.
 */

public class AppInfo {
    /**
     * 应用名称
     */
    private String appName;
    /**
     * 应用包名
     */
    private String pacjageName;
    /**
     * 版本名称
     */
    private String versionName;
    /**
     * 版本号
     */
    private int versionCode;
    /**
     * 应用图标
     */
    private Drawable appIcon;

    public String getAppName() {
        return appName;
    }

    public void setAppName(String appName) {
        this.appName = appName;
    }

    public String getPacjageName() {
        return pacjageName;
    }

    public void setPacjageName(String pacjageName) {
        this.pacjageName = pacjageName;
    }

    public String getVersionName() {
        return versionName;
    }

    public void setVersionName(String versionName) {
        this.versionName = versionName;
    }

    public int getVersionCode() {
        return versionCode;
    }

    public void setVersionCode(int versionCode) {
        this.versionCode = versionCode;
    }

    public Drawable getAppIcon() {
        return appIcon;
    }

    public void setAppIcon(Drawable appIcon) {
        this.appIcon = appIcon;
    }
}

(四)、设置GridView的适配器

GridViewAdapter.java

package com.administrator.gridviewdemo;

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

import java.util.List;

/**
 * Created by Administrator on 2018/5/11.
 */

public class GridViewAdapter extends BaseAdapter {

    private Context context;
    private List<AppInfo>appInfoList;
    public GridViewAdapter(Context context, List<AppInfo> appInfoList)
    {
        this.appInfoList=appInfoList;
        this.context=context;
    }

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

    @Override
    public Object getItem(int position) {
        return appInfoList.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=View.inflate(context, R.layout.item_grid_view,null);
            holder=new ViewHolder();
            holder.img_appIcon= (ImageView) convertView.findViewById(R.id.img_appIcon);
            holder.tv_appName= (TextView) convertView.findViewById(R.id.tv_appName);
            convertView.setTag(holder);
        } else {
            holder= (ViewHolder) convertView.getTag();
        }

        AppInfo appInfo=appInfoList.get(position);
        holder.img_appIcon.setImageDrawable(appInfo.getAppIcon());
        holder.tv_appName.setText(appInfo.getAppName()+" "+appInfo.getVersionName());

        return convertView;
    }

    public class ViewHolder
    {
        ImageView img_appIcon;
        TextView tv_appName;
    }
}

(五)、创建的函数中调用

ExampleActivity2.java

package com.administrator.gridviewdemo;

import android.content.pm.PackageInfo;
import android.content.pm.PackageManager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.GridView;

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

/**
 * 获取应用列表展示
 */
public class ExampleActivity2 extends AppCompatActivity {

    private GridView gridView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_example2);
        gridView = (GridView)findViewById(R.id.gridview);
        GridViewAdapter gridViewAdapter = new GridViewAdapter(this,getAppList());
        gridView.setAdapter(gridViewAdapter);
    }
    public List<AppInfo> getAppList() {
        List<AppInfo> appInfoList = new ArrayList<AppInfo>();
        PackageManager packageManager = getPackageManager();
        List<PackageInfo> installedPackages = packageManager.getInstalledPackages(0);
        for (int i = 0; i < installedPackages.size(); i++) {
            PackageInfo packageInfo = installedPackages.get(i);
            AppInfo appInfo = new AppInfo();
            appInfo.setAppName(packageInfo.applicationInfo.loadLabel(packageManager).toString());
            appInfo.setAppIcon(packageInfo.applicationInfo.loadIcon(packageManager));
            appInfo.setPacjageName(packageInfo.packageName);
            appInfo.setVersionCode(packageInfo.versionCode);
            appInfo.setVersionName(packageInfo.versionName);

//            if ((packageInfo.applicationInfo.flags& ApplicationInfo.FLAG_SYSTEM)==0) {//过滤系统应用的判断
            appInfoList.add(appInfo);
//            }
        }
        return appInfoList;
    }
}

三、用GridView加载网络图片

(一)、添加依赖

build.gradle

dependencies {
    compile 'com.github.bumptech.glide:glide:3.7.0'
}

点击右上角Sync Now

(二)、首先需要GridView展示的单条条目布局：

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

    <ImageView
        android:id="@+id/img_appIcon"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:scaleType="centerCrop"/>
    <TextView
        android:id="@+id/tv_appName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:text="测试"
        android:layout_marginTop="5dp"/>
</LinearLayout>

(三)、然后需要把在主要引用的页面中，创建GridView用于加载条目的布局位置

activity_example.xml

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

    <GridView
        android:id="@+id/gridview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnWidth="90dp"
        android:numColumns="3"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        android:stretchMode="columnWidth"
        android:gravity="center"
        />


</LinearLayout>

(四)、需要为GridView增加用于接收数据的实体类

ImageInfo.java

package com.administrator.gridviewdemo;

import android.graphics.Bitmap;

/**
 * Created by Administrator on 2018/5/11.
 */

public class ImageInfo {
    private String imagePath;
    private Bitmap bitmap;
    private String text;

    public String getText() {
        return text;
    }

    public void setText(String text) {
        this.text = text;
    }

    public String getImagePath() {
        return imagePath;
    }

    public void setImagePath(String imagePath) {
        this.imagePath = imagePath;
    }

    public Bitmap getBitmap() {
        return bitmap;
    }

    public void setBitmap(Bitmap bitmap) {
        this.bitmap = bitmap;
    }
}

(五)、设置GridView的适配器

GridViewAdapter.java

package com.administrator.gridviewdemo;

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

import com.bumptech.glide.Glide;

import java.util.List;

/**
 * Created by Administrator on 2018/5/11.
 */

public class GridViewAdapter extends BaseAdapter {

    private Context context;
    private List<ImageInfo>imageInfoList;
    public GridViewAdapter(Context context, List<ImageInfo> appImageInfoList)
    {
        this.imageInfoList=appImageInfoList;
        this.context=context;
    }

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

    @Override
    public Object getItem(int position) {
        return imageInfoList.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=View.inflate(context, R.layout.item_grid_view,null);
            holder=new ViewHolder();
            holder.imageView= (ImageView) convertView.findViewById(R.id.img_appIcon);
            holder.textView= (TextView) convertView.findViewById(R.id.tv_appName);
            convertView.setTag(holder);
        } else {
            holder= (ViewHolder) convertView.getTag();
        }

        ImageInfo imageInfo=imageInfoList.get(position);

        //placeholder()是图片的占位符，网络还没下载下来的时候占着位置
        //centerCrop()缓存
        Glide.with(context).load(imageInfo.getImagePath()).placeholder(R.mipmap.ic_launcher).centerCrop().into(holder.imageView);

//        /**
//         * 加载图片
//         */
//        if(imageInfo.getBitmap()==null){//如果网络还没下载好
//            holder.imageView.setImageResource(R.mipmap.ic_launcher);
//        }else {
//            holder.imageView.setImageBitmap(imageInfo.getBitmap());
//        }
        holder.textView.setText(imageInfo.getText());

        return convertView;
    }

    public class ViewHolder
    {
        ImageView imageView;
        TextView textView;
    }
}

(六)创建的函数中调用

ExampleActivity.java

package com.administrator.gridviewdemo;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.AsyncTask;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.GridView;

import java.io.IOException;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.ArrayList;
import java.util.List;

public class ExampleActivity extends AppCompatActivity {

    private GridViewAdapter gridAdpter;
    private GridView gridView;
    private List<String> imgList;
    private List<ImageInfo> imageInfoList;
    private ImageLoadTask imageLoadTask;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_example);
        initUi();
        initData();
    }

    private void initData() {
        imgList=new ArrayList<String>();
        imgList.add("http://img5.duitang.com/uploads/item/201406/26/20140626164837_dzKds.jpeg");
        imgList.add("http://img2.imgtn.bdimg.com/it/u=3980629563,3881837630&fm=21&gp=0.jpg");
        imgList.add("http://img5q.duitang.com/uploads/item/201505/08/20150508155052_XJaNW.jpeg");
        imgList.add("http://img4.duitang.com/uploads/item/201407/02/20140702105736_FdN5P.jpeg");
        imgList.add("http://img2.imgtn.bdimg.com/it/u=2866652161,3841912673&fm=21&gp=0.jpg");
        imgList.add("http://img4.imgtn.bdimg.com/it/u=883757693,2063816225&fm=21&gp=0.jpg");
        imgList.add("http://cdn.duitang.com/uploads/item/201309/26/20130926110955_QtUdX.jpeg");
        imgList.add("http://zjimg.5054399.com/allimg/160815/14_160815161625_9.jpg");
        imgList.add("http://i-7.vcimg.com/trim/09ce7067d2467c54cf05bbd271ee3ec8430415/trim.jpg");

        imageInfoList = new ArrayList<ImageInfo>();
        for(int i = 0;i<9;i++){
            ImageInfo imageInfo = new ImageInfo();
            imageInfo.setImagePath(imgList.get(i));
            imageInfo.setText("图片"+);
            imageInfoList.add(imageInfo);
        }
        gridAdpter = new GridViewAdapter(this,imageInfoList);
        gridView.setAdapter(gridAdpter);
//        imageLoadTask = new ImageLoadTask(this,gridAdpter);
//        imageLoadTask.execute();//启动
    }

    private void initUi() {
        gridView = (GridView)findViewById(R.id.gridview);
    }
    public Bitmap getImagefromNetWork(String path){
        try {
            URL url = new URL(path);i
            HttpURLConnection urlConnection = (HttpURLConnection) url.openConnection();
            urlConnection.setDoInput(true);
            urlConnection.setConnectTimeout(10*1000);
            urlConnection.connect();
            InputStream inputStream = urlConnection.getInputStream();

            Bitmap bitmap = BitmapFactory.decodeStream(inputStream);
            inputStream.close();
            return bitmap;
        } catch (MalformedURLException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        }
        return null;
    }
    public class ImageLoadTask extends AsyncTask<String,Void,Void>{

        private GridViewAdapter gridViewAdapter;
        public ImageLoadTask(Context context,GridViewAdapter gridViewAdapter){
            this.gridViewAdapter=gridViewAdapter;
        }
        @Override
        protected void onPreExecute() {
            super.onPreExecute();
        }

        @Override
        protected Void doInBackground(String... strings) {
            for (int i = 0;i<gridViewAdapter.getCount();i++){
                ImageInfo imageInfo = (ImageInfo) gridViewAdapter.getItem(i);
                String imagePath = imageInfo.getImagePath();
                Bitmap bitmap = getImagefromNetWork(imagePath);
                imageInfo.setBitmap(bitmap);
                publishProgress();
            }
            return null;
        }

        @Override
        protected void onProgressUpdate(Void... values) {
            super.onProgressUpdate(values);
            gridViewAdapter.notifyDataSetChanged();
        }

    }
}