RecyclerView mit StaggeredGridLayoutManager mit Bildern von Glide Laden

Question

Ich habe ein Problem mit RecyclerViewStaggeredGridLayoutManager dessen Elemente zeigt enthalten ein imageview und das Bild in imageview geladen wird glide verwenden. Das Problem, mit dem ich konfrontiert bin, ist, dass nach dem Laden von Bildern sie nicht gestaffelt sind und von gleicher Größe sind, da es eine große Lücke zwischen zwei Spalten gibt. Wie variiert man die Höhe von Bildern ohne Spaltenlücken?

Answer 1

Schließlich ist sie die soultion, um herauszufinden, die Lage. Ich musste die benutzerdefinierte Bildansicht erstellen, um das Seitenverhältnis in der Staggered Recycler View zu variieren.

public class DynamicHeightNetworkImageView extends ImageView { 
private float mAspectRatio = 1.5f; 

public DynamicHeightNetworkImageView(Context context) { 
    super(context); 
} 

public DynamicHeightNetworkImageView(Context context, AttributeSet attrs) { 
    super(context, attrs); 
} 

public DynamicHeightNetworkImageView(Context context, AttributeSet attrs, int defStyle) { 
    super(context, attrs, defStyle); 
} 

public void setAspectRatio(float aspectRatio) { 
    mAspectRatio = aspectRatio; 
    requestLayout(); 
} 

@Override 
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
    int measuredWidth = getMeasuredWidth(); 
    setMeasuredDimension(measuredWidth, (int) (measuredWidth/mAspectRatio)); 
} 
} 

Dann in onBindViewHolder des Adapters eingestellt i das Seitenverhältnis des Bildes durch -

Picasso.with(this).load(THUMB_URL).into(holder.thumbnailView); 
holder.thumbnailView.setAspectRatio(ASPECT_RATIO)); 

Answer 2

Erste intialize Ihre RecyclerView

RecyclerView recyclerGallery = (RecyclerView)findViewById(R.id.gallery_recycler_view); 
gaggeredGridLayoutManager = new StaggeredGridLayoutManager(3, 1); 
recyclerGallery.setLayoutManager(gaggeredGridLayoutManager); 
galleryAdapter = new GalleryAdaptor(ProfImageGallery.this, imgsUrl); 
recyclerGallery.setAdapter(galleryAdapter); 

dann Ihr Adapter (Edit nach Ihrem Bedarf)

public class GalleryAdaptor extends RecyclerView.Adapter<GalleryAdaptor.ViewHolder> { 

     private Context mContext; 
     private ArrayList<String> mDataset; 


    // Provide a suitable constructor (depends on the kind of dataset) 
     public GalleryAdaptor(Context mContext, ArrayList<String> mdataList) { 
       this.mContext = mContext; 
       this.mDataset = mdataList; 
     } 

     // Create new views (invoked by the layout manager) 
     @Override 
     public GalleryAdaptor.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { 

       // create a new view 
       View v = LayoutInflater.from(parent.getContext()) 
          .inflate(R.layout.row_gallery, parent, false); 

       // set the view's size, margins, paddings and layout parameters 
       ViewHolder vh = new ViewHolder(v); 
       return vh; 
     } 

     // Replace the contents of a view (invoked by the layout manager) 
     @Override 
     public void onBindViewHolder(final ViewHolder holder, final int position) { 
       // - get element from your dataset at this position 
       // - replace the contents of the view with that element 


       String imageUrl = mDataset.get(position); 

       holder.progressBar.setVisibility(View.VISIBLE); 

       //load the image url with a callback to a callback method/class 

       Picasso.with(mContext) 
        .load(imageUrl) 
        .into(holder.workImage, 
          new ImageLoadedCallback(holder.progressBar) { 
           @Override 
           public void onSuccess() { 
             if (holder.progressBar != null) { 
              holder.progressBar.setVisibility(View.GONE); 
             } 
           } 
          }); 
     } 

ersetzen Picaso-Code d.h

Picasso.with(mContext) 
     .load(imageUrl) 
     .into(holder.workImage, 
       new ImageLoadedCallback(holder.progressBar) { 
        @Override 
        public void onSuccess() { 
          if (holder.progressBar != null) { 
           holder.progressBar.setVisibility(View.GONE); 
          } 
        } 
       }); 

Mit Gleiten.

Glide.with(this).load(imageUrl).into(imageView); 

Answer 3

ich das gleiche Problem hatte. Was für mich funktionierte, war android:adjustViewBounds="true" für mein ImageView zu setzen. Ich stelle nicht einmal scaleType ein.

Hier ist der komplette Inhalt meiner Layoutdatei, item.xml.

<?xml version="1.0" encoding="utf-8"?> 
<ImageView 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/gif_image" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:background="@color/colorFiller" 
    android:adjustViewBounds="true"/> 

Hoffe, das hilft!