问题标签 [swiftui-layout]

我正在尝试通过 VStacks/HStacks 或 LazyVGrid 创建一个 2x2 网格，以使每行上的正方形适合屏幕。例如，第一个和第二个正方形各占屏幕宽度的一半，并根据该长度确定使其成为正方形的高度。我将如何以我提到的两种方式来做到这一点，或者有更好的方法吗？这是我到目前为止所拥有的。

在这里硬编码 frame 属性的宽度和高度感觉是错误的，或者这是消除方块之间间隙的方法？这种硬编码值的方式会扩展到其他手机尺寸吗？

编辑：这是得到我想要的新代码的样子。

现在让它与 LazyVGrid 一起工作。

当另一个视图被定义后，我试图删除列表视图的底部填充，以便列表视图位于另一个视图之上。不叠加。似乎从列表中创建了一些额外的空间，我不确定如何删除它以实现我想要的。这就是我所拥有的。

这就是它的样子。您可以看到第 2 行和红色矩形之间有一个间隙。我想要的是这两个视图的边界彼此相邻。

编辑：我尝试将代码嵌入到 VStack 中，但这并没有消除我们在下面看到的白色间隙。

看看这个答案，似乎将列表包装在 VStack 中会消除差距，但这不是我们在这里看到的？

我已经尝试了多种间距等于 0 的 VStack 变体，但还没有找到如何消除由 List 视图创建的间隙。如果添加了更多行，它会开始填满，但我试图在红色矩形上方只放置两行没有白色间隙的行。

我们可以看到下面突出显示的列表视图包含该差距。

我正在尝试定位一个圆圈，使其中心位于这样的矩形顶部。圆的直径不必与矩形的宽度相同。

我想了解的是实现这一目标的最佳和最实用的方法是什么？在这种情况下，我应该使用填充、偏移或位置吗？它是否适用于不同的设备/屏幕尺寸？似乎它们中的任何一个都可以使用，但哪个更理想？

这是我使用padding. 我可以增加底部填充以达到我想要的效果，但不确定这是否是最好的方法。

我已经为以下内容导入了 JSON countries：

Country.json（示例）

我有一个函数getAnnotated可以遍历国家以制作AnnotatedItem. 它用于Map并循环通过item以实际创建MapAnnotation. 然后item传递给辅助函数getCountry。我过滤countries以获取与 具有相同display_name字段的国家/地区item。

所需的行为是在每个国家/地区都有一个注释/标记，点击该注释将弹出一个提供国家信息的模式/表格。
我的问题是，如果我放大并且屏幕上只有一个注释/标记，则单击它时会显示正确的国家/地区。
如果我缩小地图并且有多个注释，我点击的每个注释都会为每个注释弹出相同的country信息。我认为我循环的方式有问题。

}

在下面的代码片段中，红色圆圈显然不适合屏幕，因此只显示了 HStack 的尾部。而不是这种行为，我希望 HStack 的前导文本始终可见，并截断不适合可用空间的尾随红色圆圈（替换为 ...）。我怎样才能做到这一点？

所以我想要这个： 而不是这个：

我有一个显示搜索结果的 LazyVGrid，当我在搜索字段中键入字符时，我执行 CoreData 获取请求并更新@Published属性。

问题：
LazyVGrid 按预期更新结果，除非它当前正在滚动：在这种情况下，它将等待滚动减速并在刷新之前结束。

作为比较，在 UIKit 中我可以使用 UICollectionView 并调用.reloadData()它，它会立即刷新网格，无论它是否滚动。

出于测试目的，我尝试了以下操作但没有成功：

• 添加.animation(nil)视图修饰符
• 添加.id(UUID())视图修饰符
• 当我想刷新视图时更新 a @State var dummy = ""，并在视图的主体中使用它，例如：Text(dummy)
  

贝娄是一些代码来帮助可视化这个东西是如何工作的

知道如何让 LazyVGrid 在滚动动画运行时刷新它的内容事件吗？否则对用户来说感觉没有反应。

我有以下代码产生以下输出。

即使文本上方的视图（文本）更大，我如何让文本data与文本对齐，并导致底部视图被进一步向下推？我将如何阻止这种情况发生？data 2"11 / 11 /11 /111/1 111"

我还应该提到我不想"11 / 11 /11 /111/1 111"被截断。

编辑：如果长文本的字体大小比它下面的文本小，那也没关系。我也尝试minimumScaleFactor过，底部文本视图仍然相对于带有长文本的顶部视图被推送。

这就是我想要完成的。

如果你有这样的事情。您会看到底部视图rectangle 1并rectangle 2彼此对齐。

但是，一旦您将顶部文本从"Data"to"Data 2"或任何更长的时间延长，您就会看到顶部视图将底部视图进一步向下推。无论顶视图中的文本长度如何，如何阻止底视图被进一步向下推？

这是更新的代码以及会发生什么。

是否可以定位文本视图使其不移动？无论上述任何一个矩形上的文本视图的长度如何，我都希望rectangle 2必须对齐。rectangle 1

我还应该注意，如果上面的文本视图字符串像下面这样长，它将被截断，这是我不想要的。

我也尝试过添加minimumScaleFactor，0.4它确实显示了整个文本而没有被截断，但它有同样的问题，它将底部文本视图进一步向下推。

编辑：标准

1. 让每个矩形中的两个底部文本视图的位置相互对齐，就像在第一张图片中一样，并且在屏幕上的那个位置。
2. 顶部文本视图的长度可以是可变的，无论是 2 个字符还是最多 40 个字符，都不应该导致底部文本视图被进一步向下推。应该注意的是，顶部文本视图中字符串的长度与另一个矩形中的顶部文本视图相比可以是不同的长度。尽管如此，底部视图不应向下移动，它们仍应彼此对齐。
3. 如果顶部视图文本字符串开始变得太长，只要不移动底部文本视图，就可以更改字体大小。为了显示所有的文本。
4. 顶视图中很长的字符串不应该像第三张图片那样被截断。我尝试修复此minimumScaleFactor问题，截断问题已修复，如第四张图片所示，但您可以看到底部文本视图仍然移动。

我试图实现的是在导航栏内有一个分段选择器，但在导航栏标题下方，同时仍然有折叠动画。例如，我需要一个分段选择器，而不是搜索：

未折叠	折叠

基本上我想要实现的是：

从上到下淡出图像。我试图用覆盖来做，但它看起来并不好