ダークモード・ライトモードの実装

[rintaro29]

実装に伴いダークモードとライトモード時のデザインも考える

[rintaro29]

@1uf3
ダークモードの実装なのですがフロント側だけで実装できますがtauriと連携する必要はありますか

[1uf3]

ダークモードのデザインはもうUIで実装できます。
ダークモードとライトモードのデザインの作成、ダークモードとライトモードを変更するUIの作成はできそう
変更をするフラグがあった際にそれをtauriに渡してほしいです。
実際にダークモードとライトモードを変更するのはtauriからフラグを回収してそのフラグによって変更する形です

[rintaro29]

とりあえずダークモードとライトモードのデザインはフロント（next.js）でやって、
実装はtoggleなどでモードの変更を検知した際に、判定の値をtauriのダークモードを実装するapiに変更を送ればいいという認識であってますか？

[1uf3]

ライトモードからダークモードへの変更の手順を以下に示します

1. ダークモードかライトモードがを変更するUIでライトモードからダークモードに変換するボタンがあるとして，そのボタンを押す．
2. ボタンを押すとtauriに対してflagを渡す．ここでいうflagは isDarMode: bool とし，trueとしてtauriから公開されているAPIに送る

fn ChangeMode(isDarkMode: bool) -> Result<> {}

3. ResultでOkが帰ってきたら変更完了
4. 実際にUIがDarkモードに変更する際はtauriのAPIからflagを取得する

fn GetModeFlag() -> bool {}

5. flagを得てtrueの場合DarkModeにUIを変更，falseの場合LightModeにUIを変更する

[1uf3]

こうすればできそう
https://qiita.com/akr/items/73515eb5dcf58d7e331c#%E3%83%80%E3%83%BC%E3%82%AF%E3%83%A2%E3%83%BC%E3%83%89%E3%82%92%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88%E3%81%99%E3%82%8B

[rintaro29]

ありがとうございます。こちらで実装してみます！