如何从 StaggeredGridLayoutManager 中找到单元格宽度？

Question

我在 RecyclerView 中有一个 StaggeredGrid，我正在尝试动态设置 onBindViewHolder 中的图像高度。我以为 StaggeredGrid 应该会自动处理所有这些，所以我在 ImageView 上设置了 android:layout_width="match_parent 和 android:scaleType="fitStart，但是图像周围有很多间隙。

由于 StaggeredGrid 不符合要求，我试图通过在 onBindViewHolder 中动态定义图像高度来帮助它。我提前有了图像的宽度和高度，但网格的单元格宽度不可用。我尝试了 holder.cardView.getLayoutParams().width 和 getMeasuredWidth()，但它们都是 return 零或小数字。我知道单元格宽度在其他地方可用，但我在 onBindViewHolder 事件中确实需要它，以便我可以设置和调整图像。

关于如何利用 StaggeredGrid 实现这一目标的任何想法？感谢任何建议或经验！

在我的 activity 中是这样的：

mLayoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
mRecyclerView.setLayoutManager(mLayoutManager);

在我的适配器中：

@Override
public void onBindViewHolder(MyAdapter.MyViewHolder holder, int position) {
    MyModel item = mData.get(position);

    int imageWidth = item.getFeatured_image().getWidth();
    int imageHeight = item.getFeatured_image().getHeight();
    int cellWidth = 540; // <==== how to find dynamically??!!

    ViewGroup.LayoutParams imageLayoutParams = holder.thumbnailImageView.getLayoutParams();
    imageLayoutParams.width = cellWidth;
    imageLayoutParams.height = imageHeight * cellWidth / imageWidth;
    holder.thumbnailImageView.setLayoutParams(imageLayoutParams);

    MediaHelper.displayImage(item, holder.thumbnailImageView);
}

在我的布局中：

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/row_my_card"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    card_view:cardCornerRadius="2dp">

    <ImageView
        android:id="@+id/row_my_thumbnail_image"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:scaleType="fitStart" />

    <TextView
        android:id="@+id/row_my_title_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="#CCFFFFFF"
        android:textStyle="bold"
        android:padding="5dp" />
</android.support.v7.widget.CardView>

我也尝试添加这个确实给我单元格宽度，但是 onGlobalLayout 事件是在 onBindViewHolder 事件中设置和调整图像后触发的，所以为时已晚。

@Override
public MyAdapter.MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    // create a new view
    final View view = LayoutInflater.from(parent.getContext())
        .inflate(R.layout.row_my_post, parent, false);

    final MyViewHolder viewHolder = new MyViewHolder(view);

    ViewTreeObserver viewTreeObserver = view.getViewTreeObserver();
    if (viewTreeObserver.isAlive()) {
        viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                view.getViewTreeObserver().removeOnGlobalLayoutListener(this);
                int viewWidth = view.getWidth();
                int viewHeight = view.getHeight();
            }
        });
    }

    return viewHolder;
}

这里是由于图片大小不同而随机出现的间隙。我想要的是所有图像都是单元格的宽度，并让图像和单元格的高度动态调整：

Answer 1

不是从 onCreateViewHolder 获取视图高度和宽度，而是从 onBindViewHolder 获取视图高度和宽度，如下所示：

@Override
public void onBindViewHolder(final MyAdapter.MyViewHolder holder, int position) 
{
    holder.itemView.post(new Runnable()
    {
        @Override
        public void run()
        {
            MyModel item = mData.get(position);
            int imageWidth = item.getFeatured_image().getWidth();
            int imageHeight = item.getFeatured_image().getHeight();
            int cellWidth = 540; // <==== how to find dynamically??!!

            cellWidth = holder.itemView.getWidth();// this will give you width dynamically

            ViewGroup.LayoutParams imageLayoutParams = holder.thumbnailImageView.getLayoutParams();
            imageLayoutParams.width = cellWidth;
            imageLayoutParams.height = imageHeight * cellWidth / imageWidth;
            holder.thumbnailImageView.setLayoutParams(imageLayoutParams);
            MediaHelper.displayImage(item, holder.thumbnailImageView);
        }
    });
}

希望对您有所帮助！！

Answer 2

试试这个：- 在您的 ImageView 中添加这个 --> android:adjustViewBounds="true"

<android.support.v7.widget.CardView
 xmlns:card_view="http://schemas.android.com/apk/res-auto"
 android:id="@+id/row_my_card"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_margin="5dp"
 card_view:cardCornerRadius="2dp">

<ImageView
    android:id="@+id/row_my_thumbnail_image"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="top"
    android:adjustViewBounds="true"/>

<TextView
    android:id="@+id/row_my_title_text"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="#CCFFFFFF"
    android:textStyle="bold"
    android:padding="5dp" />
 </android.support.v7.widget.CardView>

Answer 3

可以在 activity/fragment 级别找到单元格的宽度，并在渲染时间之前将其传递给适配器。使用这样的东西：

this.staggeredGridLayoutManager.getWidth() / this.staggeredGridLayoutManager.getSpanCount()

使用这种方法，您将能够在任何渲染之前计算单元格的高度，并避免 post 运行方法引入的初始滑动。此外，图像的宽高比将被保留，您可以在图像加载前保留所需的 space。

另请注意，如果存在任何 margins/paddings，您应该将它们包括在之前的计算中。类似于：

(this.staggeredGridLayoutManager.getWidth() - marginsAndOrPaddings) / this.staggeredGridLayoutManager.getSpanCount()

更新： 从支持包23.2.0开始，到了生命周期的这个点，this.staggeredGridLayoutManager.getWidth() returns 0.总宽度可以用this.recyclerView.getWidth()

如何从 StaggeredGridLayoutManager 中找到单元格宽度？

How to find cell width from StaggeredGridLayoutManager?

android

android-layout

android-adapter

staggered-gridview

staggeredgridlayout