SwiftUI DIY旋转预览无法正常工作

编程问答 2022-08-13

问题描述

我最近从Storyboard切换到SwiftUI，并且在尝试预览我的作品时遇到了困难。我的目标是 iPad Air 3rd Gen ，它仅接受横向模式。

如here所述，XCode当前不支持它。有人建议您可以修复预览的大小来模拟旋转。但是，效果却不一样，与原始设备相比，插座看起来太小了。

这是我使用 iPad Air 3rd gen （2224 x 1668像素）的示例

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView().rotationEffect(Angle(degrees: 90)) // to simulate the rotation on device
    }
}

Preview1


struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView().previewLayout(.fixed(width: 2224,height: 1668)) // To simulate device size
    }
}

Preview2

如您所见，两个预览不匹配，并且模拟器上的结果与rotationEffect符合第一个预览，但每次我强迫我倾斜头想看我的预览。

在SwiftUI中还有另一种DIY旋转的方法吗？

解决方法

我想我知道这里发生了什么。我没有考虑比例因子。

就像在Assets.xcasset中一样，您可以为图像定义比例因子（@ 1x @ 2x @ 3x），就像预览一样：当您固定预览的大小时，它会自动假定因素为 @ 1x 。

具有 iPhone XS Max 的示例-尺寸1242 x 2688和比例因子@ 3x：

   ContentView().previewDevice(PreviewDevice(rawValue: "iPhone XS Max"))

Preview1 

   // Raw size of an iPhone XS Max
   ContentView().previewLayout(.fixed(width: 1242,height: 2688))

Preview2 

   // Scale factor taken into account
   ContentView().previewLayout(.fixed(width: 1242/3,height: 2688/3))

Preview3

总而言之，这意味着您没有将实际的像素大小放入previewLayout(.fixed(...))中，而是将 Points （点）放入了文本。这是Link，为我们提供了每种设备的分辨率和比例因子。

请勿在.scaleEffect(3)上使用ContentView，它只会缩放视图，并且组件将超出范围。

最后，对于 iPhone 6、6s，7和8 Plus ，由于下采样，本机比例因子与UIKit比例因子不同（2.608对3）。在预览版中进行了一些测试之后，似乎我们必须使用 UIKit Factor 以获得更好的呈现效果。

previewpreviewswiftswiftswiftswiftswiftui