如何在 SwiftUI 中制作一个固定初始大小的响应式容器？

Question

我想投资于我的应用程序的可访问性。所以我希望我的 UI 能够支持动态类型。

问题是我的搜索栏需要高度为 43，除非用户启用了动态类型，然后我需要搜索栏垂直增长以支持更大的文本。

如何使其具有响应能力，同时初始固定大小为 43？

struct SearchBar: View {
@Binding var searchText: String

var body: some View {
    RoundedRectangle(cornerRadius: 8)
        .foregroundStyle(.white)
        .overlay{
            HStack{
                Image(systemName: "magnifyingglass")
                    
                    .padding(.leading, 12)
                Rectangle()
                    .frame(width: 1,height: 23)
                    .padding(.vertical)
             
                TextField("Pesquisar...", text: $searchText)
                   
                Spacer()
            }
        }
        .shadow(radius: 6)
        
}

}

Answer 1

要支持动态类型，您可以使用

@ScaledMetric

。这里我根据动态类型缩放了分隔线和 HStack 的高度。

@Binding var searchText: String
@ScaledMetric var searchBarHeight = 43
@ScaledMetric var dividerHeight = 23

var body: some View {
    RoundedRectangle(cornerRadius: 8)
        .foregroundStyle(.white)
        .overlay{
            HStack{
                Image(systemName: "magnifyingglass")
                    
                    .padding(.leading, 12)
                Rectangle()
                    .frame(width: 1,height: max(dividerHeight, 23))
                    .padding(.vertical)
             
                TextField("Pesquisar...", text: $searchText)
                   
                Spacer()
            }
        }
        .shadow(radius: 6)
        .frame(height: max(searchBarHeight, 43))
    }
}

这里我使用了

max

来保持最小高度为 43 和 23，不过我建议你直接使用

dividerHeight

和

searchBarHeight

。动态类型不仅仅是让文本变大，用户还可以选择将其变小，你应该尊重他们的选择。