RORK LABEN
FUNDING — RorkがLeft Lane Capital主導で$15Mのシードを調達しましたRORK MAX — Rork MaxはReact NativeではなくネイティブSwiftアプリを生成しますPLATFORM — iPhone・iPad・Watch・Vision Proに対応し、Live ActivitiesやCore MLまで使えますGROWTH — 月間74.3万訪問・成長率85%と利用が伸び続けていますTEST — Companionアプリで有料Apple Developerアカウント無しに実機テストができますSTACK — 本体はReact NativeとExpoで、ウェブラッパーでない真のネイティブ体験を提供しますFUNDING — RorkがLeft Lane Capital主導で$15Mのシードを調達しましたRORK MAX — Rork MaxはReact NativeではなくネイティブSwiftアプリを生成しますPLATFORM — iPhone・iPad・Watch・Vision Proに対応し、Live ActivitiesやCore MLまで使えますGROWTH — 月間74.3万訪問・成長率85%と利用が伸び続けていますTEST — Companionアプリで有料Apple Developerアカウント無しに実機テストができますSTACK — 本体はReact NativeとExpoで、ウェブラッパーでない真のネイティブ体験を提供します
記事一覧/開発ツール
開発ツール/2026-06-30上級

Rork Max で StandBy モードに最適化したウィジェットを実装する

充電中の横向き表示で使われる StandBy モード向けに、WidgetKit ウィジェットを最適化する実装手順です。常時表示の調光・ナイトモード・コンテナ背景の扱いを、Rork Max が生成したコードへどう手で加えるかまで含めて解説します。

Rork Max195WidgetKit10StandBySwiftUI56iOS88

プレミアム記事

枕元で充電している iPhone を横向きに置くと、画面に大きな時計やウィジェットが並びます。これが iOS 17 から入った StandBy モードです。先日、自分が個人開発で運営しているアファメーション系アプリ「Law of Attraction Everyday」のウィジェットを Rork Max で作り直していたとき、ホーム画面では問題なく見えていたものが、StandBy に置いた途端に文字が切れ、夜間の暗い赤色表示では何が書いてあるか読めない状態になりました。

StandBy は単に「ウィジェットを大きく出すモード」ではありません。常時表示(Always-On Display)での調光、深夜のナイトモード、横向き専用のレイアウトという三つの異なる環境を同時に相手にすることになります。Rork Max は WidgetKit の足場までは自然言語から作ってくれますが、この三つの環境差を埋める部分は、生成されたコードを読んで自分で詰める必要がありました。その過程で分かったことを、実装手順としてまとめます。

StandBy が発動する条件と、何が変わるのか

まず前提として、StandBy は次の三条件がすべて揃ったときだけ発動します。

  1. iPhone が充電中であること(MagSafe・Lightning・USB-C いずれでも可)
  2. 横向きに固定されていること
  3. ロック状態であること

この条件は開発時に見落としやすく、シミュレータでは再現が安定しません。私自身、最初はシミュレータで確認しようとして時間を溶かしました。StandBy の挙動確認は実機を横向きで充電する以外に確実な方法がないと考えておいたほうが安全です。

StandBy のウィジェットは、ホーム画面の systemSmall ファミリーをそのまま流用します。つまり新しいウィジェットファミリーを追加するのではなく、既存の小ウィジェットが StandBy のスタックに並ぶ形です。ここで効いてくるのが、環境値による表示の出し分けです。

環境判定に使う環境値求められる対応
通常のホーム画面既定フルカラー・通常の情報量
StandBy 昼間widgetRenderingMode = fullColor余白を広げ、文字を大きく
StandBy ナイトモードisLuminanceReduced = true赤系の単色・最小限の要素・発光面積を減らす
常時表示(14 Pro 以降)isLuminanceReduced = true1Hz 更新前提・アニメーション抑制

ナイトモードと常時表示はどちらも isLuminanceReduced で拾えますが、意味合いは少し違います。前者は「暗い部屋で眩しくしない」ため、後者は「焼き付きと電力を抑える」ためです。実装上はどちらも「発光面積を減らし、動きを止める」方向に倒せば両立できます。

手順1: コンテナ背景を必ず宣言する

iOS 17 以降、ウィジェットは containerBackground(for: .widget) で背景を宣言しないと、StandBy やロック画面で背景が消えて文字だけが浮く、あるいはレイアウトが詰まる現象が起きます。Rork Max が生成したコードでは、この宣言が ZStack の手書き背景になっていることがあり、そのままだと StandBy で破綻しました。

struct AffirmationWidgetView: View {
    var entry: AffirmationEntry
 
    var body: some View {
        VStack(alignment: .leading, spacing: 6) {
            Text(entry.affirmation)
                .font(.headline)
                .minimumScaleFactor(0.6)   // StandBy で切れないよう縮小を許可
                .lineLimit(3)
            Spacer(minLength: 0)
            Text(entry.date, style: .time)
                .font(.caption2)
                .foregroundStyle(.secondary)
        }
        // ❌ 手書き背景だけだと StandBy で背景が剥がれる
        // .background(Color.indigo)
 
        // ✅ システムにコンテナ背景として認識させる
        .containerBackground(for: .widget) {
            Color.indigo
        }
    }
}

minimumScaleFactor を入れているのは、StandBy では同じ systemSmall でも実効的な表示領域が広がり、逆にフォントが相対的に小さく見えるためです。固定フォントサイズのままだと、長いアファメーション文が途中で切れます。ここはホーム画面では問題が出ず、StandBy で初めて露見する典型的な箇所でした。

ここまでお読みいただきありがとうございます。

この記事の続きを読む

この先には、実装コードやベンチマーク結果など、実務でお役に立てる内容をご用意しています。このサイトは広告を掲載しておらず、サーバーや開発にかかる費用はメンバーの皆様のご支援で成り立っています。もしお役に立てていましたら、ご支援いただけますと大変ありがたいです。

この記事で得られること
StandBy で表示が崩れていたウィジェットを、常時表示と通常表示の両方で破綻しない形に整えられるようになります
isLuminanceReduced とレンダリングモードを使った調光対応の実装パターンを、動くコードごと手に入れられます
Rork Max が生成した WidgetKit コードのどこを自分で詰めるべきか、責任分界の判断軸が身につきます
Stripe による安全な決済 · いつでもキャンセル可能

この記事を購入する

この先の内容をすべてお読みいただけます。一度のご購入で、いつでも何度でもアクセスできます。このサイトは広告を掲載しておらず、皆さまのご支援がサーバー費用などの運営を支えています。

または
メンバーシップなら全記事が読み放題 →
シェア

お読みいただきありがとうございます

Rork Lab は広告なしで運営しており、サーバー費用などの運営コストはメンバーシップのご支援で賄っています。実装コード・ベンチマーク・本番設計パターンなど、実務でお役立ていただける記事を毎日更新しています。もし読んでよかったと感じていただけましたら、ぜひご覧ください。

  • コピー&ペーストで使える実装コード付き
  • 毎日新しい上級ガイドを追加
  • ¥580/月 または ¥1,480 の永久アクセス
メンバーシップを見る →

関連記事

開発ツール2026-06-18
Rork Max で Apple Watch のコンプリケーションを WidgetKit で実装する
Rork Max が生成した SwiftUI アプリに、watchOS のコンプリケーションと Smart Stack 対応を後から足す実装手順を、データ共有と Timeline 設計まで具体的にまとめました。
開発ツール2026-05-08
Rork Max の Cloud Compile が失敗する原因と、すぐに試せる対処法
Rork Max の Cloud Compile でビルドが失敗する時の原因を症状別に整理し、コード署名エラー・Swift バージョン不一致・タイムアウトなど、よくあるケースへの対処法を解説します。
開発ツール2026-04-28
Rork Max で Share Extension を実装する — iOS の共有シートにアプリを表示させる
Rork Max でメモアプリやリーディングリストのような『他アプリから共有を受け取る』機能を実装する完全ガイド。App Group・URL Scheme・最小限のUI設計まで、本番運用可能なコードで解説します。
📚RECOMMENDED BOOKS
大規模言語モデル入門
山田育矢
LLM開発
生成AIプロンプトエンジニアリング入門
我妻幸長
プロンプト
Claude CodeによるAI駆動開発入門
平川知秀
AI駆動開発
※ アフィリエイトリンクを含みます
もっと見る →