我的主.dart屏幕调用SplashScreen,然后SplashScreen调用BottomNavigationScreen。我正在为widgetOptions中的**_widgetOptions.elementAt(_selectedIndex)**手动调用所有屏幕。
我不想手动调用所有的屏幕。相反,我想通过使用在我的main.dart文件中定义的命名路由来调用屏幕。如何将命名路由传递到我定义BottomNavigatioBar的另一个类?
如何在main以外的类中添加BottomNavigationBar,并调用命名的路由,而不是手动调用类?
主省道
import 'package:flutter/material.dart';
import 'package:form_data_api/screens/all_articles_screen.dart';
import 'package:form_data_api/screens/article_detail_screen.dart';
import 'package:form_data_api/screens/user_profile_screen.dart';
// import 'package:form_data_api/screens/all_children_screen.dart';
// import 'package:form_data_api/screens/child_detail_screen.dart';
// import 'package:form_data_api/screens/user_profile_screen.dart';
import 'screens/all_children_screen.dart';
import 'screens/bottom_navigation_screen.dart';
import 'screens/child_detail_screen.dart';
import 'splash_screen.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
initialRoute: '/splashScreen',
routes: {
// When navigating to the "/" route, build the FirstScreen widget.
'/splashScreen': (_) => const SplashScreen(),
// When navigating to the "/second" route, build the SecondScreen widget.
'/bottomNavigationScreen': (_) => const BottomNavigationScreen(),
'/userProfileScreen': (_) => const UserProfileScreen(),
'/allChildrenScreen': (_) => const AllChildrenScreen(),
'/childDetailScreen': (context) => const ChildDetailScreen(childName: '', childId: '',),
'/allArticleScreen': (context) => const AllArticleScreen(),
'/articleDetailScreen': (context) => const ArticleDetailScreen(articleName: '', articleId: '',),
},
// home: SplashScreen(),
);
}
}
底部导航屏幕.dart
import 'package:flutter/material.dart';
import 'all_articles_screen.dart';
import 'all_children_screen.dart';
import 'user_profile_screen.dart';
class BottomNavigationScreen extends StatefulWidget {
const BottomNavigationScreen({super.key});
@override
State<BottomNavigationScreen> createState() => _BottomNavigationScreenState();
}
class _BottomNavigationScreenState extends State<BottomNavigationScreen> {
int _selectedIndex = 0;
// static const TextStyle optionStyle =
// TextStyle(fontSize: 30, fontWeight: FontWeight.bold);
static const List<Widget> _widgetOptions = <Widget>[
UserProfileScreen(),
AllChildrenScreen(),
AllArticleScreen(),
];
void _onItemTapped(int index) {
setState(() {
_selectedIndex = index;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: IndexedStack(
index: _selectedIndex,
children: _widgetOptions,
),
// body: Center(
// child: _widgetOptions.elementAt(_selectedIndex),
// ),
bottomNavigationBar: BottomNavigationBar(
backgroundColor: Colors.blue[50],
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.person),
label: 'Profile',
),
BottomNavigationBarItem(
icon: Icon(Icons.business),
label: 'Children',
),
BottomNavigationBarItem(
icon: Icon(Icons.article),
label: 'Articles',
),
],
currentIndex: _selectedIndex,
selectedItemColor: Colors.blue,
onTap: _onItemTapped,
),
);
}
}
我的主.dart屏幕调用SplashScreen,然后SplashScreen调用BottomNavigationScreen。我正在为widgetOptions中的**_widgetOptions.elementAt(_selectedIndex)**手动调用所有屏幕。
我不想手动调用所有的屏幕。相反,我想通过使用在我的main.dart文件中定义的命名路由来调用屏幕。如何将命名路由传递到我定义BottomNavigatioBar的另一个类?
2条答案
按热度按时间5sxhfpxr1#
用这个
ds97pgxw2#
你好兄弟你好吗?很容易你应该创建这个类类
这是您的材料应用程序
您应该创建的AppRoute类
之后,当你想呼叫页面;
我会帮你的