iOS 小组件必须要提供所有尺寸吗

原创

mob64ca12d8821d 2024-08-25 06:18:53 ©著作权

©著作权归作者所有：来自51CTO博客作者mob64ca12d8821d的原创作品，请联系作者获取转载授权，否则将追究法律责任

iOS 小组件必须要提供所有尺寸吗？

在 iOS 14 中，Apple 推出了小组件（Widget）的功能，为用户提供了丰富的个性化信息展示。小组件可以展示应用的重要信息，方便用户随时查看。然而，在开发小组件时，很多开发者都会问：“我是否必须为我的小组件提供所有可用的尺寸？”本文将对此进行探讨，并给出相应的代码示例。

小组件尺寸概述

在 iOS 中，小组件的尺寸主要分为以下几种：

小尺寸（Small）：长宽各为 2x2 的方形，显示内容相对有限。
中尺寸（Medium）：长宽为 2x4 的矩形，能够展示更多信息。
大尺寸（Large）：长宽为 4x4 的方形，适合显示大量信息或复杂的内容。

每种尺寸都有其独特的用途和场景，开发者在设计小组件时需要认真考虑。

必须提供所有尺寸吗？

对于大多数开发者而言，提供所有尺寸的小组件并非强制要求。但 Apple 强烈推荐支持不同尺寸的小组件，以便更好地满足用户的需求。一个灵活的小组件可以提供良好的用户体验，适应不同的屏幕和使用场景。

如果你的小组件内容相对简单，确实可以选择只提供小尺寸或中尺寸。但是，如果你的应用数据丰富，提供多种尺寸会让用户在不同的使用场景下，都能便捷地获取信息。

示例代码

下面是一个简单的 SwiftUI 小组件示例，它展示了一条消息。如果我们想让这个小组件支持多种尺寸，可以通过如下方式实现。

import WidgetKit
import SwiftUI

struct MessageEntry: TimelineEntry {
    let date: Date
    let message: String
}

struct Provider: TimelineProvider {
    func placeholder(in context: Context) -> MessageEntry {
        MessageEntry(date: Date(), message: "Hello, Widget!")
    }

    func getSnapshot(in context: Context, completion: @escaping (MessageEntry) -> Void) {
        let entry = MessageEntry(date: Date(), message: "Hello, Widget!")
        completion(entry)
    }

    func getTimeline(in context: Context, completion: @escaping (Timeline<MessageEntry>) -> Void) {
        let entries = [MessageEntry(date: Date(), message: "Hello, Widget!")]
        let timeline = Timeline(entries: entries, policy: .atEnd)
        completion(timeline)
    }
}

struct MessageWidget : Widget {
    let kind: String = "MessageWidget"

    var body: some WidgetConfiguration {
        StaticConfiguration(kind: kind, provider: Provider()) { entry in
            MessageView(entry: entry)
        }
        .configurationDisplayName("Message Widget")
        .description("This is an example widget.")
        .supportedFamilies([.small, .medium, .large])  // 支持多种尺寸
    }
}

struct MessageView: View {
    let entry: MessageEntry

    var body: some View {
        VStack {
            Text(entry.message)
                .font(.headline)
                .padding()
        }
    }
}

在上面的代码中，我们使用 supportedFamilies 方法来指定小组件支持的尺寸。在这个示例中，我们支持小、中和大尺寸的小组件。这允许应用在不同的环境中灵活显示信息。

状态图

接下来，我们通过状态图来说明小组件的尺寸选择和展现过程。例如，假设我们进入小组件的配置界面，用户可以选择适合其需求的尺寸。

stateDiagram
    [*] --> 选择尺寸
    选择尺寸 --> 小尺寸
    选择尺寸 --> 中尺寸
    选择尺寸 --> 大尺寸
    小尺寸 --> 预览小组件
    中尺寸 --> 预览中组件
    大尺寸 --> 预览大组件
    预览小组件 --> [*]
    预览中组件 --> [*]
    预览大组件 --> [*]

状态图清晰地展示了用户选择小组件尺寸后的流程，以及最终生成预览的状态。