title: How to navigate with Buttons and BottomNavigationBar Flutter?
body: <p>I`m new in Flutter and I have a big problem.
  I want to use a BottomNavBar, for switching screens and I want to have in these screens buttons, where i can navigate to another screens. When I´m trying to put my written Code with the Buttons into the onTab, it says that it has a problem with context, which I used to navigate with the Buttons. Can anyone help me?
  Thanks for all answers.
  Here is my Code</p>
  <pre><code> import 'package:flutter/material.dart';
   import 'package:flutter/cupertino.dart';
   import 'dart:math';
  
    void main() {
   runApp(MaterialApp(
    title: 'Navigation Basics',
     debugShowCheckedModeBanner: false,
     home: FirstRoute(),
    ));
     }
  
  class FirstRoute extends StatefulWidget {
   @override
    _FirstRouteState createState() =&gt; _FirstRouteState();
  }
  
  class _FirstRouteState extends State&lt;FirstRoute&gt; {
   int _currentIndex = 0;
   final tabs = [
     Center(),
    ];
    @override
    Widget build(BuildContext context) {
      return Scaffold(
       bottomNavigationBar: BottomNavigationBar(
       currentIndex: _currentIndex,
      items: [
        BottomNavigationBarItem(
            icon: Icon(Icons.home, color: Colors.indigo),
            title: Text(
              &quot;Home&quot;,
              style: TextStyle(color: Colors.indigo),
            ),
            backgroundColor: Colors.indigo),
        BottomNavigationBarItem(
            icon: Icon(
              Icons.settings,
              color: Colors.indigo,
            ),
            title: Text(
              &quot;Settings&quot;,
              style: TextStyle(color: Colors.indigo),
            ),
            backgroundColor: Colors.indigo),
        BottomNavigationBarItem(
            icon: Icon(Icons.folder, color: Colors.indigo),
            title: Text(
              &quot;Saved&quot;,
              style: TextStyle(color: Colors.indigo),
            ),
            backgroundColor: Colors.indigo),
      ],
      onTap: (index) {
        setState(() {
          _currentIndex = index;
        });
      },
    ),
    appBar: PreferredSize(
      preferredSize: Size.fromHeight(35.0),
      child: AppBar(
        title: Text(
          &quot;BeGentle&quot;,
        ),
        backgroundColor: Colors.indigo,
      ),
    ),
    body: Center(
      child: new ListView(
        children: &lt;Widget&gt;[
          Container(
            decoration: BoxDecoration(
              color: Colors.indigo,
              borderRadius: BorderRadius.circular(30.0),
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(1.0),
                  spreadRadius: 5,
                  blurRadius: 10,
                  // changes position of shadow
                ),
              ],
            ),
            height: 120.0,
            width: 400.0,
            padding: EdgeInsets.all(5.0),
            margin: EdgeInsets.all(5.0),
            alignment: Alignment.center,
            child: FlatButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) =&gt; 
  SecondRoute1()),
                );
              },
              child: Text(
                &quot;Öffentlichkeit&quot;,
                style: TextStyle(
                    fontSize: 32.0,
                    fontWeight: FontWeight.w600,
                    color: Colors.white),
              ),
            ),
          ),
          Container(
            decoration: BoxDecoration(
              color: Colors.indigo,
              borderRadius: BorderRadius.circular(30.0),
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(1.0),
                  spreadRadius: 5,
                  blurRadius: 10,
                  // changes position of shadow
                ),
              ],
            ),
            height: 120.0,
            width: 400.0,
            padding: EdgeInsets.all(5.0),
            margin: EdgeInsets.all(5.0),
            alignment: Alignment.center,
            child: FlatButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) =&gt; 
  SecondRoute2()),
                );
              },
              child: Text(
                &quot;Gesprächsthemen&quot;,
                style: TextStyle(
                    fontSize: 32.0,
                    fontWeight: FontWeight.w600,
                    color: Colors.white),
              ),
            ),
          ),
          Container(
            decoration: BoxDecoration(
              color: Colors.indigo,
              borderRadius: BorderRadius.circular(25.0),
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(1.0),
                  spreadRadius: 5,
                  blurRadius: 10,
                  // changes position of shadow
                ),
              ],
            ),
            height: 120.0,
            width: 400.0,
            padding: EdgeInsets.all(5.0),
            margin: EdgeInsets.all(5.0),
            alignment: Alignment.center,
            child: FlatButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) =&gt; 
  SecondRoute3()),
                );
              },
              child: Text(
                &quot;Essen&quot;,
                style: TextStyle(
                    fontSize: 34.0,
                    fontWeight: FontWeight.w600,
                    color: Colors.white),
              ),
            ),
          ),
          Container(
            decoration: BoxDecoration(
              color: Colors.indigo,
              borderRadius: BorderRadius.circular(30.0),
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(1.0),
                  spreadRadius: 5,
                  blurRadius: 10,
                  // changes position of shadow
                ),
              ],
            ),
            height: 120.0,
            width: 400.0,
            padding: EdgeInsets.all(5.0),
            margin: EdgeInsets.all(5.0),
            alignment: Alignment.center,
            child: FlatButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) =&gt; 
   SecondRoute4()),
                );
              },
              child: Text(
                &quot;Treffen&quot;,
                style: TextStyle(
                    fontSize: 32.0,
                    fontWeight: FontWeight.w600,
                    color: Colors.white),
              ),
            ),
          ),
          Container(
            decoration: BoxDecoration(
              color: Colors.indigo,
              borderRadius: BorderRadius.circular(30.0),
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(1.0),
                  spreadRadius: 5,
                  blurRadius: 10,
                  // changes position of shadow
                ),
              ],
            ),
            height: 120.0,
            width: 400.0,
            padding: EdgeInsets.all(5.0),
            margin: EdgeInsets.all(5.0),
            alignment: Alignment.center,
            child: FlatButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) =&gt; 
  SecondRoute5()),
                );
              },
              child: Text(
                &quot;Social Interacting&quot;,
                style: TextStyle(
                    fontSize: 32.0,
                    fontWeight: FontWeight.w600,
                    color: Colors.white),
              ),
            ),
          ),
        ],
      ),
         ),
       );
      }
  }
  </code></pre>