SwiftUI GeometryReader 体积小巧
Posted
技术标签:
【中文标题】SwiftUI GeometryReader 体积小巧【英文标题】:SwiftUI GeometryReader compact size 【发布时间】:2020-04-19 06:34:24 【问题描述】:我希望我的LoadingTitle
的宽度为屏幕的 70%,因此我使用了GeometryReader
,但它会使垂直尺寸扩大,而我的LoadingTitle
占用更多的垂直空间。我希望它尽可能紧凑。
当使用硬编码width: 300
时,我得到了正确的布局(相对宽度除外):
struct ContentView: View
var body: some View
VStack(alignment: .leading, spacing: 0)
LoadingTitle()
Color.blue
struct LoadingTitle: View
var body: some View
HStack()
Color.gray
.frame(width: 300, height: 22)
.padding(.vertical, 20)
.border(Color.gray, width: 1)
现在,如果我将LoadingTitle
的body
包装在GeometryReader
中,我可以获得正确的相对大小,但GeometryReader
会垂直扩展我的视图:
struct LoadingTitle: View
var body: some View
GeometryReader geo in
HStack()
Color.gray
.frame(width: geo.size.width * 0.7, height: 22, alignment: .leading)
Spacer()
.padding(.vertical, 20)
.border(Color.gray, width: 1)
我尝试在GeometryReader
上将.fixedSize(horizontal: false, vertical: true)
用作other suggested,但结果视图过于紧凑,并且其所有填充都被忽略了:
如何以相对宽度实现第一个屏幕截图的布局?
【问题讨论】:
【参考方案1】:这是可能的方法。使用 Xcode 11.4 / ios 13.4 测试(未更改 ContentView)
struct LoadingTitle: View
var body: some View
VStack Color.clear
.frame(height: 22).frame(maxWidth: .infinity)
.padding(.vertical, 20)
.overlay(
GeometryReader geo in
HStack
HStack
Color.gray
.frame(width: geo.size.width * 0.7, height: 22)
.padding(.vertical, 20)
.border(Color.gray, width: 1)
Spacer()
)
【讨论】:
很好,谢谢。我相信我们也可以使用Group
代替VStack
并从GeometryReader
中删除外部HStack
【参考方案2】:
由于标题的高度是固定的,
struct LoadingTitle1: View
var body: some View
GeometryReader geo in
HStack
Color.gray.frame(width: geo.size.width * 0.7)
.padding(.vertical, 20)
.border(Color.gray, width: 1)
Spacer()
.frame(height: 62)
【讨论】:
以上是关于SwiftUI GeometryReader 体积小巧的主要内容,如果未能解决你的问题,请参考以下文章
SwiftUI - 计算 ScrollView 中长 GeometryReader 的高度
SwiftUI - AppStorage 不适用于 GeometryReader
我们如何在 SwiftUI 中制作自定义 GeometryReader?
在 ScrollView 中使用 GeometryReader 的 SwiftUI 布局