Error: The getter 'context' isn't defined for the class 'MyApp'-CodePudding

I want to make an app that contain 4 buttons and it will go to other page if I click the button. But when I use the navigator it shows an error at context.

import 'package:flutter/material.dart';
import 'package:mytestapp/LectureVideo.dart';
import 'package:path/path.dart';

void main() {
  runApp( MaterialApp(
    debugShowCheckedModeBanner: false, //hide debug sash at top right
    title: 'HomePage',
    home: MyApp(),
  )
  );
}

class MyApp extends StatelessWidget{

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width; //getting screen width
    return Scaffold(
      appBar: AppBar(title: Text('Welcome to EMTeach'),
      centerTitle: true,
      backgroundColor: Colors.lime[200],
      ),
      body: SafeArea(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            FirstButton(width),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            SecondButton(width),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            ThirdButton(width),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            FourthButton(width),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
          ],
        ),
      ),
    );
  }

  Widget FirstButton(double width) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {
            Navigator.push(
              context, //error
               MaterialPageRoute(builder: (context) => LectureVideo()));
          },
          color: Colors.red,
          child: Text(
            "Lecture Video",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }

  Widget SecondButton(double width) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {},
          color: Colors.lightGreen,
          child: Text(
            "Application Video",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }

  Widget ThirdButton(double width) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {},
          color: Colors.lightBlue,
          child: Text(
            "List of Equation",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }

  Widget FourthButton(double width) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {},
          color: Colors.orange,
          child: Text(
            "List of Question",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }
}

CodePudding user response：

the problem is you are not passing the context which is the parameter of the build function over to your buttons try this:

Widget FirstButton(double width,BuildContext context ) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {
            Navigator.push(
              context, //error
               MaterialPageRoute(builder: (context) => LectureVideo()));
          },
          color: Colors.red,
          child: Text(
            "Lecture Video",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }

CodePudding user response：

Thank you !!. It works!! But another error appear at "width" FirstButton(width). The error said "2 positional argument(s) expected, but 1 found".

import 'package:flutter/material.dart';
import 'package:mytestapp/LectureVideo.dart';
//import 'package:path/path.dart';

void main() {
  runApp( MaterialApp(
    debugShowCheckedModeBanner: false, //hide debug sash at top right
    title: 'HomePage',
    home: MyApp(),
  )
  );
}

class MyApp extends StatelessWidget{

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width; //getting screen width
    return Scaffold(
      appBar: AppBar(title: Text('Welcome to EMTeach'),
      centerTitle: true,
      backgroundColor: Colors.lime[200],
      ),
      body: SafeArea(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            FirstButton(**width**),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            SecondButton(width),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            ThirdButton(width),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
            FourthButton(width),
            Container(margin: EdgeInsets.only(bottom: 20.0)),
          ],
        ),
      ),
    );
  }

  Widget FirstButton(double width,BuildContext context) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {
            Navigator.push(
              context, //error
               MaterialPageRoute(builder: (context) => LectureVideo()));
          },
          color: Colors.red,
          child: Text(
            "Lecture Video",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }

  Widget SecondButton(double width) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {},
          color: Colors.lightGreen,
          child: Text(
            "Application Video",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }

  Widget ThirdButton(double width) {
    return Expanded(
      child: SizedBox(
        width: width - 20,
        child: RaisedButton(
          onPressed: () {},
          color: Colors.lightBlue,
          child: Text(
            "List of Equation",
            textScaleFactor: 2.0,
          ),
        ),
        //fit: BoxFit.cover,
      ),
    );
  }