【问题标题】:GeometryReader Takes Extra Space in SwiftUIGeometryReader 在 SwiftUI 中占用额外空间
【发布时间】:2020-06-12 19:51:17
【问题描述】:

下面的代码是创建一个自定义按钮

import SwiftUI

let skyBlue = Color(red: 75/255, green: 170/255, blue: 193/255)

struct RegisterButtonView: View {
    var body: some View {
        GeometryReader { geo in
            HStack {
                Spacer()

                Text("Register")
                    .foregroundColor(Color(.white))
                    .font(.system(size: geo.size.width / 20))
                    .bold()

                Spacer()
            }
            .frame(width: geo.size.width * 4/9, height: geo.size.height / 7)
            .background(skyBlue)
            .cornerRadius(60)
        }

    }
}

struct RegisterButtonView_Previews: PreviewProvider {
    static var previews: some View {
        RegisterButtonView()
    }
}

但是,整个按钮视图包含GeometryReader引入的额外空间,所以当我把这个视图放到根视图时,空间无法消除。

【问题讨论】:

  • 欢迎加入。这不是额外的空间 - GeometryReader 确实消耗了 all 可用空间。这是一个功能。
  • 谢谢,但是我可以让我的 RegisterButtonView 只包含它的形状而没有空白吗? (如果我必须使用 GeometryReader)
  • 问题是RegisterButtonView的大小是根据Text的大小,Text的大小是根据它的字体大小,字体大小是基于GeometryReader 的大小。 GeometryReader 采用其父级赋予它的所有大小。在这种情况下,父视图是根视图。那么告诉我们您希望RegisterButtonView 的大小基于什么,如果不是基于GeometryReader 的大小?
  • 我实际上希望它的大小基于按钮的形状,我认为是HStack

标签: ios swift button swiftui geometryreader


【解决方案1】:

您可能需要直接设置 GeoReader 的框架。

    struct RegisterButtonView: View {
var body: some View {
    GeometryReader { geo in
        HStack {
            Spacer()

            Text("Register")
                .foregroundColor(Color(.white))
                .font(.system(size: geo.size.width / 20 * 9 / 4))
                .bold()

            Spacer()
        }
        .frame(width: geo.size.width , height: geo.size.height )
        .background(skyBlue)
        .cornerRadius(60)
    }.frame(width: UIScreen.main.bounds.width * 4/9 , height: UIScreen.main.bounds.height / 7)

}
}

【讨论】:

  • 但是设置 GeoReader 实际上会拉伸整个视图,而不是仅仅切掉空白。
猜你喜欢
  • 2018-06-11
  • 1970-01-01
  • 2021-09-10
  • 2012-02-18
  • 2012-01-03
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-11-01
相关资源
最近更新 更多