9ura00

iOS 26 の「クリア」表示で、ウィジェットが真っ白になった——WidgetRenderingMode の3つのモード

Sheet Widget2026年10月4日

iPhone のホーム画面は、アイコンやウィジェットの見た目を変えられます。通常のカラーのほかに、全体を1色に寄せる「色合い調整」や、iOS 26 で加わった、ガラスのように透ける「クリア」があります。

Sheet Widget では、この「色合い調整」や「クリア」にしたときに、ウィジェットが真っ白に飛んで、表が読めなくなる問題がありました。

ウィジェットの表示モードは3種類ある

ウィジェットがどの見た目で表示されているかは、SwiftUI の環境値 widgetRenderingMode で分かります。

モード ホーム画面の設定 描かれ方
.fullColor 通常 指定した色のまま
.accented 色合い調整 色が1色に置き換わる
.vibrant iOS 26 の「クリア」など 色が抜けて、明るさだけで描かれる

Sheet Widget は、セルの背景色や文字色を、スプレッドシートの書式どおりに描いています。ところが .accented や .vibrant では、システムが色を1色に潰して描きます。セルやグラフの背景を塗っていると、背景も線も文字も同じ1色になって一枚の塗りになり、線も文字も見えなくなっていました。

最初の修正は、モードを1つ見落としていた

直し方は、通常の表示以外では背景を塗らないことです。最初の修正では、これを .accented(色合い調整)のときだけに入れていました。

if renderingMode == .accented {
    // 背景を塗らない
}

これで「色合い調整」は直りましたが、iOS 26 の「クリア」(.vibrant)を見落としていて、こちらでは白飛びが残っていました。自分のホーム画面で「クリア」を試したときに気づきました。

修正:通常以外は、まとめて扱う

最終的には、「通常(.fullColor)以外」という条件に直して、両方をまとめて扱うようにしました。

@Environment(\.widgetRenderingMode) private var renderingMode

private var backgroundColor: Color {
    if renderingMode != .fullColor { return .clear }   // 通常以外は塗らない
    return model.backgroundHex.map { Color(hex: $0) } ?? .white
}

モードを1つずつ書き並べると、今回のように新しいモードが増えたときに漏れます。「通常かどうか」で分けておけば、今後モードが増えても、通常以外はひとまず読める表示になります。

確認の仕方

ホーム画面の見た目は、ホーム画面の何もないところを長押し →「編集」→「カスタマイズ」から切り替えられます。ウィジェットを作ったら、次の3つで表示を確かめるようにしています。

  • 通常(ライト・ダーク)
  • 色合い調整
  • クリア

色をたくさん使うウィジェットほど、通常以外の表示で崩れやすいので、色のある表やグラフを表示するアプリでは特に注意が必要です。


Sheet Widget は App Store で公開しています。

← ブログの一覧へ