将图像从URL加载到gridview中

时间:2016-07-08 12:15:01

标签: java android gridview

我有一个gridview,它应该包含一个图像和它下面的文本。我正在使用Picasso来加载图像,但是当我运行应用程序时,图像视图中没有任何内容! 下面是我的MainActivity.java代码:

import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.GridView;
import android.widget.ImageView;
import com.squareup.picasso.Picasso;

import java.util.ArrayList;
import java.util.Arrays;

public class MainActivity extends AppCompatActivity {
    GridView gv;
    Context context;
    ArrayList prgmName;
    public static String [] prgmNameList={"C++","VB.NET","JAVA", "JavaScript", "MySQL", "PHP"};
    public static String [] prgmImgFiles = {"cpp.png", "vb.net.png", "java.png", "js.png", "mysql.png", "php.png"};
    public static Integer [] prgmImages={R.mipmap.img_0, R.mipmap.img_1, R.mipmap.img_2};
    public ArrayList<String> arrayList = new ArrayList<String>(Arrays.asList(prgmNameList));
    public ArrayList<Integer> arrayList2 = new ArrayList<Integer>(Arrays.asList(prgmImages));
    public ArrayList<String> arrayList3 = new ArrayList<String>(Arrays.asList(prgmImgFiles));
    public static GridViewAdapter gvd;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


    }

    public void onLoadClick(View v)
    {
        gv=(GridView) findViewById(R.id.gridView2);
        gvd = new GridViewAdapter(this, arrayList, arrayList3);
        gv.setAdapter(gvd);

        ImageView iv2 = (ImageView)findViewById(R.id.imageViewTest);

        // addItem("JavaScript", "http://10.0.2.2/picgal/images/js.png");
        Picasso.with(this).load("http://10.0.2.2/picgal/images/java.png").into(iv2);
    }

    public void addItem(String txt, String ImgID)
    {
        arrayList.add(txt);
        arrayList3.add(ImgID);
        gvd.notifyDataSetChanged();
    }

}

下面是我的GridViewAdapter.java代码:

import android.content.Context;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import com.squareup.picasso.Picasso;
import java.util.ArrayList;

/**
 * Created by ITM on 7/4/2016.
 */
public class GridViewAdapter extends BaseAdapter {
    ArrayList<String> result;
    Context context;
    ArrayList<String> imageId;
    private static LayoutInflater inflater=null;
    public static final String server = "http://10.0.2.2/picgal/images/";
    public Holder holder=new Holder();

    public GridViewAdapter(MainActivity mainActivity, ArrayList<String> prgmNameList, ArrayList<String> prgmImages) {
        // TODO Auto-generated constructor stub
        result=prgmNameList;
        context=mainActivity;
        imageId=prgmImages;
        inflater = ( LayoutInflater )context.
                getSystemService(Context.LAYOUT_INFLATER_SERVICE);

    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return result.size();
    }

    @Override
    public Object getItem(int position) {
        // TODO Auto-generated method stub
        return position;
    }

    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return position;
    }

    public class Holder
    {
        public TextView tv;
        public ImageView img;
    }
    @Override
    public View getView(final int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub
        View rowView;

        rowView = inflater.inflate(R.layout.img_layout, null);
        holder.tv=(TextView) rowView.findViewById(R.id.txt);
        holder.img=(ImageView) rowView.findViewById(R.id.img);

        holder.tv.setText(result.get(position));
        Log.i("getView", imageId.get(position));
        Picasso.with(context).load(imageId.get(position)).into(holder.img);

        // holder.img.setImageResource(imageId.get(position));

        rowView.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                Toast.makeText(context, "You Clicked " + result.get(position) +"\n"+getCount(), Toast.LENGTH_LONG).show();
            }
        });

        return rowView;
    }
}

activity_main.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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.badihbarakat.gridviewapp.MainActivity">

    <GridView
        android:layout_width="wrap_content"
        android:layout_height="250dp"
        android:id="@+id/gridView2"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:background="#ffe5e5"
        android:columnWidth="100dp"
        android:drawSelectorOnTop="true"
        android:gravity="center"
        android:numColumns="auto_fit"
        android:stretchMode="spacingWidthUniform"
        android:verticalSpacing="5dp"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:layout_marginTop="5dp"
        android:scrollIndicators="left" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Load"
        android:id="@+id/btnLoad"
        android:layout_below="@+id/gridView2"
        android:layout_centerHorizontal="true"
        android:onClick="onLoadClick" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageViewTest"
        android:layout_below="@+id/btnLoad"
        android:layout_centerHorizontal="true" />

</RelativeLayout>

img_layout.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="100dp"
        android:layout_height="100dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true">

        <ImageView
            android:id="@+id/img"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/frame" />

    </FrameLayout>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/txt"
        android:textAlignment="center"/>

</LinearLayout>

我在按钮下面添加了一个测试ImageView来测试Picasso对象的工作情况。它工作正常。请任何人帮忙。 感谢

3 个答案:

答案 0 :(得分:0)

我用过的最好的,ImageLoader Library

  

https://github.com/nostra13/Android-Universal-Image-Loader

ImageLoader imageLoader = ImageLoader.getInstance();
imageLoader.displayImage(imageUri, imageView);

答案 1 :(得分:0)

1.您在gridView的构造函数中传递了错误的参数。

  gvd = new GridViewAdapter(this, arrayList, arrayList3);

应该是

  gvd = new GridViewAdapter(this, arrayList, arrayList2);

如您的代码中所述,arrayList2由图像组成。

2.在适配器中,更改构造函数中的第二个参数:

 from ArrayList<String> to ArrayList<Integer>

 public GridViewAdapter(MainActivity mainActivity, ArrayList<String> prgmNameList, ArrayList<Integer> prgmImages) {
    //...

}

在此之后,尝试将其传递给毕加索。

新: 您可以尝试以下代码:

      //server url
      String imageURL = ""
     //array of images passed in constructor to append with url
      String arrayOfImages[] = imageId;                                                                                                               
      String completeImageURL = server + arrayOfImages[position];
                Picasso.with(context)
                        .load(completeImageURL)
                        .into(holder.img);

答案 2 :(得分:0)

感谢所有协助此问题的人。 实际上,在修改毕加索代码后,我发现图像文件的路径丢失了! 我所说的是:

Picasso.with(context).load(imageId.get(position)).into(holder.img);

由于imageId.get(position)仅包含文件名而不包含服务器上的完整路径,因此Picasso无法找到该文件! 正确的代码是:

Picasso.with(context).load(server+imageId.get(position)).into(holder.img);

其中server是包含images文件夹的完整路径的String。 再次感谢大家。