css3 flex-wrap 当屏幕缩小后为啥多余的部分没有挤下去

Posted 2023-05-18

参考技术A flex-wrap :有三个属性
nowrap：flex容器为单行。该情况下flex子项可能会溢出容器
wrap：flex容器为多行。该情况下flex子项溢出的部分会被放置到新行，子项内部会发生断行
wrap-reverse：反转 wrap 排列。
看看你的属性合适不本回答被提问者采纳

为啥我的 Android GridView 周围有多余的像素？

【中文标题】为啥我的 Android GridView 周围有多余的像素？

【英文标题】：Why are there extra pixels around my Android GridView?为什么我的 Android GridView 周围有多余的像素？

【发布时间】：2011-05-01 12:30:57

【问题描述】：

我的 Android 应用程序中有一个 GridView，其中包含许多 ImageView。我屏幕上的空间有限，我希望图像尽可能多地占用可用空间。不幸的是，GridView 总是在 ImageViews 的外边缘留下 5 个像素的空白屏幕空间（ImageViews 之间的空间设置为水平/垂直间距并且行为正确）。空白空间有点像 ImageViews 周围的边距，但我无法摆脱它。有谁知道是什么导致了这个“边界”以及我如何摆脱它（或者至少让它变小）？谢谢。

更新：我通过在我的 Adapter 类的 getView() 方法中扩展一个 .xml 文件来创建 ImageViews。这是我正在膨胀的 xml：

<ImageView
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:background="#FF00FF" />

我在我的布局 xml 文件中定义了 GridView，如下所示：

<GridView
   android:id="@+id/mygrid"
   android:layout_
   android:layout_
   android:layout_above="@+id/abutton"
   android:layout_marginBottom="8dp"
   android:numColumns="5" android:background="#FF0000"/>

这是问题的屏幕截图。我的 GridView 中的红色区域。紫色区域是我的 ImageViews。显示的图像是一个简单的蓝色矩形，中心是透明的。图像为 45x45 像素（但在我的应用程序中只有 30x30 像素 - 我稍后会担心）。紫色周围的红色边框是我要消除的。

【参考方案1】：

您是否尝试将 ImageView 上的 padding 和 GridView 上的 horizontalSpacing 和 verticalSpacing 设置为 0？

【讨论】：

谢谢。我试过了。似乎没有帮助。我更新了我的原始帖子以包含我的 GridView 和 ImageViews 的代码。

您在网格视图中放置的图像尺寸是多少？它们都一样吗？您可能需要调整它们的缩放方式以占用整个空间。 developer.android.com/reference/android/widget/… 另外，在层次结构查看器中查看您的布局，看看谁拥有该空间。

我设法设置了控件的背景颜色，以便我可以看到谁拥有屏幕空间（请参阅我编辑的问题）。 GridView 是所有者，但更改 padding 并不会减少拥有的区域（尽管它可以扩展它）。

对不起，不知道还有什么要改变的。感觉就像填充，边距，间距等的某种组合，必须做的伎俩..

【参考方案2】：

尝试将图像视图的 layout_height 和 layout_width 设置为 fill_parent。

iv.setLayoutParams(ViewGroup.LayoutParams(ViewGroup.MATCH_PARENT, ViewGroup.MATCH_PARENT));

我相信会动态进行。

【讨论】：

我必须为 Android 2.1 执行此操作，当时 MATCH_PARENT 不存在。我试过 FILL_PARENT 还是不行。

MATCH_PARENT = FILL_PARENT，我不知道他们为什么改变它。

我们更改了它，因为FILL_PARENT 暗示“填充剩余 空间”，这在绝大多数情况下并不是实际行为。 :)

@adamp 感谢您的解释！

【参考方案3】：

感谢大家的建议，但事实证明答案出乎我们的意料。额外的像素是由分配给我的 GridView 的选择器引起的。我猜默认选择器是一个 9-patch 图像，它周围有一个 5 像素的边框。当我创建并分配一个具有较小边框（或根本没有边框 - 只是一个普通的 .png 文件）的 9 补丁时，我的 GridView 中的额外空间消失了。

【讨论】：

+1，您为我节省了至少 4 小时的试错时间。似乎在这种情况下指定“无图像”的一种干净方法是android:listSelector="@android:id/empty"

@mvds android:listSelector="@android:id/empty" 导致异常。似乎 GridView 无法处理此 listSelector。我将选择器设置为透明色。

@Janusz 正确，在某些设备上 @android:id/empty 会导致崩溃。 @android:color/transparent 似乎是正确的选择。

或者，使用@null 完全省略列表选择器。

@android:color/transparent 对我来说是一个很好的解决方案。

【参考方案4】：

对我来说，除了在 xml 中设置 android:columnWidth 属性（例如 android:columnWidth="50dp"）