![見出し画像](https://assets.st-note.com/production/uploads/images/99557894/rectangle_large_type_2_8395c2d15df5a06ac4517fe5f100f53e.jpeg?width=800)
【Flutter Flow】ダークモードを設定しよう!
みなさんこんにちは!Taiyoと申します!今回は、ダークモードの設定について解説していきます!
ダークモードの設定種類
ダークモードの設定には3種類あります!
From System:スマホのシステム設定に基づいて画面の色が変化します。システム上にダークモードを設定している場合は自動でダークモードになります。
Light Mode:ライトモードにして、画面の色を白色にします。
Dark Mode:ダークモードにして、画面の色を黒色にします。
ボタンを押して画面を白→黒へ!
画面をダークモードに変更するActionはとても簡単です!一緒にやっていきましょう!
まず、UI BuilderのCommonly Used Elementsからボタンエレメントを選択して画面に設置します。
![](https://assets.st-note.com/img/1678023853117-S8s9R5NZrS.png?width=800)
そして設置したボタンにActionを設定していきます!
On Tapを選択し、Action1には、Set Dark Mode Setting、
Setting SourceにはSellect Setting
Dark Mode SettingにはDark Modeを選択します!
これで終わりです😄めちゃくちゃ簡単でしたね
![](https://assets.st-note.com/production/uploads/images/99557256/picture_pc_cab35d498f0f45b91136a88595263b94.gif?width=800)
これだけで画面上ほDark Modeを設定できてしまうなんてやっぱりFlutter Flowは凄すぎます!!!
みなさま良いFlutter Flowライフをお過ごしください〜!!ではまた〜🌞
この記事が気に入ったらサポートをしてみませんか?