如何在 Flutter 的下一页上将计数加一?

How do I increase the count by one on the next page in Flutter?

我正在 Flutter 中创建一个测验应用程序,我试图按该顺序显示问题页面、答案页面和问题页面。我想在页面从答案页过渡到问题页时显示下一个问题,但我无法正确传递增量值。我尝试使用 Navigator.push() 并将以下 setsetState((){}) 作为要转换的页面的参数,但出现错误。你能给我一些建议吗?谢谢。

answer_page.dart:

import 'package:flutter/material.dart';
import '../components/next_question_button.dart';
import '../screens/question_page.dart';
import '../quiz_list.dart';

class CorrectAnswerPage extends StatelessWidget {
  
  CorrectAnswerPage({this.scoreKeeper});

  final List<Icon> scoreKeeper;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Container(
          child: Center(
            child: Text(
              'correct',
              style: TextStyle(
                  fontSize: 100,
                  fontWeight: FontWeight.bold,
                  color: Colors.red),
            ),
          ),
        ),
        Divider(
          color: Colors.grey,
          indent: 16,
          endIndent: 16,
        ),
        Text('EXPLANATION',
            style: TextStyle(
                fontSize: 20, fontWeight: FontWeight.bold, color: Colors.grey)),
        NextQuestionButton(
          onTap: () {
            Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => QuestionPage(setState: () {
                          quizList.nextQuestion();
                        })));
          },
        ),
        Row(
          children: scoreKeeper,
        )
      ],
    );
  }
}

question_page.dart:

import 'package:flutter/material.dart';
import '../screens/wrong_answer_page.dart';
import '../components/answer_button.dart';
import '../quiz_list.dart';
import 'correct_answer_page.dart';

QuizList quizList = QuizList();

class QuestionPage extends StatefulWidget {
  QuestionPage({@required this.setState});

  final setState;

  //QuestionPage(void nextQuestion);

  // QuestionPage(this.scoreKeeper);
  //
  // List<Icon> scoreKeeper;

  @override
  _QuestionPageState createState() => _QuestionPageState();
}

class _QuestionPageState extends State<QuestionPage> {
  List<Icon> scoreKeeper = [];

  void checkAnswer(String userPickedAnswer) {
    String correctAnswer = quizList.getQuestionAnswer();

    if (userPickedAnswer == correctAnswer) {
      scoreKeeper.add(
        Icon(Icons.circle_outlined, color: Colors.red),
      );
      Navigator.push(
          context,
          MaterialPageRoute(
              builder: (context) => CorrectAnswerPage(
                  
                  scoreKeeper: scoreKeeper)));
    } else {
      scoreKeeper.add(
        Icon(Icons.close, color: Colors.blue),
      );
      Navigator.push(
          context,
          MaterialPageRoute(
              builder: (context) => WrongAnswerPage(
                  
                  scoreKeeper: scoreKeeper)));
    }

    
    setState(() {
      quizList.nextQuestion();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
        Expanded(
          flex: 5,
          child: Padding(
            padding: EdgeInsets.all(10.0),
            child: Center(
              child: Text(
                quizList.getQuestionText(),
                textAlign: TextAlign.center,
                style: TextStyle(
                  fontSize: 25.0,
                  color: Colors.black,
                ),
              ),
            ),
          ),
        ),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(15.0),
          child: AnswerButton(
              userPickedAnswer: 'a',
              onTap: () {
                setState(() {
                  checkAnswer('a');
                });
              }),
        )),

        Expanded(
            child: Padding(
          padding: EdgeInsets.all(15.0),
          child: AnswerButton(
              userPickedAnswer: 'b',
              onTap: () {
                setState(() {
                  checkAnswer('b');
                });
              }),
        )),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(15.0),
          child: AnswerButton(
              userPickedAnswer: 'c',
              onTap: () {
                setState(() {
                  checkAnswer('c');
                });
              }),
        )),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(15.0),
          child: AnswerButton(
              userPickedAnswer: 'd',
              onTap: () {
                setState(() {
                  checkAnswer('d');
                });
              }),
        )),
        //TODO: Add a Row here as your score keeper
        Row(children: this.scoreKeeper)
      ],
    );
  }
}
QuestionPage(setState: () {
                          quizList.nextQuestion();
                        })));

这里你传递一个函数。使用 () {} 您可以创建一个函数并将其传递到下一页。

简单:

QuestionPage(setState: quizList.nextQuestion());

然后下一个问题将存储在您的 setState 变量中。

开始声明变量的类型,这样你就不会 运行 遇到你试图传递一个对象但你传递了一个函数而 IDE 什么也没说的问题,因为它希望您知道自己在做什么:

final Question setState;