Xamarin.Formsでダークモード対応した

更新記事があります
Xamarin.Formsのダークモード検出にXamarin.EssentialsのAppInfo.RequestedThemeを使うようにした

 

iOSはダークモード、Androidはナイトモード?

iOS13の新機能で気になっていたけど、Androidは前からあるんだな。

Xamarin.Formsは自動でダークモードにならないので、XAMLの色指定をDynamicResourceにして切り替えるとのこと。

【参考サイト】Check for Dark Mode in Xamarin.Forms

を見て対応した。

Xamarin.Forms

モードを検出してResourceを差し替えるコード

App.xaml.csに↑のDependencyServiceから取得したモードによってリソースを差し替えるコードを追加

※(2019/12/23追記)Initialize()でやると起動時に落ちる現象があるっぽいのでOnStart()で。チェックもBeginInvokeOnMainThreadでやることにした。Taskでasync voidをawaitしてるのがいかんのかなぁ。いつか頑張る。

※(2019/12/30追記)Androidでバックボタンで閉じたり、ホームボタンで閉じて設定いじるとライトモードのリソースがセットされてしまうので、App.AppTheme.Valueで判定するのをやめた。<( ̄- ̄)>

OnResume()では、アプリ起動中にモード変更したときのために、各画面に再描画イベントを投げるようにした。

AppThemeが ReactivePropertyなので、各画面でSubscribeしてやるって手もあるが。(-_-;ウーン

BeginInvokeOnMainThreadしてるのは、Androidが変わってくれなかったため。。。

Resource

もともとのResourceは1ファイルにしてたのをDefaultThemeの中のMergedDictionariesに入れて。

それをSourceにしたDarkThemeとLightThemeを作り。

App.xamlではLightThemeを指定しとく。

これがSetTheme()で切り替わるって作り。(o^-‘)b グッ!

iOS

各モード用のアイコンを用意する

アイコンを一個一個アセットカタログにして。。。アセットカタログ変わってる。!∑(゜∀゜)

ダークテーマとか標準とか入れられるようになってる。

独自実装した画面とか(SnackBarとか)は、中でApp.Theme見て色変えるとかしないといけないけど、ダイアログとか勝手に変わってくれる。

Android

各モード用のアイコンを用意する

アイコンは、フォルダ名に-nightってつけたものを作って置いとけば自動で使ってくれる。

Style

各モード用のStyleを-nightつけたフォルダに入れる。

styles.xmlは、parent=”Theme.AppCompat.DayNight”にすると、DatePickerとかAlertとか自動でダークモードになってくれる。

カスタムPickerとか

コードで指定するstyleを各フォルダ(-nightフォルダ)に置いて指定する。

Style

うん、良い感じだな。(o^-‘)b グッ!

%d人のブロガーが「いいね」をつけました。