Flutter：从工厂更改机身的 state

Question

我有一个应用程序，我无法通过单击 FAB 在 ListView 上添加新项目。 但我希望 MetarialApp 的 fab 和 body 在其他类中。 我不想把它们粉碎成一体。

我正在尝试使用通知更改有状态小部件中 ListView 的子项数量。 但它不起作用。

如何与不同的小部件进行通信（例如通过单击 fab 将项目添加到 ListView 小部件）？

最好的方法是什么？ 我听说过全局键，但我不明白如何使用它们。

main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var list = MyList();

    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(title: Text("My App")),
        body: list,
        floatingActionButton: FloatingActionButton(
            onPressed: () {
              MyNotification(count: 1).dispatch(context);
            },
            child: Icon(Icons.add)),
      ),
      theme: ThemeData(primarySwatch: Colors.green),
    );
  }
}

class MyList extends StatefulWidget {

  @override
  State<StatefulWidget> createState() => ListState();
}

class ListState extends State {
  int count = 3;

  @override
  Widget build(BuildContext context) {
    return NotificationListener<MyNotification>(
      onNotification: onCountPush,
      child: ListView.builder(
          itemCount: count,
          itemBuilder: (BuildContext context, int index) {
            return BodyCard();
          }),
    );
  }

  bool onCountPush(MyNotification notify) {
    setState(() {
      count += notify.count;
    });
    return true;
  }
}

class MyNotification extends Notification {
  final int count;

  const MyNotification({this.count});
}

Answer 1

body和FAB是Scaffold的属性。 因此，当您尝试从FAB控制body的 state 时，应该处理它的不是body而是Scaffold本身。 看， Scaffold扩展了StatefulWidget ，另一方面MyList扩展了StatelessWidget 。 希望你明白我的意思。

main() => runApp(App());

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyScaffold(),
      theme: ThemeData(primarySwatch: Colors.green),
    );
  }
}

class MyScaffold extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => MyScaffoldState();
}

class MyScaffoldState extends State {
  int count = 3;

  void changeCount() {
    setState(() {
      count = count == 3 ? 5 : 3;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("My App")),
      body: MyList(count),
      floatingActionButton: FloatingActionButton(
        onPressed: changeCount,
        child: Icon(Icons.add),
      ),
    );
  }
}

class MyList extends StatelessWidget {
  final int count;

  const MyList(this.count);

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemCount: count,
      itemBuilder: (BuildContext context, int index) {
        return Container(
          margin: const EdgeInsets.all(10),
          height: 30,
          color: Colors.red,
        );
      },
    );
  }
}

笔记：

稍后当您的状态变得更复杂时，您不想坚持使用setState来管理状态。 就像其他人说的，你可以学习 BLoC、ChangeNotifier 或任何适合你的东西。

Answer 2

您应该在代码中使用 Provider 或 BLoc 以便您可以这样做