Flutterのダークモード対応

コード

title_list_view.dart

import 'package:flutter/material.dart';

class TitleListView extends StatelessWidget {
  const TitleListView({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.white),
      ),
      darkTheme: ThemeData.dark(), // ここを追加
      home: Scaffold(
        floatingActionButton: FloatingActionButton(onPressed: null, child: const Icon(Icons.add),),
      )
    );
  }
}

title_list_view.dart

darkTheme: ThemeData.dark()

• MaterialAppを定義している最上位のViewにてdarkThemeにThemeData.dark()を適用するだけで自動的にダークモードの色変更対応をしてくれる。

注意

• MaterialAppにはdarkTheme を定義出来るプロパティがあるが、Scaffoldからは変更できない。これはMaterialAppがアプリのベースのUIを管理するWidgetだからである。