Как я могу сделать несколько экранов с нижним меню

Question

Я делаю нижнее меню.Я хочу сделать 3 экрана.и для этого я хочу сделать 3 отдельных класса.1 экран - 1 класс.И для этого все используют 1 эшафот.Как мне это сделать?Все мои классы должны быть StateFull для использования функции "setState"

Я был найден в исходных кодах Google.но они для одного виджета

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

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

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

class _MyHomePageState extends State<MyHomePage> {


  int _selectedIndex = 1;

  final _widgetOptions = [
    Text('Index 0: Home'),
    Text('Index 1: Business'),
    Text('Index 2: School'),
  ];

  @override
  Widget build(BuildContext context) {
    //API_Tumbler api = new API_Tumbler("3EuKq8hIimaGFxY3wqzL7MXw5qZuN3Zcx9cIEgWKT4UTINwGec", "gjkCRximp0OJtFGN4Zd8xD2yPMwjw557EtgVvKhmqLNdI9IOBx");
    return Scaffold(
      appBar: AppBar(
        title: Text("Miner of Memes"),
      ),
      body: Center(
        child: _widgetOptions.elementAt(_selectedIndex),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: [
          new BottomNavigationBarItem(
            icon: Icon(Icons.library_books),
            title: Text('Блоги'),
          ),
          new BottomNavigationBarItem(
            icon: Icon(Icons.subject),
            title: Text('Лента'),
          ),
          new BottomNavigationBarItem(
              icon: Icon(Icons.send),
              title: Text('Отправка')
          )
        ],
        currentIndex: _selectedIndex,
        onTap: _onItemTapped,
      ),
    );
  }

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

}

Answer 1

Это можно сделать, заменив виджет Текст на имя класса в
_widgetOptions .

Создание файла позволяетскажем firstScreen.dart со следующим кодом:

class Firstscreen extends StatefulWidget {
  const FirstScreen({ Key key }) : super(key: key);

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

class _FirstScreenState extends State<FirstScreen> {
  @override
  Widget build(BuildContext context) {
    return Text("This is FirstScreen);
  }
}

сейчас в вашем коде отредактируйте это.

import './firstScreen.dart' //include the file created

...

final _widgetOptions = [
    FirstScreen(),
    Text('Index 1: Business'),
    Text('Index 2: School'),
  ];

Просто сделайте то же самое длядругие экраны тоже.Надеюсь, это поможет вам:)