GalleryView avec bouton croisé

Question

J'ai utilisé Universal Image Loader.
I Implémentation réussie de l'UIL.
J'étais capable de sélectionner une image puis de la mettre dans la vue de la galerie.
La galerie a un OnClickListener lorsque l'onCLick l'image sera supprimée.
Mon problème est que je veux que l'image ait un bouton Croix au-dessus de l'image.
Je ai essayé de changer la mise en page, mais pas de chance ..
Je voulais que ça ressemble à ceci.

Voici mon activité ..

package com.thesis.juandirection.juandirectionfinale.fragments; 



import android.content.Context; 
import android.content.Intent; 
import android.graphics.Bitmap; 
import android.os.Bundle; 
import android.support.v4.content.res.TypedArrayUtils; 
import android.util.DisplayMetrics; 
import android.util.Log; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.AdapterView; 
import android.widget.AdapterView.OnItemClickListener; 
import android.widget.BaseAdapter; 
import android.widget.Gallery; 
import android.widget.ImageView; 

import java.util.ArrayList; 

import com.nostra13.universalimageloader.core.DisplayImageOptions; 
import com.nostra13.universalimageloader.core.ImageLoader; 
import com.nostra13.universalimageloader.core.display.RoundedBitmapDisplayer; 
import com.thesis.juandirection.juandirectionfinale.R; 
import com.thesis.juandirection.juandirectionfinale.Constants; 
import com.thesis.juandirection.juandirectionfinale.SimpleImageActivity; 

public class ImageGalleryFragment extends ReviewAdapter { 

    public static final int INDEX = 3; 
    private ImageAdapter mAdapter; 

    @SuppressWarnings("deprecation") 
    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 
     View rootView = inflater.inflate(R.layout.fr_image_gallery, container, false); 
     final Gallery gallery = (Gallery) rootView.findViewById(R.id.gallery); 
     final ImageView imageview = (ImageView) rootView.findViewById(R.id.imgAdd); 

     mAdapter = new ImageAdapter(getActivity()); 
     gallery.setAdapter(mAdapter); 

     DisplayMetrics metrics = new DisplayMetrics(); 
     getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics); 
     ViewGroup.MarginLayoutParams mlp = (ViewGroup.MarginLayoutParams) gallery.getLayoutParams(); 
     mlp.setMargins(-((metrics.widthPixels * 2 + 500)/3), mlp.topMargin, 
       mlp.rightMargin, mlp.bottomMargin); 
     gallery.setOnItemClickListener(new OnItemClickListener() { 
      @Override 
      public void onItemClick(AdapterView<?> parent, View view, int position, long id) { 
       Constants.IMAGES_SELECTED.remove(position); 
       mAdapter.notifyDataSetChanged(); 

      } 
     }); 

     imageview.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
       Intent intent = new Intent(getContext(), SimpleImageActivity.class); 
       intent.putExtra(Constants.Extra.FRAGMENT_INDEX, ImageGridFragment.INDEX); 
       startActivity(intent); 
      } 
     }); 

     if (Constants.IMAGES_SELECTED.size()>0) { 
      imageview.setVisibility(View.INVISIBLE); 
     }else{ 
      imageview.setVisibility(View.VISIBLE); 
     } 
     return rootView; 
    } 


    /*private void startImagePagerActivity(int position) { 
     Intent intent = new Intent(getActivity(), SimpleImageActivity.class); 
     intent.putExtra(Constants.Extra.FRAGMENT_INDEX, ImagePagerFragment.INDEX); 
     intent.putExtra(Constants.Extra.IMAGE_POSITION, position); 
     startActivity(intent); 
    }*/ 

    private static class ImageAdapter extends BaseAdapter { 
     //private static final String[] IMAGE_URLS = Constants.IMAGES_SELECTED; 
     ArrayList<String> IMAGE_URLS = new ArrayList<>(); 
     private LayoutInflater inflater; 

     private DisplayImageOptions options; 

     ImageAdapter(Context context) { 
      inflater = LayoutInflater.from(context); 
      options = new DisplayImageOptions.Builder() 
        .showImageOnLoading(R.drawable.ic_stub) 
        .showImageForEmptyUri(R.drawable.ic_empty) 
        .showImageOnFail(R.drawable.ic_error) 
        .cacheInMemory(true) 
        .cacheOnDisk(true) 
        .considerExifParams(true) 
        .bitmapConfig(Bitmap.Config.RGB_565) 
        .displayer(new RoundedBitmapDisplayer(20)) 
        .build(); 
     } 

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

     @Override 
     public Object getItem(int position) { 
      return position; 
     } 

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

     @Override 
     public View getView(final int position, View convertView, ViewGroup parent) { 
      IMAGE_URLS = (ArrayList<String>) Constants.IMAGES_SELECTED.clone(); 
      ImageView imageView = (ImageView) convertView; 
      if (imageView == null) { 
       imageView = (ImageView) inflater.inflate(R.layout.item_gallery_image, parent, false); 
      } 
      ImageLoader.getInstance().displayImage(IMAGE_URLS.get(position), imageView, options); 

      return imageView; 
     } 
    } 
} 

Ma mise en page .. item_gallery_image.xml

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="120dip" 
    android:background="#b6b6b6"> 


    <ImageView xmlns:android="http://schemas.android.com/apk/res/android" 
     android:id="@+id/image" 
     android:layout_width="90dip" 
     android:layout_height="90dip" 
     android:adjustViewBounds="true" 
     android:contentDescription="@string/descr_image" 
     android:scaleType="centerCrop" /> 


    <Button 
     android:id="@+id/btn" 
     android:layout_width="20dp" 
     android:layout_height="20dp" 
     android:text="X" 
     /> 
</FrameLayout> 

Merci à l'avance .. EDIT: sortie post exemple. BTW. Quand je lance le programme en utilisant le XML, le programme est fermé.

Answer 1

Dans votre ImadgeAdapter # getView, vous infalte un framelayout contient un imageview et un bouton croix, donc résultat de

inflater.inflate(R.layout.item_gallery_image, parent, false) 

sera le type FrameLayout, mais vous l'avez lancé un imageView, c'est pourquoi l'application se bloque .donc vous devez utiliser ViewHolder pour tenir imageView, comme ceci:

@Override 
    public View getView(final int position, View convertView, ViewGroup parent) { 
     IMAGE_URLS = (ArrayList<String>) Constants.IMAGES_SELECTED.clone(); 
     FrameLayout layout = (FrameLayout) convertView; 
     if (layout == null) { 
      layout = (FrameLayout) inflater.inflate(R.layout.item_gallery_image, parent, false); 
     } 
     ImageView imageView = (ImageView)layout.findViewById(R.id.image); 
     ImageLoader.getInstance().displayImage(IMAGE_URLS.get(position), imageView, options); 

     return layout; 
    } 

Ofcourse vous devez également utiliser ViewHolder pour maintenir la vue.

Answer 2

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#b6b6b6"> 

<ImageView 
    android:layout_width="match_parent" 
    android:layout_height="120dp" 
    android:src="@drawable/ic_process" /> 

<ImageView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentRight="true" 
    android:src="@drawable/ic_setting_light" /> 

il suffit de changer la mise en page à FrameLayout relative et l'utilisation ImageView au lieu de bouton avec le texte "X"