Question

我的简单应用主要是条的CustomScrollView。效果很好，但是现在我需要添加AlertDialogs，我不确定它们在条子中的合适位置。

下面是我的屏幕小部件，它创建了SliverAppBar和SliverList。我插入了一个测试AlertDialog，但模拟器出现错误

class QuestionsScreen extends StatelessWidget {
  @override
  Widget build(context) {
    final List<Question> questions = Provider.of<Questions>(context).items;

    return CustomScrollView(
      slivers: <Widget>[
        AlertDialog(
          title: Text('Not in stock'),
          content: const Text('This item is no longer available'),
          actions: <Widget>[
            FlatButton(
              child: Text('Ok'),
              onPressed: () {
                Navigator.of(context).pop();
              },
            ),
          ],
        ),
        SliverAppBar(
          bottom: PreferredSize(
            preferredSize: const Size.fromHeight(48.0),
            child: ChangeNotifierProvider.value(
              value: Score(),
              child: ScoreText(),
            ),
          ),
          floating: true,
          expandedHeight: 200,
          pinned: true,
          flexibleSpace: FlexibleSpaceBar(
            centerTitle: true,
            title: Text(
              "Fixed Wing Frat\n\n\n\n\n",
              style: TextStyle(
                color: Colors.white,
                fontSize: 16.0,
              ),
            ),
            background: Image.asset(
              "assets/images/PalFM_blue.jpg",
              fit: BoxFit.cover,
            ),
          ),
        ),
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (BuildContext context, int index) {
              return ChangeNotifierProvider.value(
                value: questions[index],
                child: QuestionCard(),
              );
            },
            childCount: questions.length,
          ),
        ),
      ],
    );
  }
}

我构建屏幕的应用小部件在这里

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    Questions questions = Questions();
    questions.loadFromLocal(context).then((_) {
      questions.loadFromOnline(context);
    });
    return ChangeNotifierProvider.value(
      value: questions,
      child: MaterialApp(
        title: 'FRATpal',
        theme: ThemeData(
          primarySwatch: Colors.blue,
          accentColor: Colors.lightBlue,
          fontFamily: 'Lato',
        ),
        home: QuestionsScreen(),
        routes: {
          UnusedDetailScreen.routeName: (_) => UnusedDetailScreen(),
        },
      ),
    );
  }

在哪里插入我的AlertDialog的好地方？下面是错误。

Answer 1

AlertDialog 并不是要在另一个组件内部可见，而是旨在在所有人的身上保持一小段时间（例如错误消息）

AlertDialog 应该作为模式页面推送。一个好方法是使用 showDialog 方法。

AlertDialog上的Flutter文档说明了如何执行此操作。

showDialog(
  context: context,
  builder: (BuildContext context) {
   return AlertDialog(
      title: Text('Not in stock'),
      content: const Text('This item is no longer available'),
      actions: <Widget>[
        FlatButton(
          child: Text('Ok'),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
      ],
    ),
}

在条子上添加Flutter AlertDialog吗？

1 个答案: