主页 / coding / 问题 / 78467353
Accepted
giik
Asked: 2024-05-12 17:41:46 +0800 CST

为什么 ResolvedSymbol 始终具有 Canvas 视图大小？

  • 772

那么，如果想要Canvas知道已解析符号的大小（边界框），例如，相对于其他符号或直接绘制到其中的路径的放置，通过检查GraphicsContext.ResolvedSymbol.size属性是不可能的吗？

这令人惊讶。不是我想做的事情的障碍，但想了解为什么会出现这种特殊行为（如果有人知道并可以解释的话）？

下面重现了关于切换按钮输出的简单示例

canvas size: (400.0, 350.0); symbol size: (400.0, 350.0)
toggled
canvas size: (500.0, 450.0); symbol size: (500.0, 450.0)
toggled
canvas size: (400.0, 350.0); symbol size: (400.0, 350.0)

struct ContentView: View {
  @State private var large = false
  var body: some View {
    VStack {
      Button {
        large.toggle()
        print("toggled")
      } label: {
        Text("Toggle Size")
      }
      Spacer()
      Canvas { context, size in
        let s0 = context.resolveSymbol(id: 0)!
        print("canvas size: \(size); symbol size: \(s0.size)")
        context.draw(s0, in: CGRect(origin: .zero, size: size))
      } symbols: {
        Path(ellipseIn: CGRect(origin: .zero, size: CGSize(width: 300, height: 300)))
          .stroke(.green, lineWidth: 10)
          .border(.blue)
          .tag(0)
      }
      .frame(width: large ? 500 : 400, height: large ? 450 : 350)
    }.padding()
  }
}
swiftui

2 个回答

  1. Best Answer

    我认为当您解析符号并检查其大小时，您看到的是的边界矩形Path，即：

    包含所有路径段的矩形

    （参考路径文档）。

    因此，当以这种方式创建符号时，边界矩形似乎使用了所有可用空间。.frame您可以通过将修改器应用于 来将其限制为与椭圆相同的大小Path：

    Path(ellipseIn: CGRect(origin: .zero, size: CGSize(width: 300, height: 300)))
    .stroke(.green, lineWidth: 10)
    .frame(width: 300, height: 300) // 👈 HERE
    .border(.blue)
    .tag(0)
    • 1

  2. 作为记录，这里是原始问题的修改代码，说明了Benzy Neez提供的答案。

    第一个.draw是未经修改的原始“圆”，第二个是缩放以适应视图Canvas。

    struct ContentView: View {
  @State private var large = false
  let p1 = Path(ellipseIn: CGRect(origin: .zero, size: CGSize(width: 200, height: 200)))

  var body: some View {
    VStack {
      Button {
        large.toggle()
        print("toggled")
      } label: {
        Text("Toggle Size")
      }
      Spacer()
      Canvas { context, size in
        let s0 = context.resolveSymbol(id: 0)!
        print("canvas size: \(size); symbol size: \(s0.size)")
        context.draw(s0, in: p1.boundingRect)
        context.draw(s0, in: CGRect(origin: .zero, size: size))
      } symbols: {
        p1
          .stroke(.green, lineWidth: 10)
          .frame(width: p1.boundingRect.width, height: p1.boundingRect.height)
          .border(.blue)
          .tag(0)
      }
      .frame(width: large ? 500 : 350, height: large ? 400 : 250)
    }.padding()
  }
}
    • 0

相关问题