缩放公制在Apple Watch上不起作用

Question

我正试图针对Apple Watch进行此操作：

@ScaledMetric var widthScale: CGFloat = 1

然后将widthScale应用于某些SwiftUI View元素的框架：

.frame(width: myFrame.width * widthScale, height: myHeight)

只是它根本没有改变。字体大小确实会发生变化，但widthScale始终保持在1.0。

我是不是搞错了？我发现虫子了吗？它不应该在WatchOS上使用吗？

Answer 1

所以我通过反复试验发现了什么：

1. @ScaledMetric应该在应用它的View中定义，而不是在其他地方的structType中
2. @Scaled Metric值四舍五入为整像素。因此，根据显示密度x2或x3，它被四舍五入到1/2半或1/3。使用此视图和预览可以查看不同的操作比例：

import SwiftUI
struct ScaledMetricText: View {
@ScaledMetric(relativeTo: .caption) var widthScaleHundred: CGFloat = 100.0
@ScaledMetric(relativeTo: .caption) var widthScaleTen: CGFloat = 10.0
@ScaledMetric(relativeTo: .caption) var widthScaleOne: CGFloat = 1.0
var body: some View {
VStack {
Text("Unscaled")
.fixedSize(horizontal: true, vertical: false)
.frame(width: 100)
.background(Color(.lightGray))
.padding(3)
Text("100 -> (widthScaleHundred)")
.fixedSize(horizontal: true, vertical: false)
.frame(width: 100 * widthScaleHundred / 100)
.background(Color(.lightGray))
Text("10 -> (widthScaleTen)")
.fixedSize(horizontal: true, vertical: false)
.frame(width: 100 * widthScaleTen / 10)
.background(Color(.lightGray))
.padding(3)
Text("1 -> (widthScaleOne)")
.fixedSize(horizontal: true, vertical: false)
.frame(width: 100 * widthScaleOne)
.background(Color(.lightGray))
}
.font(.caption)
}
}
struct ScaledMetricText_Previews: PreviewProvider {
static var previews: some View {
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "Apple Watch Series 6 - 40mm"))
.environment(.sizeCategory, ContentSizeCategory.small)
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "Apple Watch Series 3 - 38mm"))
.environment(.sizeCategory, ContentSizeCategory.extraExtraExtraLarge)
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "Apple Watch Series 6 - 44mm"))
.environment(.sizeCategory, ContentSizeCategory.small)
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "Apple Watch Series 3 - 42mm"))
.environment(.sizeCategory, ContentSizeCategory.extraExtraExtraLarge)
}
}

或iOS预览：

struct ScaledMetricText_Previews: PreviewProvider {
static var previews: some View {
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "iPhone 8"))
.environment(.sizeCategory, ContentSizeCategory.small)
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "iPhone 8"))
.environment(.sizeCategory, ContentSizeCategory.extraExtraExtraLarge)
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "iPhone 12 Pro Max"))
.environment(.sizeCategory, ContentSizeCategory.small)
ScaledMetricText()
.previewDevice(PreviewDevice(rawValue: "iPhone 12 Pro Max"))
.environment(.sizeCategory, ContentSizeCategory.extraExtraExtraLarge)
}
}

Answer 2

通过下面的代码发现它确实有效。原则上，在模拟器和我的手表。仍然需要弄清楚为什么上面的问题不起作用。

struct TextLabelsView: View {
var body: some View {
ScrollView(.vertical) {
DynamicResizingView()
}
}
}
struct DynamicResizingView: View {
@ScaledMetric(relativeTo: .largeTitle) var scaledLargeTitle: CGFloat = 10
@ScaledMetric(relativeTo: .title) var scaledTitle: CGFloat = 10
@ScaledMetric(relativeTo: .headline) var scaledHeadline: CGFloat = 10
@ScaledMetric(relativeTo: .subheadline) var scaledSubheadline: CGFloat = 10
@ScaledMetric(relativeTo: .body) var scaledBody: CGFloat = 10
@ScaledMetric(relativeTo: .callout) var scaledCallout: CGFloat = 10
@ScaledMetric(relativeTo: .caption) var scaledCaption: CGFloat = 10
@ScaledMetric(relativeTo: .footnote) var scaledFootnote: CGFloat = 10
@ScaledMetric() var scaledNothing: CGFloat = 10
var body: some View {
VStack(alignment: .leading) {
Text("Dynamic Base10").font(Font.system(size:10))
ScaledText(label: "LargeTitle", size: scaledLargeTitle)
ScaledText(label: "Title", size: scaledTitle)
ScaledText(label: "Headline", size: scaledHeadline)
ScaledText(label: "Subheadline", size: scaledSubheadline)
ScaledText(label: "Body", size: scaledBody)
ScaledText(label: "Callout", size: scaledCallout)
ScaledText(label: "Caption", size: scaledCaption)
ScaledText(label: "Footnote", size: scaledFootnote)
ScaledText(label: "Not Specified", size: scaledNothing)
}
}
}
struct ScaledText: View {
var label: String
var size: CGFloat
var body: some View {
Text("Scaled by (label) to (size, specifier: "%.2f")")
.font(Font.system(size: size))
}
}
struct TextLabelsView_Previews: PreviewProvider {
static var previews: some View {
TextLabelsView()
.environment(.sizeCategory, ContentSizeCategory.accessibilityExtraExtraExtraLarge)
TextLabelsView()
.environment(.sizeCategory, ContentSizeCategory.small)
}
}

有了这个，您可以看到不同字体的不同缩放因子。TextStyle|s.