Udemyのオススメ講座はこちら 詳細を見てみる

【FlutterFlow】Run Modeにすると白と黒が変わってしまう場合の解決法

  • URLをコピーしました!

FlutterFlowのRun Modeで開発中のアプリの動作確認をした時に、開発画面で白文字、白背景を指定しているのに黒文字、黒背景で表示されてしまう場合の解決法です。

(下の画像では上部余白が異なっていますがこれは正常の挙動と思われます)

PCはM1 Macbook Air、ブラウザはGoogle Chromeを使っています。

目次

外観モードを「ライト」にする

結論、PCの外観モードを「ライト」に変更することが解決法です。

僕は普段は目への負担が少なく感じる「ダーク」を使っているのですが、それを影響で単純に白文字・白背景が反転していたようです。(Run Modeはその設定の影響を受けてしまうよう)

Macの場合ですが、外観モードは以下の手順で確認することができます。

システム環境設定 > 一般 > 外観モード

「ライト」に変更すると、開発画面と同じ色で表示されます。

余談

ちなみに、Previewモード(下画像の赤枠)だとPCの外観モードの設定に関係なく、開発画面の色がそのまま反映されるので、色味を確認する場合はPreviewモードで確認するのが良いかと思います。

開発画面の右上(目のマークがPreview Mode、Runと書かれているのがRun Mode)

Udemyのオススメ講座はこちら↓

TypeScript+Next.js+Laravelハンズオンはこちら↓

デスク周りのオススメアイテムはこちら↓

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

ブログを開設するなら「SWELL」が絶対オススメ!

この記事を書いた人

大学院(機械工学)→重工業→エンジニア→プロダクトマネージャー(PdM)兼エンジニア

神戸で「つながる勉強会」を運営↓
https://tsunagaru-kobe.connpass.com/

神戸グルメのインスタアカウントを運用しています。

目次