如何在 RecyclerView 中显示乘法布局 [重复]

Posted 2023-02-25

【中文标题】如何在 RecyclerView 中显示乘法布局 [重复]

【英文标题】：how to display multiply layout in RecyclerView [duplicate]

【发布时间】：2016-08-12 15:21:35

【问题描述】：

我在 JSON 中获取数据。数据包含图像 url。我正在尝试在以下布局中显示图像。

1Image
2Image
3Image  4Image  5Image  6Image  7image
8Image  9Image  10Image 11Image 12image
13image 14image 15image 16image 17image
....    ....     .....  ......   .....

所以前两个图像将是垂直的。水平滚动视图中的其他 5 张图像等等。 所以我使用垂直方向的 RecyclerView。但我无法创建逻辑，因此图像将以上述格式显示。

请任何人指导我。

更新：-

//Horizontal images view.
public class MoviesAdapterHorizontal extends RecyclerView.Adapter<MoviesAdapterHorizontal.MyViewHolder> 

    private List<String> moviesList;
   // private ThumbnailListener thumbnailListener;

    public class MyViewHolder extends RecyclerView.ViewHolder 
      //  YouTubeThumbnailView thumbnail;
        ImageView imageView2;
        public MyViewHolder(View view) 
            super(view);
              //  thumbnail = (YouTubeThumbnailView) view.findViewById(R.id.thumbnail);
            imageView2 = (ImageView) view.findViewById(R.id.imageView2);

        
    


    public MoviesAdapterHorizontal(List<String> moviesList) 
        this.moviesList = moviesList;
    //    thumbnailListener = new ThumbnailListener();
    

    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) 


        View itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.hotrow2, parent, false);

        return new MyViewHolder(itemView);

    

    @Override
    public void onBindViewHolder(MyViewHolder holder, int position) 
        final String url = moviesList.get(position);
        System.out.println("movie url = " + url);

       final String m = url.substring(url.lastIndexOf('/') + 1);
        System.out.println("url = "+m);

      int w = BasicDeviceInfo.getWidth(getActivity());
        //  int h = BasicDeviceInfo.getHeight(getActivity());


        LinearLayout.LayoutParams lParams =
                new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
                        w/3);

        AQuery aq = new AQuery(holder.imageView2);

        aq.id(holder.imageView2).image("http://x.x.x.231/news-flicks/uploads/home/tulips_e84aa48cee1a2a25aef001cd74152663.jpg", true, true, 0,
                R.drawable.no_thumbnail);

        holder.imageView2.setLayoutParams(lParams);

       // holder.thumbnail.setLayoutParams(lParams);

      /*  holder.thumbnail.setTag(m);
        holder.thumbnail.initialize("AIzaSyDW-sxPUqy2rD6ZWs3vTNb0jKEKA21RjrY", thumbnailListener);

        holder.thumbnail.setOnClickListener(new View.OnClickListener() 
            @Override
            public void onClick(View v) 
                Intent intent = new Intent(getActivity(), FullscreenDemoActivity.class);
                intent.putExtra("url",m);
               intent.putExtra("txt", "");
                startActivity(intent);

            
        );*/

    

    @Override
    public int getItemCount() 
        return moviesList.size();
    

    private final class ThumbnailListener implements
            YouTubeThumbnailView.OnInitializedListener,
            YouTubeThumbnailLoader.OnThumbnailLoadedListener 

        @Override
        public void onInitializationSuccess(
                YouTubeThumbnailView view, YouTubeThumbnailLoader loader) 
            loader.setOnThumbnailLoadedListener(this);
            String videoId = (String) view.getTag();
            loader.setVideo(videoId);
        

        @Override
        public void onInitializationFailure(
                YouTubeThumbnailView view, YouTubeInitializationResult loader) 
            view.setImageResource(R.drawable.no_thumbnail);
        

        @Override
        public void onThumbnailLoaded(YouTubeThumbnailView view, String videoId) 
        

        @Override
        public void onThumbnailError(YouTubeThumbnailView view, YouTubeThumbnailLoader.ErrorReason errorReason) 
            view.setImageResource(R.drawable.no_thumbnail);
        
    

横向xml：-

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical"
>


<ImageView
    android:layout_
    android:layout_
    android:id="@+id/imageView2"
    android:src="@drawable/no_thumbnail"/>
</LinearLayout>

我称它为父回收视图 onBindViewHolder()

@Override
    public void onBindViewHolder(final MyViewHolder holder, int position) 
        Videos movie = moviesList.get(position);
        System.out.println("Image = " + movie.getImage());

        int w = BasicDeviceInfo.getWidth(getActivity());
        //  int h = BasicDeviceInfo.getHeight(getActivity());
        if(position < 2) 

            final List<String> lst = new ArrayList<String>();
            lst.add(movie.getVideo_url());
            lst.add(movie.getVideo_url());
            lst.add(movie.getVideo_url());
            lst.add(movie.getVideo_url());
            lst.add(movie.getVideo_url());


            final MoviesAdapterHorizontal adapter = new MoviesAdapterHorizontal(lst);
            holder.recyclerView2.setAdapter(adapter);

            adapter.notifyDataSetChanged();

现在我的水平 onBindViewHolder 正在调用并且能够看到日志消息。但是 ImageView 没有显示。我认为它隐藏或重叠

【参考方案1】：

查看Answer 了解如何在RecyclerView 中制作不同的布局项

对于包含ImageView的前两个元素布局文件

对于休息项目视图，我建议将水平RecyclerView 作为项目

我的水平自定义视图RecyclerView

public class DocumentViewDynamic extends LinearLayout 
private static final String LOG_TAG = DocumentViewDynamic.class.getSimpleName();
private final String titleStr;
private OnDocumentItemClicked callBack;

public void updateImage(Bitmap bitmap, int postionOfView) 
    Log.e(LOG_TAG, "updateImage: ");
    documentAdapter.setImageFromCamera(bitmap, postionOfView);



public interface OnDocumentItemClicked 
    void onDocumentItemClicked(View v, int position);



public void setItemClickedListener(OnDocumentItemClicked callBack) 
    this.callBack = callBack;


@Bind(R.id.title)
TextView title;
@Bind(R.id.img_add)
FloatingActionButton imgAdd;
private DocumentAdapter documentAdapter;
private final Context context;

@Bind(R.id.rv_document)
RecyclerView rvDocument;

@OnClick(R.id.img_add)
public void addDummyImage() 
    documentAdapter.addSingelDummyImage();
    rvDocument.scrollToPosition(documentAdapter.getItemCount() - 1);



public DocumentViewDynamic(Context context, AttributeSet attrs) 
    super(context, attrs);
    this.context = context;
    TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.DocumentViewDynamic, 0, 0);
    try 
        titleStr = ta.getString(R.styleable.DocumentViewDynamic_titleDoc);
     finally 
        ta.recycle();
    

    init();


public ArrayList<DocumentModel> getAllImageData() 
    return documentAdapter.getImageData();


private void init() 

    setOrientation(VERTICAL);

    View view = LayoutInflater.from(context).inflate(R.layout.compund_view_document, this);
    ButterKnife.bind(this, view);

    if (!TextUtils.isEmpty(titleStr))
        title.setText(titleStr);
    initRecyclerView();



private void initRecyclerView() 

    rvDocument.setLayoutManager(new LinearLayoutManager(context, HORIZONTAL, false));
    ArrayList<DocumentModel> documentModels = new ArrayList<>();
    documentAdapter = new DocumentAdapter(documentModels);
    rvDocument.setAdapter(documentAdapter);




public class DocumentAdapter extends RecyclerView.Adapter<DocumentAdapter.DocViewHolder> 
    public ArrayList<DocumentModel> getImageData() 
        return documentModels;
    

    private ArrayList<DocumentModel> documentModels = new ArrayList<>();

    public DocumentAdapter(ArrayList<DocumentModel> documentModels) 
        this.documentModels = documentModels;
        if (documentModels.size() == 0)
            documentModels.add(new DocumentModel());
    


    @Override
    public DocViewHolder onCreateViewHolder(ViewGroup parent, int viewType) 
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_compund_document, parent, false);
        return new DocViewHolder(view);
    

    @Override
    public void onBindViewHolder(final DocViewHolder holder, int position) 

        if (documentModels.get(position).getBitmap() == null) 
            holder.imgDocument.setImageResource(R.drawable.camera);
            holder.imgBtnDelete.setVisibility(GONE);
         else 
            holder.imgDocument.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
            holder.imgDocument.setScaleType(ImageView.ScaleType.FIT_XY);
            holder.imgDocument.setImageBitmap(documentModels.get(position).getBitmap());
            holder.imgBtnDelete.setVisibility(VISIBLE);
        

        holder.itemView.setOnClickListener(new OnClickListener() 
            @Override
            public void onClick(View v) 
                callBack.onDocumentItemClicked(DocumentViewDynamic.this, holder.getAdapterPosition());
            
        );


        holder.imgBtnDelete.setOnClickListener(new OnClickListener() 
            @Override
            public void onClick(View v) 
                if (holder.getAdapterPosition() == 0 && documentModels.size() == 1) 
                    documentModels.get(holder.getAdapterPosition()).setBitmap(null);
                 else 
                    documentModels.remove(holder.getAdapterPosition());
                
                notifyDataSetChanged();
            
        );

    

    @Override
    public int getItemCount() 

        return (documentModels != null && documentModels.size() > 0) ? documentModels.size() : 0;
    

    public void setImageFromCamera(Bitmap imageFromCamera, int postionOfView) 
        documentModels.get(postionOfView).setBitmap(imageFromCamera);
        notifyDataSetChanged();

    

    public class DocViewHolder extends RecyclerView.ViewHolder 


        @Bind(R.id.img_document)
        ImageView imgDocument;
        @Bind(R.id.img_btn_delete)
        ImageView imgBtnDelete;

        public DocViewHolder(View itemView) 
            super(itemView);
            ButterKnife.bind(this, itemView);
        
    


    public void addSingelDummyImage() 

        if (documentModels.get(documentModels.size() - 1).getBitmap() != null) 
            documentModels.add(new DocumentModel());
            notifyDataSetChanged();
         else 
            Snackbar.make(rvDocument, "Please Add image ", Snackbar.LENGTH_LONG).show();
        
    

复合视图的布局文件

<?xml version="1.0" encoding="utf-8"?>

<TextView
    android:id="@+id/title"
    android:layout_
    android:layout_
    android:text="Title"
    android:textColor="#3399ff"
    android:textSize="15dp"
    android:textStyle="normal" />

<RelativeLayout
    android:layout_
    android:layout_>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/rv_document"
        android:layout_
        android:layout_
        android:layout_centerVertical="true"
        android:layout_toLeftOf="@+id/img_add" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/img_add"
        android:layout_
        android:layout_
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_centerVertical="true"
        android:layout_marginRight="10dp"
        android:layout_marginTop="10dp"
        android:src="@drawable/fab_plus_bg" />
</RelativeLayout>

将此复合视图膨胀为垂直中的项目RecyclerView

【讨论】：

我创建了多个视图。一种视图适用于显示图像。在这里，我在一行中显示一张图像。但我很困惑其他视图如何像水平滚动一样工作。因为一行包含 5 张图像。请给我建议。

对于rest item view我建议将Horizo​​ntal RecyclerView作为item

Horizo​​ntal RecyclerView 也适用于 API 11？

是的，它在支持库中

谢谢 可以分享一下这种类型的演示吗？我真的是 android 新手。非常感谢您的帮助。