英文:
Flutter- how to navigate different pages by curved navigation bar
问题
我正在创建一个Flutter应用程序，并需要帮助如何导航到不同的页面。此外，当我点击曲线导航栏的按钮时，图标不会更改。
你能帮助我吗？
以下是我的曲线导航栏的代码：
import 'package:curved_navigation_bar/curved_navigation_bar.dart';
import 'package:flutter/material.dart';
import 'package:hexcolor/hexcolor.dart';
class BAR extends StatefulWidget {
const BAR({super.key});
@override
State<BAR> createState() => _BARState();
}
class _BARState extends State<BAR> {
@override
Widget build(BuildContext context) {
return CurvedNavigationBar(
backgroundColor: HexColor("#F7ECCD"),
color: HexColor("#AE621C"),
items: [
Icon(
Icons.home,
color: Colors.white,
size: 30,
),
Icon(
Icons.favorite,
color: Colors.white,
size: 30,
),
Icon(
Icons.settings,
color: Colors.white,
size: 30,
)
],
onTap: (index) {
setState(() {
if (index == 0) {
Navigator.pushNamed(context, '/');
}
if (index == 1) {
Navigator.pushNamed(context, '/one');
}
if (index == 2) {
Navigator.pushNamed(context, '/two');
}
});
},
);
}
}
谢谢！
英文:
i am creating a flutter app and want help on how to navigate to different pages. Also, when i tap on buttons of curved navigation bar nothing happens the icons not changing.
can u please help me out?
here is my code for the curved navigation bar
Thank u
import 'package:flutter/material.dart';
import 'package:hexcolor/hexcolor.dart';
class BAR extends StatefulWidget {
const BAR({super.key});
@override
State<BAR> createState() => _BARState();
}
class _BARState extends State<BAR> {
@override
Widget build(BuildContext context) {
return CurvedNavigationBar(
backgroundColor: HexColor("#F7ECCD"),
color: HexColor("#AE621C"),
items: [
Icon(
Icons.home,
color: Colors.white,
size: 30,
),
Icon(
Icons.favorite,
color: Colors.white,
size: 30,
),
Icon(
Icons.settings,
color: Colors.white,
size: 30,
)
],
onTap: (index){
setState(() {
if (index == 0) {
Navigator.pushNamed(context, '/');
}
if (index == 1) {
Navigator.pushNamed(context, '/one');
}
if (index == 2) {
Navigator.pushNamed(context, '/two');
}
});
},);
}
}
</details>
# 答案1
**得分**: 1
```dart
import 'package:flutter/cupertino.dart';
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _selectedIndex = 0;
static const TextStyle optionStyle =
TextStyle(fontSize: 30, fontWeight: FontWeight.bold);
static const List<Widget> _widgetOptions = <Widget>[
Text(
'Index 0: Home',
style: optionStyle,
),
Text(
'Index 1: Business',
style: optionStyle,
),
Text(
'Index 2: School',
style: optionStyle,
),
];
void _onItemTapped(int index) {
setState(() {
_selectedIndex = index;
});
}
@override
Widget build(BuildContext context) {
return CupertinoTabScaffold(
tabBar: CupertinoTabBar(
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(CupertinoIcons.home),
title: Text('Home'),
),
BottomNavigationBarItem(
icon: Icon(CupertinoIcons.business),
title: Text('Business'),
),
BottomNavigationBarItem(
icon: Icon(CupertinoIcons.school),
title: Text('School'),
),
],
currentIndex: _selectedIndex,
onTap: _onItemTapped,
backgroundColor: CupertinoColors.systemGrey,
activeColor: CupertinoColors.black,
),
tabBuilder: (BuildContext context, int index) {
return CupertinoTabView(
builder: (BuildContext context) {
return CupertinoPageScaffold(
child: Center(
child: _widgetOptions.elementAt(index),
),
);
},
);
},
);
}
}
英文:
import 'package:flutter/cupertino.dart';
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _selectedIndex = 0;
static const TextStyle optionStyle =
TextStyle(fontSize: 30, fontWeight: FontWeight.bold);
static const List<Widget> _widgetOptions = <Widget>[
Text(
'Index 0: Home',
style: optionStyle,
),
Text(
'Index 1: Business',
style: optionStyle,
),
Text(
'Index 2: School',
style: optionStyle,
),
];
void _onItemTapped(int index) {
setState(() {
_selectedIndex = index;
});
}
@override
Widget build(BuildContext context) {
return CupertinoTabScaffold(
tabBar: CupertinoTabBar(
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(CupertinoIcons.home),
title: Text('Home'),
),
BottomNavigationBarItem(
icon: Icon(CupertinoIcons.business),
title: Text('Business'),
),
BottomNavigationBarItem(
icon: Icon(CupertinoIcons.school),
title: Text('School'),
),
],
currentIndex: _selectedIndex,
onTap: _onItemTapped,
backgroundColor: CupertinoColors.systemGrey,
activeColor: CupertinoColors.black,
),
tabBuilder: (BuildContext context, int index) {
return CupertinoTabView(
builder: (BuildContext context) {
return CupertinoPageScaffold(
child: Center(
child: _widgetOptions.elementAt(index),
),
);
},
);
},
);
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论