java - Recyclerview 仅显示一项

Question

我创建了带有标题类型和项目类型的recyclerview。我已将wrap_content 赋予为其创建的布局。在适配器中，我根据 View 类型分离了 View 。

我的列表中有 2 个项目，其中包含日期和图像网址列表。我只能看到第一个日期和三张图像中的一张，并且第一项和第二项中的其他图像不可见。

我正在为 recyclerview 使用网格布局管理器。

下面是我的适配器和 fragment 代码。

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

    private ArrayList<Media> mediaArrayList;
    private Context context;
    public static final int TYPE_HEADER = 0;
    public static final int TYPE_ITEM = 1;
    private ArrayList<String> imageURls;

    public MediaAdapter(Context context,ArrayList<Media> mediaArrayList)
    {
        this.context = context;
        this.mediaArrayList = mediaArrayList;
        this.imageURls = new ArrayList<>();
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        LayoutInflater inflater = LayoutInflater.from(parent.getContext());
        if (viewType == TYPE_HEADER) {
            View v = inflater.inflate(R.layout.media_item_header_layout, parent, false);
            return new MediaViewHeader(v);
        } else {
            View v = inflater.inflate(R.layout.media_item_layout, parent, false);
            return new MediaItemView(v);
        }
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {

        Media media = mediaArrayList.get(position);

        if (holder instanceof MediaViewHeader) {

            MediaViewHeader mediaViewHeader = (MediaViewHeader) holder;
            mediaViewHeader.textViewDate.setText(media.getDate());

        } else if (holder instanceof MediaItemView) {

            MediaItemView mediaItemView = (MediaItemView) holder;
            imageURls = media.getImageUrl();

            for (String url : imageURls) {

                if (!TextUtils.isEmpty(media.getImageUrl().toString())) {
                    Picasso.get()
                            .load(url)
                            .resize(300, 250)
                            .placeholder(R.drawable.progress_animation_small)
                            .error(R.drawable.ic_avatar_small)
                            .into(mediaItemView.imageViewPhoto);
                } else {
                    mediaItemView.imageViewPhoto.setImageDrawable(ContextCompat.getDrawable(context,
                            R.drawable.ic_avatar_small));
                }
            }
        }
    }

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

        @Override
        public int getItemViewType ( int position){
            if (isPositionHeader(position))
                return TYPE_HEADER;
            else return TYPE_ITEM;

        }

        private boolean isPositionHeader ( int position){
            return position == 0;
        }

        class MediaItemView extends RecyclerView.ViewHolder {
            ImageView imageViewPhoto;

            public MediaItemView(View itemView) {
                super(itemView);
                imageViewPhoto = itemView.findViewById(R.id.image_photo);
            }
        }

        class MediaViewHeader extends RecyclerView.ViewHolder {

            private TextView textViewDate;

            public MediaViewHeader(View itemView) {
                super(itemView);
                textViewDate = itemView.findViewById(R.id.text_date);
            }
        }


}

我已检查是否从 api 收到响应。我得到以下回复。

{
    "status": "success",
    "requestId": null,
    "result": {
        "media": [{
                "date": "03 April 19",
                "imageUrl": ["https://i.imgur.com/I86rTVl.jpg", "https://i.imgur.com/I86rTVl.jpg", "https://i.imgur.com/I86rTVl.jpg"]
            },

            {
                "date": "02 April 19",
                "imageUrl": ["https://i.imgur.com/I86rTVl.jpg", "https://i.imgur.com/I86rTVl.jpg", "https://i.imgur.com/I86rTVl.jpg"]
            }
        ]
    }
}

下面是recyclerview的设置

 public void setUpRecyclerView() {

        mediaArrayList = new ArrayList<>();

        final GridLayoutManager gridLayoutManager = new GridLayoutManager(getActivity(), 3);
        gridLayoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {

            @Override
            public int getSpanSize(int position) {
                if (MediaAdapter.TYPE_HEADER == mediaAdapter.getItemViewType(position)) {
                    return 1;
                }
                return 2;
            }
        });
        recyclerViewMedia.setLayoutManager(gridLayoutManager);
        mediaAdapter = new MediaAdapter(getActivity(), mediaArrayList);
        recyclerViewMedia.setAdapter(mediaAdapter);
        getMediaList();
    }

请检查。谢谢...

编辑:

media_item_header_layout

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/text_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="#70666666"
        android:fontFamily="@font/notosans_semibold"
        android:letterSpacing="-0.02"
        android:text="03 April 19 "
        android:layout_marginTop="21dp"/>

</LinearLayout>

媒体项目布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/image_photo"
        android:layout_width="96dp"
        android:layout_height="96dp"
        android:layout_marginTop="16dp"
        android:layout_marginBottom="16dp"
        android:background="@drawable/media_item_image_background">
    </ImageView>


</RelativeLayout>

媒体 fragment

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#f8f8fb">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerview_media"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginRight="@dimen/padding_20"
        android:layout_marginLeft="@dimen/padding_20">

    </androidx.recyclerview.widget.RecyclerView>


</RelativeLayout>

我在答案之后看到了这个布局

enter image description here

Answer 1

更改此:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/text_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="#70666666"
        android:fontFamily="@font/notosans_semibold"
        android:letterSpacing="-0.02"
        android:text="03 April 19 "
        android:layout_marginTop="21dp"/>

</LinearLayout>

对此:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="wrap_content" <----
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/text_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14sp"
        android:textColor="#70666666"
        android:fontFamily="@font/notosans_semibold"
        android:letterSpacing="-0.02"
        android:text="03 April 19 "
        android:layout_marginTop="21dp"/>

</LinearLayout>

您正在将网格布局管理器设置为 3 列，但您的列宽为“match_parent”如果你开始水平滚动，你会看到你的项目在那里一旦您将其更改为“wrap_content”，它将显示所有可能适合1屏幕宽度的项目