为什么我在 RecyclerView 中的 ImageView 在滚动回(使用 Glide)时有时会调整大小?
How come my ImageView in RecyclerView is resizing sometimes when scrolled back to (using Glide)?
我正在使用 Glide 将 URL 加载到 ImageView。我的主要问题是,当我滚动时,图像的大小似乎被弄乱了,这导致了一些失真。我的相关代码如下。
XML(仅与 ImageView 相关的部分):
<LinearLayout
android:id="@+id/image_holder_layout"
android:layout_width="85dp"
android:layout_height="85dp"
android:layout_centerVertical="true"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:gravity="center">
<ImageView
android:id="@+id/flyer_item_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="@android:drawable/dialog_holo_light_frame" />
</LinearLayout>
回收器适配器:
public class RecyclerAdapter extends RecyclerView.Adapter<RecyclerAdapter.ItemHolder> {
private ArrayList<Item> items;
Context context;
public RecyclerAdapter(Context context, ArrayList<Item> items) {
this.items = items;
this.context = context;
}
@Override
public ItemHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
Context context = viewGroup.getContext();
boolean shouldAttachToParentImmediately = false;
View view = LayoutInflater.from(context).inflate(R.layout.list_row_flyer, viewGroup, shouldAttachToParentImmediately);
ItemHolder viewHolder = new ItemHolder(view);
return viewHolder;
}
@Override
public void onBindViewHolder(ItemHolder holder, int position) {
holder.bind(position);
}
@Override
public int getItemCount() {
return items.size();
}
class ItemHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
ImageView itemImage;
public ItemHolder(View view) {
super(view);
this.itemImage = (ImageView) view.findViewById(R.id.flyer_item_image);
}
void bind(int listIndex) {
Glide.with(context)
.load(items.get(listIndex).getImageUrl())
.placeholder(R.drawable.placeholder_flyer_item_image)
.diskCacheStrategy(DiskCacheStrategy.ALL)
.override(Target.SIZE_ORIGINAL, Target.SIZE_ORIGINAL)
.into(itemImage);
}
}
}
我有同样的问题,图像有时会调整为占位符大小,这完全不同并且图像看起来像拉伸,所以如果你的图像有不同的比例,那么占位符只需删除占位符或将其更改为适合与图像相同的大小, 但如果图像具有相似的比例,占位符效果最好,占位符的替代解决方案是在父视图元素中设置背景以避免此问题并有一些加载背景。
我还看到您在 ImageView
大小属性上有 wrap_content
,我建议设置一些宽度和高度,然后 glide 可以通过裁剪或适合轻松调整图像。
列表项正在重复使用,当您向下滚动时,您会绑定一个更大的图像,这会使 ImageView 布局更高 (wrap_content
)。当您向上滚动时,Glide 会看到更高的尺寸并尝试加载具有该尺寸的图像。 wrap_content
仅在之前没有布局的情况下才有效,否则 Glide 会读取布局的 width/height 并将其用作目标大小。我通常建议使用 holder.imageView.layout(0,0,0,0)
来重置 view/target 的大小,并且表现得就像列表项刚刚膨胀一样。
我正在使用 Glide 将 URL 加载到 ImageView。我的主要问题是,当我滚动时,图像的大小似乎被弄乱了,这导致了一些失真。我的相关代码如下。
XML(仅与 ImageView 相关的部分):
<LinearLayout
android:id="@+id/image_holder_layout"
android:layout_width="85dp"
android:layout_height="85dp"
android:layout_centerVertical="true"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:gravity="center">
<ImageView
android:id="@+id/flyer_item_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:background="@android:drawable/dialog_holo_light_frame" />
</LinearLayout>
回收器适配器:
public class RecyclerAdapter extends RecyclerView.Adapter<RecyclerAdapter.ItemHolder> {
private ArrayList<Item> items;
Context context;
public RecyclerAdapter(Context context, ArrayList<Item> items) {
this.items = items;
this.context = context;
}
@Override
public ItemHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
Context context = viewGroup.getContext();
boolean shouldAttachToParentImmediately = false;
View view = LayoutInflater.from(context).inflate(R.layout.list_row_flyer, viewGroup, shouldAttachToParentImmediately);
ItemHolder viewHolder = new ItemHolder(view);
return viewHolder;
}
@Override
public void onBindViewHolder(ItemHolder holder, int position) {
holder.bind(position);
}
@Override
public int getItemCount() {
return items.size();
}
class ItemHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
ImageView itemImage;
public ItemHolder(View view) {
super(view);
this.itemImage = (ImageView) view.findViewById(R.id.flyer_item_image);
}
void bind(int listIndex) {
Glide.with(context)
.load(items.get(listIndex).getImageUrl())
.placeholder(R.drawable.placeholder_flyer_item_image)
.diskCacheStrategy(DiskCacheStrategy.ALL)
.override(Target.SIZE_ORIGINAL, Target.SIZE_ORIGINAL)
.into(itemImage);
}
}
}
我有同样的问题,图像有时会调整为占位符大小,这完全不同并且图像看起来像拉伸,所以如果你的图像有不同的比例,那么占位符只需删除占位符或将其更改为适合与图像相同的大小, 但如果图像具有相似的比例,占位符效果最好,占位符的替代解决方案是在父视图元素中设置背景以避免此问题并有一些加载背景。
我还看到您在 ImageView
大小属性上有 wrap_content
,我建议设置一些宽度和高度,然后 glide 可以通过裁剪或适合轻松调整图像。
列表项正在重复使用,当您向下滚动时,您会绑定一个更大的图像,这会使 ImageView 布局更高 (wrap_content
)。当您向上滚动时,Glide 会看到更高的尺寸并尝试加载具有该尺寸的图像。 wrap_content
仅在之前没有布局的情况下才有效,否则 Glide 会读取布局的 width/height 并将其用作目标大小。我通常建议使用 holder.imageView.layout(0,0,0,0)
来重置 view/target 的大小,并且表现得就像列表项刚刚膨胀一样。