WWDC Quick Look 💓 By SwiftGGTeam
Meet WidgetKit

Meet WidgetKit

元の動画を見る

ハイライト

WidgetKit は、iOS 14 の SwiftUI とタイムライン メカニズムを使用してアプリ コンテンツをシステムに事前配信し、ホーム画面、Today View、iPad ホーム画面、macOS Big Sur 通知センターに、一目で読み取れ、クリックしてアプリに戻ることができる情報カードを表示できるようにします。

主要内容

ホーム画面上のスペースは高価です。ユーザーは 1 日に何度もホーム画面に戻りますが、一度に滞在するのはわずか数秒です。小さいサイズのウィジェットには、アイコン 4 つほどの領域しかありません。ボタン、スクロール リスト、または複雑なコントロールが内部に詰め込まれていると、ユーザーは理解する前に離れてしまいます。

これは WidgetKit の出発点でもあります。 Apple では、ウィジェットを継続的に実行される小さなアプリではなく、一目で確認できるコンテンツの投影として定義しています。コンテンツが焦点であり、クリックするとユーザーはメイン アプリに戻るだけです。小さいサイズでは、ウィジェット全体のタップ ターゲットは 1 つだけです。中規模および大規模になると、SwiftUI の Link 異なるエリアが異なる場所に入ることができるようになります。 (01:5012:27)

新しいシステム機能により、2 つの古い問題が解決されます。まず、ウィジェットはインターフェイスを描画する前にアプリ プロセスの開始を待つ必要がありません。 WidgetKit 拡張機能は、バックグラウンドでの時間を含む一連の SwiftUI ビューを返します。システムはこれらのビュー階層をタイムラインに従って保存し、正しい時間に表示します。次に、同じ事前準備コンテンツをウィジェット ギャラリーでも使用でき、追加する前にユーザーに表示されるのは実際のウィジェットのステータスです。 (05:4413:23)

WidgetKit は、関連性とパーソナライゼーションもモデルに組み込みます。スマート スタックは、デバイス上のインテリジェンスを使用して、適切なウィジェットを自動的に上部に移動します。開発者は、Siri ショートカットの寄付を使用して、システムがユーザーの習慣を理解できるようにしたり、タイムライン エントリの関連性を提供したりすることもできます。構成はインテントに任せられます。システムはインテントから編集インターフェースを自動生成できます。ユーザーはウィジェットを長押しすることで、都市、株式、その他のパラメーターを選択できます。 (02:5104:0521:13

したがって、WidgetKit を作成する最初のステップは、ホームページの縮小バージョンを作成することではありません。より安定した方法は、まず一目で読むのに最適なアプリ内の情報を見つけてから、そのサイズ、更新時間、クリックポイント、設定が必要かどうかを決定することです。

詳細

ウィジェットの種類を定義する

(08:10) ウィジェット定義は次のもので構成されます。 kindconfigurationsupportedFamilies そして placeholderkind 拡張機能で複数のウィジェット タイプをサポートできるようになります。 StaticConfiguration ユーザー構成を必要としないシナリオに適しています。プレースホルダーは、このウィジェット タイプの代表的なコンテンツのみを表示でき、ユーザー データを含めることはできません。

@main
public struct SampleWidget: Widget {
    private let kind: String = "SampleWidget"

    public var body: some WidgetConfiguration {
        StaticConfiguration(kind: kind,
                            provider: Provider(),
                            placeholder: PlaceholderView()) { entry in
                                SampleWidgetEntryView(entry: entry)
                            }
        .configurationDisplayName("My Widget")
        .description("This is an example widget.")
    }
}

キーポイント:

  • @main ウィジェット拡張機能のエントリ ポイントをマークします。
  • kind は、このタイプのウィジェットを識別するためにシステムによって使用される文字列です。
  • provider スナップショットとタイムラインを提供する責任があります。
  • placeholder はデフォルトの表示コンテンツであり、システムによって時々要求されるだけです。
  • configurationDisplayName そして description ウィジェットを追加するためのインターフェイスに表示されます。

タイムラインを使用して表示を促進する

(13:13) WidgetKit の実行モデルは、プレースホルダー、スナップショット、タイムラインの 3 種類の UI に分かれています。スナップショットは、エントリをすばやく返すために使用されます。ウィジェット ギャラリーには通常、実際のウィジェットのプレビューが表示されます。タイムラインは、各時点でどのビューを表示するかをシステムに指示する一連のエントリと日付です。

public struct Provider: TimelineProvider {

    public func snapshot(with context: Context,
                         completion: @escaping (SimpleEntry) -> ()) {
        let entry = SimpleEntry(date: Date())
        completion(entry)
    }

    public func timeline(with context: Context,
                         completion: @escaping (Timeline<Entry>) -> ()) {
        let entry = SimpleEntry(date: Date())
        let timeline = Timeline(entries: [entry, entry], policy: .atEnd)
        completion(timeline)
    }
}

キーポイント:

  • snapshot 高速化を目指して単一のエントリを返します。
  • timeline エントリ配列とリロード ポリシーを返します。
  • .atEnd タイムラインが終了した後、システムが次のタイムラインを要求することを示します。
  • トランスクリプトでは、特定の日付を指定してリロードすることも、システムにリロードしないように指示できることも述べられています。
  • タイムライン エントリはシステムによってディスクにシリアル化されるため、ホーム画面が表示されているときにアプリのランチャー プロセスを開始する必要はありません。

コントロールの更新、リアルタイムの実行エクスペリエンスなし

(15:03) リロードとは、システムが拡張機能を起動し、新しいタイムラインを要求する時間です。システムは、リロード ポリシー、ウィジェットの表示頻度、デバイス環境の変化を参照します。アプリがバックグラウンド通知を受信した場合、またはユーザーがウィジェットに影響する変更をフォアグラウンド アプリで行った場合、アプリは次の方法で更新をリクエストできます。 WidgetCenter

キーポイント:

  • 共通のタイムラインは、現在の瞬間を返すだけではなく、数日間にわたるものである必要があります。
  • 頻繁に表示されるウィジェットはより多くのリロードを取得し、より頻繁に表示されないウィジェットはより少ないリロードを取得します。
  • WidgetCenter 種類に応じてリロードしたり、タイムライン全体をリロードしたり、現在の構成リストを読み取ることもできます。
  • サーバーにアクセスする必要がある場合は、バックグラウンド URLSessions を使用でき、結果は次の方法で拡張機能に渡されます。 onBackgroundURLSessionEvents
  • バックグラウンド処理とネットワークにはシステムの予算があり、ウィジェットは毎秒更新するのには適していません。

インテントを使用して構成する

(18:50) ウィジェットをパーソナライズする必要がある場合、WidgetKit はインテントを使用して構成を伝えます。天気ウィジェットの都市と株式ウィジェットの銘柄記号が典型的なパラメータです。 iOS 14 では、インテントがアプリ内インテントの処理をサポートできるようになり、アプリは設定インターフェイスで質問に直接答えることができます。

@main
public struct SampleWidget: Widget {
    private let kind: String = "SampleWidget"

    public var body: some WidgetConfiguration {
        IntentConfiguration(kind: kind,
                    intent: ConfigurationIntent.self
                            provider: Provider(),
                            placeholder: PlaceholderView()) { entry in
                                SampleWidgetEntryView(entry: entry)
                            }
        .configurationDisplayName("My Widget")
        .description("This is an example widget.")
    }
}

キーポイント:

  • IntentConfiguration 置き換える StaticConfiguration
  • ConfigurationIntent.self このウィジェットが使用するインテント パラメータのタイプをシステムに知らせます。
  • ユーザーがウィジェットを編集すると、システムはインテントに基づいて構成インターフェイスを自動的に生成します。
  • パラメーターに動的なオプションが必要な場合、Intents 拡張機能またはアプリは候補値を返すことができます。

タイムラインに構成と関連性を受信させます

(20:54) タイムラインを構成した後、プロバイダーも次のように置き換える必要があります。 IntentTimelineProvider。タイムラインメソッドは受け取ります configurationであり、開発者はこれらの Intent パラメータを使用して、対応するエントリを生成します。スマート スタックの関連性では、ショートカットの寄付と TimelineEntryRelevance ウィジェットをいつ上部に移動するかをシステムが決定できるようにします。

public struct Provider: IntentTimelineProvider {

    public func timeline(for configuration: ConfigurationIntent, with context: Context,
                         completion: @escaping (Timeline<Entry>) -> ()) {
        let entry = SimpleEntry(date: Date(), configuration: configuration)

        // generate a timeline based on the values of the Intent

       completion(timeline)
    }
}

キーポイント:

  • timeline(for:with:completion:) を取得します configuration ユーザーが選択したもの。
  • エントリはこの設定を保存し、表示内容を決定するために使用できます。
  • 同じ場合 INIntent がウィジェットの背後で使用され、ユーザーがアプリ内で関連するアクションを実行した後にショートカットを寄付すると、スマート スタックがタイミングを判断するのに役立つ機会があります。
  • TimelineEntryRelevance 提供できる score そして duration;スコアは、開発者が過去に提供したエントリに基づいて解釈されます。

重要ポイント

  • やるべきこと: アプリ内で最も頻繁に開かれる情報を小さなウィジェットにします。 実行する価値がある理由: Transcript は、小さいサイズにはアイコン領域が 4 つ程度しかなく、ユーザーの滞在時間が非常に短いことを繰り返し強調しています。天気、次の会議、今日の進捗状況など、単一の事実に最適です。 開始方法: まず、 StaticConfiguration、コア番号またはステータスのみを表示する SwiftUI ビューを作成し、使用します widgetURL クリックすると、対応するページに戻ります。

  • やるべきこと: スケジュール、トレーニング、やるべきことなど、時間に依存するコンテンツの 1 日のタイムラインを生成します。 実行する価値がある理由: WidgetKit の中心的な機能は、事前に時間とともにエントリを返すことであり、システムはそれらを時間に従って表示します。カレンダーの例は、拡張機能が会議前、会議中、および次の会議後にビューを事前に準備できることを示しています。 開始方法: 実装する TimelineProvider、将来のいくつかの重要な時点でエントリを生成し、最初に使用します .atEnd または、指定された日付のリロード ポリシーを使用して、更新リズムを確認します。

  • 何をすべきか: 選択可能なコンテンツを含むウィジェットにインテント構成を追加します。 実行する価値がある理由: 天気と株価の例は両方ともトランスクリプトからのものです。ユーザーはウィジェット編集インターフェイスで都市、株式、またはリストを選択でき、システムはインテントを使用して UI を自動的に生成します。 開始方法: ウィジェット定義を次から変更します StaticConfigurationIntentConfiguration、プロバイダーに実装してもらいます IntentTimelineProvider、そして使用します configuration さまざまなタイムラインを生成します。

  • 内容: Smart Stack に適切なタイミングでウィジェットを表示させます。 価値がある理由: スマート スタックは、関連するウィジェットを自動的に上部に移動します。 Siri ショートカットの寄付と TimelineEntryRelevance どちらもシステムにさらに多くの信号を与えます。 開始方法: ユーザーが反復可能なアクションを完了したときにショートカットを寄付します。明確な有効期限を持つタイムライン エントリの関連性スコアと期間を設定します。

関連セッション

コメント

GitHub Issues · utterances