CODEWITHSUNDEEP
androidandroid-layoutandroid-recyclerview
Ashwin N Bhanushali
Ashwin N Bhanushali

Reputation: 3882

Recycler view of vertical scrolling list with Horizontal scrollable row

I want an RecyclerView in which we have vertical scrollable list of items. From this scrollable list of items some should have ability to scroll in horizontal direction. As shown in below image enter image description here

can anyone please guide me how to do it?

Thank You.

Upvotes: 19

Views: 7117

Answers (2)

ucsunil
ucsunil

Reputation: 7504

Since this seems to be a commonly asked problem, I thought I'll share my simple implementation of this. It is quite easy to achieve this using a RecyclerView. I did this while trying to create a horizontal list of scrollable images when a picture was taken using the device camera. I have pasted the relevant section of the adapter.

I used a RecyclerView that used a LinearLayoutManager with orientation set to horizontal.

The adapter itself is quite simple and is (please note only relevant sections are here):

import android.content.Context;
import android.graphics.Bitmap;
import android.media.Image;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import com.ebay.lockers.R;
import com.ebay.lockers.utils.AsyncDrawable;
import com.ebay.lockers.utils.BitmapUtils;
import com.ebay.lockers.utils.BitmapWorkerTask;

import java.io.File;
import java.util.List;

/**
 * Created by Sunil on 6/17/2016.
 */
public class ImagesHorizontalListAdapter extends RecyclerView.Adapter<ImagesHorizontalListAdapter.ImagesViewHolder> {

    private Context context;
    private List<File> imageFiles;

    public ImagesHorizontalListAdapter(Context context, List<File> imageFiles) {
        this.context = context;
        this.imageFiles = imageFiles;
    }

    @Override
    public ImagesHorizontalListAdapter.ImagesViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View layout = LayoutInflater.from(context).inflate(R.layout.simple_image_view, parent, false);
        ImagesViewHolder viewHolder = new ImagesViewHolder(layout);
        return viewHolder;
    }

    @Override
    public void onBindViewHolder(final ImagesHorizontalListAdapter.ImagesViewHolder holder, final int position) {
        int availableWidth = context.getResources().getDisplayMetrics().widthPixels;
        int imageWidth = availableWidth/4; // Number of images to be shown by default
        int imageHeight = imageWidth*4/3;
        final int minDimenForScaling = Math.min(imageWidth, imageHeight);

        holder.image.post(new Runnable() {
            @Override
            public void run() {
                loadBitmap(imageFiles.get(position), holder.image, minDimenForScaling, minDimenForScaling);
            }
        });
    }

    @Override
    public int getItemCount() {
        return imageFiles.size();
    }

    public void loadBitmap(File file, ImageView imageView, int reqWidth, int reqHeight) {
        if(BitmapUtils.cancelPotentialWork(file, imageView)) {
            final BitmapWorkerTask task = new BitmapWorkerTask(imageView, reqWidth, reqHeight);
            // The second Bitmap parameter is a placeholder image
            // Should consider animation; TO DO --
            final AsyncDrawable asyncDrawable = new AsyncDrawable(context.getResources(), null, task);
            imageView.setImageDrawable(asyncDrawable);
            task.execute(file);
        }
    }

    public static class ImagesViewHolder extends RecyclerView.ViewHolder {
        // each data item is an image
        ImageView image;

        public ImagesViewHolder(View layout) {
            super(layout);
            this.image = (ImageView) layout.findViewById(R.id.image);
        }
    }
}

Upvotes: -1

qmn1711
qmn1711

Reputation: 902

Custom LayoutManagers

  • StaticGridLayoutManager - 2D scrolling grid with variable column count based on data set. Window of visible (non-recycled) views is
    determined statically.
  • DynamicGridLayoutManager - 2D scrolling grid where window of visible views is determined dynamically. Results in fewer views in memory, but scrolling performance is questionable.

I have met the same problem and I found this library. Maybe it will help you. https://github.com/devunwired/recyclerview-playground

More detail about RecyclerView LayoutManager: http://wiresareobsolete.com/2014/09/building-a-recyclerview-layoutmanager-part-1/

p/s: For your case http://lucasr.org/2014/07/31/the-new-twowayview/

Upvotes: 5

Related Questions