Flutter - Type 'Null' is not a subtype of type 'String'

Question

I am getting this error after going backs and forwards on the code on the main.dart file. This error doesn't show on the debugger. It only shows after pressing the 'Start Quiz' button while testing on the Simulator. I am trying to create a Quiz app. On the main.dart page I have created a button to pull the questions from a questionCard.dart.

void main() {
  runApp(const MaterialApp(
    title: 'Navigation Basics Quiz',
    home: Homepage(),
  ));
}

class Homepage extends StatelessWidget {
  const Homepage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Quiz'),
      ),
      body: Center(
        child: ElevatedButton(
          child: const Text('Start Quiz'),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) => const QuizScreen(key: null)),
            );
          },
        ),
      ),
    );
  }
}

class QuizScreen extends StatelessWidget {
  const QuizScreen({required Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    QuestionController _questionController = Get.put(QuestionController());
    return Scaffold(
        appBar: AppBar(
          title: const Text('Quiz test'),
        ),
        body: SafeArea(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Padding(
                padding: const EdgeInsets.all(30),
                child: Obx(
                  () => Text.rich(
                    TextSpan(
                      text: "The Theoretical Models: ",
                      style: const TextStyle(
                          color: Colors.black,
                          fontWeight: FontWeight.bold,
                          fontSize: 16),
                      children: [
                        TextSpan(
                          text:
                              "Question ${_questionController.questionNumber.value}",
                          style: const TextStyle(
                              color: Colors.blue,
                              fontWeight: FontWeight.normal,
                              fontSize: 18),
                        ),
                        TextSpan(
                          text: "/${_questionController.questions.length}",
                          style: const TextStyle(
                              color: Colors.blue,
                              fontWeight: FontWeight.normal,
                              fontSize: 18),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
              const Divider(
                  height: 2,
                  thickness: 3,
                  indent: 10,
                  endIndent: 10,
                  color: Colors.blue),
              const SizedBox(height: 1),
              Expanded(
                child: PageView.builder(
                  // Block swipe to next qn
                  physics: const NeverScrollableScrollPhysics(),
                  controller: _questionController.pageController,
                  onPageChanged: _questionController.updateTheQnNum,
                  itemCount: _questionController.questions.length,
                  itemBuilder: (context, index) => QuestionCard(
                    question: _questionController.questions[index],
                    index: index,
                  ),
                ),
              ),
            ],
          ),
        ));
  }
}

Answer 1

You dont have to pass key as null onClick the button. Just do as follows:

Navigator.push(
       context,
        MaterialPageRoute(builder: (context) => const QuizScreen()),
      );

And In your QuizScreen remove the required key

 QuizScreen ({ Key? key}) : super(key: key);

Answer 2

Comment this line in QuizScreen,

const QuizScreen({required Key? key}) : super(key: key);

In HomePage,

 Navigator.push(
                  context,
                  MaterialPageRoute(
                      builder: (context) => const QuizScreen(),),
                );

Answer 3

try this: QuizScreen ();

and this

 Navigator.push(
                  context,
                  MaterialPageRoute(
                      builder: (context) =>  QuizScreen(),),
                );