iPadOS Widget的Canvas与Device目标区别及正确尺寸获取咨询

我正尝试通过switch语句，根据当前UIScreen.main.bounds.size获取iOS和iPadOS的小、中、大三种Widget尺寸。iOS端逻辑已正常运行，但不清楚iPadOS下应使用哪组Widget尺寸。参考相关iPadOS Widget设计资料及苹果官方Widget设计指南后，发现存在Canvas和Device两种目标类型，想了解二者区别及应选用哪一个获取正确Widget尺寸。

以下是我的实现代码示例，目前iPadOS对应的尺寸值尚未确定：

struct Widget { 
    var smallWidget = CGSize()
    var mediumWidget = CGSize()
    var largeWidget = CGSize()
}
var size: Widget { 
    switch UIScreen.main.bounds.size { 

// IOS    

    // iPhone 14 Pro Max
    case CGSize(width: 430, height: 932):   
        return Widget(smallWidget: CGSize(width: 170, height: 170), mediumWidget: CGSize(width: 364, height: 170), largeWidget: CGSize(width: 364, height: 382))
    
    // iPhone 14 Plus, iPhone 13 Pro Max, iPhone 12 Pro Max
    case CGSize(width: 428, height: 926):   
        return Widget(smallWidget: CGSize(width: 170, height: 170), mediumWidget: CGSize(width: 364, height: 170), largeWidget: CGSize(width: 364, height: 382))
      
    // iPhone 11 Pro Max, iPhone 11, iPhone XR, iPhone XS Max
    case CGSize(width: 414, height: 896):   
        return Widget(smallWidget: CGSize(width: 169, height: 169), mediumWidget: CGSize(width: 360, height: 169), largeWidget: CGSize(width: 360, height: 379))
    
    // iPhone 8 Plus, iPhone 7 Plus, iPhone 6s Plus, iPhone 6 Plus
    case CGSize(width: 414, height: 736):   
        return Widget(smallWidget: CGSize(width: 159, height: 159), mediumWidget: CGSize(width: 348, height: 157), largeWidget: CGSize(width: 348, height: 357))
        
    // iPhone 14 Pro
    case CGSize(width: 393, height: 852):   
        return Widget(smallWidget: CGSize(width: 158, height: 158), mediumWidget: CGSize(width: 338, height: 158), largeWidget: CGSize(width: 338, height: 354))
        
    // iPhone 14, iPhone 13, iPhone 13 Pro, iPhone 12, iPhone 12 Pro
    case CGSize(width: 390, height: 844):   
        return Widget(smallWidget: CGSize(width: 158, height: 158), mediumWidget: CGSize(width: 338, height: 158), largeWidget: CGSize(width: 338, height: 354))
        
    // iPhone 13 Mini, iPhone 12 Mini, iPhone 11 Pro, iPhone XS, iPhone X
    case CGSize(width: 375, height: 812):   
        return Widget(smallWidget: CGSize(width: 155, height: 155), mediumWidget: CGSize(width: 329, height: 155), largeWidget: CGSize(width: 329, height: 345))
        
    // iPhone SE 3, iPhone SE 2, iPhone 8, iPhone 7, iPhone 6s, iPhone 6
    case CGSize(width: 375, height: 667):   
        return Widget(smallWidget: CGSize(width: 148, height: 148), mediumWidget: CGSize(width: 321, height: 148), largeWidget: CGSize(width: 321, height: 324))
        
// iPadOS       

    // iPad Pro 12.9英寸（第3-6代）
    case CGSize(width: 1024, height: 1366):
        return Widget(smallWidget: CGSize(width: 320, height: 320), mediumWidget: CGSize(width: 668, height: 320), largeWidget: CGSize(width: 668, height: 688))
    
    // iPad Pro 11英寸（第1-4代）、iPad Air（第4-5代）、iPad（第10代）
    case CGSize(width: 834, height: 1194):
        return Widget(smallWidget: CGSize(width: 269, height: 269), mediumWidget: CGSize(width: 556, height: 269), largeWidget: CGSize(width: 556, height: 578))
    
    // iPad（第7-9代）、iPad mini（第6代）
    case CGSize(width: 768, height: 1024):
        return Widget(smallWidget: CGSize(width: 246, height: 246), mediumWidget: CGSize(width: 508, height: 246), largeWidget: CGSize(width: 508, height: 526))
        
    default:
        return Widget(smallWidget: CGSize(width: 246, height: 246), mediumWidget: CGSize(width: 508, height: 246), largeWidget: CGSize(width: 508, height: 526))
    }
}

Canvas与Device目标类型的区别 #

• Device尺寸：是Widget在设备主屏幕上的实际显示尺寸，由系统根据设备屏幕分辨率、缩放因子计算得出，直接对应用户看到的真实大小，是代码中需要使用的运行时尺寸。
• Canvas尺寸：属于设计阶段的基准画布尺寸，用于Sketch、Figma等设计工具制作视觉稿，通常是@2x或@3x的矢量尺寸，并非代码运行时的实际取值。

注意事项 #

1. 所有尺寸均基于pt单位，iOS和iPadOS系统会自动处理像素缩放（@2x/@3x），无需手动转换。
2. 若遇到未覆盖的iPad机型，default分支可采用iPad（第7-9代）的尺寸作为兜底，确保兼容性。

内容的提问来源于stack exchange，提问作者Laurin