Как проложить маршрут страницы в нижней навигации в другом файле / странице

#flutter #flutter-bottomnavigation

#flutter #flutter-bottomnavigation

Вопрос:

Я хочу добавить нижнюю навигацию в свое приложение, но когда я хочу добавить эту строку _children[_selectedIndex], , но как я добавляю эту строку, потому что я нахожусь в другом файле, где я создаю навигацию, но в home.файл dart как добавить эту строку в тело? Код главной страницы dart :

 import 'package:flutter/material.dart';
import 'package:try_custom_list_view/widget/bottom_nav.dart';
import 'package:try_custom_list_view/widget/drawer.dart';
import 'package:try_custom_list_view/widget/list_view.dart';

class SampleApp extends StatefulWidget {
  @override
  _SampleAppState createState() => _SampleAppState();
}

class _SampleAppState extends State<SampleApp> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Gaming Shayari"),
      ),
      body: ListViewFromApi(),
      drawer: MyDrawer(),
      bottomNavigationBar: MyNavBar(),
    );
  }
}
  

Код файла dart с нижней навигацией :

 import 'package:flutter/material.dart';
import 'package:google_nav_bar/google_nav_bar.dart';
import 'package:line_icons/line_icons.dart';
import 'package:try_custom_list_view/trending.dart';
import 'package:try_custom_list_view/widget/list_view.dart';

class MyNavBar extends StatefulWidget {
  @override
  _MyNavBarState createState() => _MyNavBarState();
}

class _MyNavBarState extends State<MyNavBar> {
  int _selectedIndex = 0;
  final List<Widget> _children = <Widget>[
    ListViewFromApi(),
    MyTrending(),
  ];
  @override
  Widget build(BuildContext context) {
    return Container(
        decoration: BoxDecoration(
          color: Colors.white,
          boxShadow: [
            BoxShadow(
              blurRadius: 20,
              color: Colors.black.withOpacity(.1),
            )
          ],
        ),
        child: SafeArea(
            child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 15.0, vertical: 8),
          child: GNav(
            gap: 12,
            activeColor: Colors.white,
            iconSize: 24,
            padding: EdgeInsets.symmetric(horizontal: 20, vertical: 5),
            duration: Duration(milliseconds: 600),
            tabBackgroundColor: Colors.grey[800],
            tabs: [
              GButton(
                icon: LineIcons.home,
                text: 'Home',
                backgroundColor: Colors.purple,
              ),
              GButton(
                icon: LineIcons.plus_circle,
                text: 'Add Your Poetry',
                backgroundColor: Colors.green,
              ),
              GButton(
                icon: LineIcons.fire,
                text: 'Trending',
                backgroundColor: Colors.red,
              ),
            ],
            selectedIndex: _selectedIndex,
            onTabChange: (index) {
              setState(() {
                _selectedIndex = index;
              });
            },
          ),
        )));
  }
}
  

Где я разместил этот код для навигации между страницами? _children[_selectedIndex],

Ответ №1:

У вас есть три GButtons входа GNav . Итак, вам нужно использовать три виджета в _children списке. Затем вы можете использовать поставщика состояния приложения для установки и получения выбранного индекса нижней навигации в разных файлах. Посмотрите здесь, как использовать простое управление состоянием приложения.