Widget(ウィジェット)を設定する基本手順
1. Widget Extension(ターゲット)の追加
- Xcodeでプロジェクトを開きます。
- メニューバーの [File] > [New] > [Target…] を選択します。
- テンプレート一覧から [Widget Extension] を選択し、[Next]をクリックします。
- Extensionの名前(例:
MyWidgetExtension)を入力し、必要に応じて「Include App Intent」にチェックを入れて [Finish] をクリックします。 - 「Activate “…” scheme?」と聞かれたら、[Activate]を選択します。
2. 生成される主なコンポーネント
追加されるファイルには、主に以下の要素が含まれています:
- TimelineEntry: ウィジェットに表示するデータと更新時刻の構造体。
- TimelineProvider: いつデータを更新してウィジェットを再描画するか(タイムライン)を制御するプロバイダ。
- SwiftUI View: 実際に画面に描画されるUIパーツ。
- Widget(WidgetConfiguration): 静的(StaticConfiguration)またはユーザー設定可能(AppIntentConfiguration)なウィジェットの定義本体。
3. ビューとデータのカスタマイズ
- SwiftUI Viewのコードを書き換え、
@Environment(\.widgetFamily)などを使用して、小(.systemSmall)、中(.systemMedium)、大(.systemLarge)などのサイズに応じたレイアウトを調整します。 - メインアプリとウィジェット間でデータを共有する必要がある場合は、App Groups を有効にしてデータを連携させます。
- データの更新が必要なタイミングで、メインアプリ側から
WidgetCenter.shared.reloadTimelines(ofKind:)を呼び出して表示を更新します。
App Groupの設定
- メインアプリのターゲットにApp Groupsを追加する
- Xcodeでプロジェクトファイルを選択し、メインアプリの TARGETS からメインのターゲットを選択します。
- [Signing & Capabilities] タブを開きます。
- 左上の 「+ Capability」 ボタンをクリックします。
- リストから [App Groups] をダブルクリックして追加します。
- App Group IDを作成・選択する
- 追加された「App Groups」セクションの「+」ボタンを押します。
- 識別子(Bundle IDのような形式、例:
group.com.yourname.appname)を入力するか、既存のものを選択します。
- ウィジェット(Widget Extension)のターゲットにも同じ設定を追加する
- ウィジェットの TARGETS を選択します。
- 同様に [Signing & Capabilities] から [+ Capability] > [App Groups] を追加します。
- ステップ2で作成・登録したまったく同じApp Group IDにチェックを入れます。
設定を戻す(デバッグ時に先にWidgetが立ち上がるのを元に戻す)
Xcodeの画面最上部にあるツールバー(ステータスバー)から直接ワンクリックで変更できます。
Xcodeの画面上部(再生ボタン「▶」と停止ボタン「■」のすぐ右側)にある、現在のアプリ名やWidget名が表示されている部分をクリックしてください。
プルダウンメニューが表示されるので、そこからWidget Extensionではなく、アプリ本体(メインのアプリ名)を選択するだけで切り替わります。
変更する場所のイメージ
text
[ ▶ ] [ ■ ] [ 変更する場所はココ! ▼ ] ➔ [ iPhone 16 (シミュレータ名) ]
└─ クリックして「アプリ本体の名前」を選ぶ
ステータスバーにアプリ本体の名前がない場合
「アプリ名 + widgetExtension」の1種類しか表示されないのですね。初期設定のミスというよりは、Xcodeがアプリ本体のスキーム(Scheme)を自動生成し損ねているか、非表示になっている可能性が高いです。
アプリ本体のターゲット(Target)自体が消えていなければ、以下の手順で簡単に復活させることができます。
対処法1:消えたスキームを「自動生成」させる(一番簡単)
- スキームを選択したメニュー(またはXcode上部のメニューバーの
Product>Scheme)から、一番下にある 「Manage Schemes…」 をクリックします。 - 開いた画面の右側にある 「Autocreate Schemes Now」 というボタンをクリックします。
- リストに「アプリ本体の名前」が復活したか確認してください。
もし復活したら、アプリ本体の左側にある 「Show」のチェックボックス にチェックが入っていることを確認し、「Close」で閉じます。これでツールバーにアプリ本体が表示されるようになります。
対処法2:手動でスキームを追加する(確実)
上記で出ない場合は、手動でアプリ本体のスキームを作ります。
- 先ほどと同じ 「Manage Schemes…」 の画面を開きます。
- 画面左下にある 「+」ボタン をクリックします。
- 設定ポップアップが出るので、以下のように選択します:
- Target: アプリ本体の名前(※Extensionが付いていない方)を選択します。
- Name: 自動でアプリ名が入るのでそのままでOKです。
- 「OK」 をクリックし、最後に対象のスキームの「Show」にチェックが入っていることを確認して閉じます。