时间戳

首页 > 解决方案 > 您如何存储正确答案的数量以显示在测验应用程序的分数页面上？

flutter - 您如何存储正确答案的数量以显示在测验应用程序的分数页面上？

问题描述

我正在 Flutter 中创建一个测验应用程序。在这个应用程序中，我想显示正确答案的数量，但我尝试过的方式不起作用。我声明了一个变量“correctAnswerCount”来存储问题页面、正确答案页面和分数页面上正确答案的数量。但是，correctAnswerCount 在分数页面上显示为“null”。我认为这种方式没有正确给出正确的AnswerCount 值，但我不确定如何解决这个问题。你能给我一些建议吗？谢谢你。

question_page.dart：

import 'package:flutter/material.dart';
import '../question_answer.dart';
import '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, this.scoreKeeper, this.correctAnswerCount});

  final QuizList setState;
  final List<Icon> scoreKeeper;
  final int correctAnswerCount;

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

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

  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,
                  correctAnswerCount: correctAnswerCount)));
    } else {
      scoreKeeper.add(
        Icon(Icons.close, color: Colors.blue),
      );
      Navigator.push(
          context,
          MaterialPageRoute(
              builder: (context) => WrongAnswerPage(scoreKeeper: scoreKeeper)));
    }

    setState(() {
      print(correctAnswerCount.toString());
      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: quizList.getAnswer1(),
              onTap: () {
                setState(() {
                  checkAnswer(quizList.getAnswer1());
                });
              }),
        )),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(15.0),
          child: AnswerButton(
              userPickedAnswer: quizList.getAnswer2(),
              onTap: () {
                setState(() {
                  checkAnswer(quizList.getAnswer2());
                });
              }),
        )),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(15.0),
          child: AnswerButton(
              userPickedAnswer: quizList.getAnswer3(),
              onTap: () {
                setState(() {
                  checkAnswer(quizList.getAnswer3());
                });
              }),
        )),
        Expanded(
            child: Padding(
          padding: EdgeInsets.all(15.0),
          child: AnswerButton(
              userPickedAnswer: quizList.getAnswer4(),
              onTap: () {
                setState(() {
                  checkAnswer(quizList.getAnswer4());
                });
              }),
        )),
        Row(children: scoreKeeper)
      ],
    );
  }
}

/*
question1: 'You can lead a cow down stairs but not up stairs.', false,
question2: 'Approximately one quarter of human bones are in the feet.', true,
question3: 'A slug\'s blood is green.', true,
*/

正确答案页面.dart：

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

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

  final List<Icon> scoreKeeper;
  final int correctAnswerCount;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Container(
          child: Center(
            child: Text(
              '正解',
              style: TextStyle(
                  fontSize: 100,
                  fontWeight: FontWeight.bold,
                  color: Colors.red),
            ),
          ),
        ),
        Divider(
          color: Colors.grey,
          indent: 16,
          endIndent: 16,
        ),
        Text(quizList.getExplanation(),
            style: TextStyle(
                fontSize: 20, fontWeight: FontWeight.bold, color: Colors.grey)),
        NextQuestionButton(onTap: () {
          if (quizList.isFinished() == true) {
            Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) =>
                        ScorePage(correctAnswerCount: correctAnswerCount)));
          } else {
            //なくてもこのページでは表示される
            scoreKeeper.add(
              Icon(Icons.circle_outlined, color: Colors.red),
            );
            Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => QuestionPage(
                        scoreKeeper: scoreKeeper,
                        setState: quizList,
                        correctAnswerCount: correctAnswerCount)));
          }
        }),
        Row(children: scoreKeeper)
      ],
    );
  }
}

score_page.dart:

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:quizzler/components/eachScore.dart';
import 'package:quizzler/components/next_question_button.dart';
import 'package:quizzler/quiz_list.dart';
import 'package:quizzler/screens/question_page.dart';
import '../constants.dart';

class ScorePage extends StatelessWidget {
  ScorePage({this.correctAnswerCount});

  final int correctAnswerCount;
  @override
  Widget build(BuildContext context) {
    return Container(
        child: Column(
      children: <Widget>[
        Container(
          child: Center(
            child: Text('結果', style: kScoreText),
          ),
        ),
        SizedBox(),
        Container(
          child: Center(
            child: Text(correctAnswerCount.toString(), style: kScoreText),
          ),
        ),
        NextQuestionButton(onTap: () {
          Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) => QuestionPage(setState: quizList)));
        }),
      ],
    ));
  }
}

quiz_list.dart：

import 'package:flutter/material.dart';
import '/question_answer.dart';

class QuizList {
  int _questionNumber = 0;
  int _correctAnswerNumber = 0;

  List<Question> _questionBank = [
    Question('日本で二番目に高い山は？', '北岳'),
    Question('富士山の標高は？', '3776m'),
    Question('日本で一番低い山は？', '日和山'),
    Question('日本で一番低い山の高さは？', '3m'),
    Question('100ｍ上がるごとに何度下がる？', '約0.6℃'),
    Question('日本には何座の山があるといわれている？', '15,000'),
    Question('百名山の基準は「品格・歴史・個性」を兼ね備え、かつ原則として標高何m以上の山？', '1,500'),
    Question('百名山ではないものは？', '高尾山'),
    Question('47都道府県の中で一番百名山がある県は？', '長野県'),
    Question('日本で現在でも山頂付近を女性禁制とする山は？', '大峰山'),
  ];

  List<Answer> _answerBank = [
    Answer('北岳', '穂高岳', '槍ヶ岳', '赤石岳'),
    Answer('3446m', '3776m', '3556m', '3336m'),
    Answer('天保山', '日和山', '蘇鉄山', '金時山'),
    Answer('101m', '87m', '64m', '3m'),
    Answer('約0.6℃', '約0.3℃', '約0.2℃', '下がらない'),
    Answer('10,000', '800', '15,000', '1,000'),
    Answer('1,500', '1,000', '1,200', '1,300'),
    Answer('両神山', '雲取山', '高尾山', '筑波山'),
    Answer('山梨県', '長野県', '熊本県', '北海道'),
    Answer('蔵王山', '駒ヶ岳', '大峰山', '乗鞍岳'),
  ];

  List<Explanation> _explanationBank = [
    Explanation('日本で二番目に高い山は南アルプスに位置する北岳です。3193.2mで火山ではない山としては日本で一番の高さです。'),
    Explanation('解説Q2'),
    Explanation('解説Q3'),
    Explanation('解説Q4'),
    Explanation('解説Q5'),
    Explanation('解説Q6'),
    Explanation('解説Q7'),
    Explanation('解説Q8'),
    Explanation('解説Q9'),
    Explanation('解説Q10'),
  ];

  void nextQuestion() {
    if (_questionNumber < _questionBank.length) {
      _questionNumber++;
    }
  }

  int correctAnswerCount() {
    return _correctAnswerNumber++;
  }

  bool isFinished() {
    if (_questionNumber == 5) {
      return true;
    } else {
      return false;
    }
  }

  String getQuestionText() {
    return _questionBank[_questionNumber].questionText;
  }

  String getQuestionAnswer() {
    return _questionBank[_questionNumber].questionAnswer;
  }

  String getAnswer1() {
    return _answerBank[_questionNumber].answerText1;
  }

  String getAnswer2() {
    return _answerBank[_questionNumber].answerText2;
  }

  String getAnswer3() {
    return _answerBank[_questionNumber].answerText3;
  }

  String getAnswer4() {
    return _answerBank[_questionNumber].answerText4;
  }

  String getExplanation() {
    return _explanationBank[_questionNumber - 1].explanationText;
  }
}

标签： flutter

解决方案

推荐阅读