見出し画像

【Flutter/Dart】`ChangeNotifierProvider` と `Scaffold`は共存できる??🤔

`ChangeNotifierProvider` と `Scaffold` は、実際には共存できますが、その配置には注意が必要です。`ChangeNotifierProvider` は、状態管理クラス(この場合は `Sample`)のインスタンスを提供するために、ウィジェットツリーの上位に配置する必要があります。これにより、`Scaffold` やその他の子ウィジェットが `ChangeNotifierProvider` から提供されるデータをアクセスできます。

問題は、`ChangeNotifierProvider` を `Scaffold` の内部に配置することではなく、`MaterialApp` や `Scaffold` の外部で `ChangeNotifierProvider` を配置することです。これにより、アプリ全体で状態を共有できます。

正しい配置の例:

void main() {
  runApp(
    ChangeNotifierProvider(
      create: (context) => Sample(),
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        // Scaffoldの内容
      ),
    );
  }
}

この配置では、`ChangeNotifierProvider` は `MaterialApp` の外部にあり、`MyApp`(および `Scaffold`)はその子として配置されています。これにより、`Scaffold` の内部で `Provider.of<Sample>(context)` を使用して、共有された状態にアクセスできます。


よろしくお願いしますッ!