如何响应动态文本大小的更改来更改懒惰网格GridItem的固定大小?

问题描述

下面的代码使用LazyVGrid来实现控件的布局,以便所有内容都像这样排列:

enter image description here

尤其是,滑块的末端全部对齐,并且符号彼此居中对齐。我已经研究出如何调整符号和数字读数的GridItem的大小,以使其成为其内容的“正确大小”-灵活的或自适应的GridItems都无法做到这一点-考虑动态类型

在测试中,只要用户在应用程序激活后不更改其动态类型大小,此方法就非常有效。如果这样做,类型(和符号)将按照其应有的方式进行调整,但是GridItem的大小将保持固定为其初始值。这会导致数字在小数点后换行。

是否有一种方法可以调整GridItem的大小以响应动态类型的更改,或者有更好的方法来进行此布局?

import SwiftUI

struct ProtoGrid: View {
   let gridItems = [
      GridItem(.fixed(UIImage(systemName: "ruler",withConfiguration: UIImage.SymbolConfiguration(textStyle: .body,scale: .large))!.size.width)),GridItem(.flexible(minimum: 40,maximum: .infinity)),GridItem(.fixed(("00.00" as NSString).size(withAttributes: [NSAttributedString.Key.font: UIFont.preferredFont(forTextStyle: .body)]).width + 4),alignment: .trailing)
   ]
   @State var index1 = 5.0
   @State var index2 = 5.0
   @State var index3 = 5.0
   var body: some View {
      VStack {
         Rectangle()
            .fill(Color.red)
         LazyVGrid(columns: gridItems,spacing: 12) {
            Image(systemName: "person").imageScale(.large)
            Slider(value: $index1,in: 0...10)
            Text("\(String(format: "%.2f",index1))").font(Font.system(.body).monospacedDigit())
            Image(systemName: "megaphone").imageScale(.large)
            Slider(value: $index2,index2))").font(Font.system(.body).monospacedDigit())
            Image(systemName: "ruler").imageScale(.large)
            Slider(value: $index3,index3))").font(Font.system(.body).monospacedDigit())
         }
         .padding()
      }
   }
}

struct ProtoGrid_Previews: PreviewProvider {
    static var previews: some View {
        ProtoGrid()
         .previewDevice("iPhone 11 Pro")
    }
}
111

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)