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

Posted 2023-02-24

【中文标题】SwiftUI DIY 旋转预览无法正常工作

【英文标题】：SwiftUI DIY rotate preview not working properly

【发布时间】：2020-08-28 17:14:36

【问题描述】：

我最近从 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
    

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

如您所见，两个预览不匹配，模拟器上的结果与rotationEffect的第一个预览一致，但它迫使我每次想歪头看我的预览。

还有其他方法可以在 SwiftUI 中 DIY 旋转吗？

【参考方案1】：

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

就像在Assets.xcasset 中一样，您可以为图像定义一个比例因子（@1x @2x @3x），看起来预览也是如此：当您修复预览的大小时，它会自动假定该因子是 @1x。

以 iPhone XS Max 为例 - 尺寸 1242 x 2688 和比例因子 @3x：

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

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

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

---

总而言之，这意味着您不会将实际的像素大小放入previewLayout(.fixed(...))，而是放入Points。这是一个Link，它为我们提供了每个设备的分辨率和比例因子。

不要在ContentView 上使用.scaleEffect(3)，它只会缩放视图，组件会超出范围。

最后，对于 iPhone 6、6s、7 和 8 Plus，由于下采样，Native Scale factor 与 UIKit Scale factor 不同（2.608 对 3）。在 Preview 中进行了一些测试后，我们似乎必须使用 UIKit Factor 来获得更好的渲染效果。