Doesn't show the image on imageview in horizontal listview

Question

I tried to implement the Horizontal ListView. In this activity, I have one ImageView and one Horizontal ListView. If I select any image from this horizontal ListView, that image will show above the Horizontal ListView. By default, the first image is showing on that ImageView. Here the image is not showing on ImageView:

String  Imagefile ="http://www.example.com/wp-content/uploads/2014/10/Screenshot_2014-10-07-11-52-52-1412678971.png";
selectedImage = (ImageView) findViewById(R.id.imageView1);
imageLoader=new ImageLoader(DetailPage.this.getApplicationContext());
imageLoader.DisplayImage(Imagefile, selectedImage);

Now the image is showing well on ImageView. But if I tried to set dynamic image, the image is not showing on the ImageView.

 GalleryImageAdapter adapter = new GalleryImageAdapter(DetailPage.this, categories);
 gallery.setAdapter(adapter);
 String  Imagefile =categories[0].toString();
 selectedImage = (ImageView) findViewById(R.id.imageView1);
 //imageLoader=new ImageLoader(DetailPage.this.getApplicationContext());
 //imageLoader.DisplayImage(Imagefile, selectedImage);
 gallery.setOnItemClickListener(new OnItemClickListener() {
 public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
 System.out.println("Selected-Image"+" "+categories[position].toString());
  //imageLoader=new ImageLoader(DetailImage.this.getApplicationContext());
  // imageLoader.DisplayImage(categories[position].toString(), selectedImage);

            }
        });  
        }
      class GalleryImageAdapter extends ArrayAdapter<String>
     {
     private final Context context;
      private final String[] categories;
      public ImageLoader imageLoader; 
      public GalleryImageAdapter(Context context, String[] categories) {
        super(context, R.layout.rowlayout, categories);
        this.context = context;
        this.categories = categories;
        imageLoader=new ImageLoader(context.getApplicationContext());
      }

      @Override
      public View getView(int position, View convertView, ViewGroup parent) {
        LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View i = inflater.inflate(R.layout.rowlayout, parent, false);
        ImageView imageView = (ImageView) i.findViewById(R.id.icon);
       // imageLoader=new ImageLoader(context.getApplicationContext());
        imageLoader.DisplayImage(categories[position], imageView);
        System.out.println("Image"+" "+categories[position]);
        return i;
    }
   }       

But I am getting the url on logcat:

10-07 16:46:35.559: I/System.out(1105): default-Image "http://www.example.com/wp-content/uploads/2014/10/Screenshot_2014-10-07-11-52-52-1412678971.png"
10-07 17:22:50.009: I/System.out(3607): Image http://example.com/wp-content/uploads/2014/10/Screenshot_2014-10-07-11-52-52-1412678971.png

What is wrong in my code ?

EDIT:

Yes, I have changed my code like :

      GalleryImageAdapter adapter = new GalleryImageAdapter(DetailImage.this, R.layout.rowlayout,categories);

      class GalleryImageAdapter extends ArrayAdapter<String>
      {
      private final Context context;
      private final String[] categories;
      public ImageLoader imageLoader;
      private int resourceId; 
      public GalleryImageAdapter(Context context, int resourceId,String[] categories) {
        super(context, R.layout.rowlayout, categories);
        this.context = context;
        this.resourceId = resourceId;
        this.categories = categories;
        imageLoader=new ImageLoader(context.getApplicationContext());
      }

      @Override
      public View getView(int position, View convertView, ViewGroup parent) {
        LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View i = inflater.inflate(resourceId, parent, false);

But still now doesn't showing the image on ImageView. Please verify it.

EDIT:

I need exact output with dynamic data like below tutorial :

http://www.learn-android-easily.com/2013/07/android-gallery-view-example.html

Answer 1

Here is the code modified which is working fine for me Since i dont know which imageloader you have used i used universal image loader and with a simple list view.

public class MainActivity extends ActionBarActivity {
ImageView selectedImage;

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

    ListView gallery;
    gallery = (ListView) findViewById(R.id.lv_horiz);
    final String[] categories;
    ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(
            getApplicationContext()).build();
    ImageLoader.getInstance().init(config);
    categories = getResources().getStringArray(R.array.images);
    GalleryImageAdapter adapter = new GalleryImageAdapter(
            getApplicationContext(), getResources().getStringArray(
                    R.array.images));
    gallery.setAdapter(adapter);        
    selectedImage = (ImageView) findViewById(R.id.image);
    gallery.setOnItemClickListener(new OnItemClickListener() {
        public void onItemClick(AdapterView<?> parent, View v,
                int position, long id) {
            System.out.println("Selected-Image" + " "
                    + categories[position].toString());
            ImageLoader.getInstance().displayImage(
                    categories[position].toString(), selectedImage);

        }
    });
}

}

Class for adapter:

class GalleryImageAdapter extends ArrayAdapter<String> {
private final Context context;
private final String[] categories;
public ImageLoader imageLoader;

public GalleryImageAdapter(Context context, String[] categories) {
    super(context, R.layout.rowlayout, categories);
    this.context = context;
    this.categories = categories;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);     
    View i = inflater.inflate(R.layout.rowlayout, parent, false);
    ImageView imginlist = (ImageView) i.findViewById(R.id.iv_inlist);
    TextView text = (TextView) i.findViewById(R.id.tv_name);
    ImageLoader.getInstance().displayImage(categories[position], imginlist);
    System.out.println("Image" + " " + categories[position]);
    return i;
}

}

Note: This only changes the image at the top when you click on the listview image(the image inside the listview) if you want to change the image when the image itself viewed from the listview just declare a static method inside the activity and call it from the adapter getview. PS PM me if u need the sample prjoect as Zip.