flutter - 实现底部导航栏
问题描述
我试图在我的应用程序中实现一个 BottomNavigationBar。但我不让它工作。
所以这是我的代码:
// Vertretungsplan Montag
class VPMontag extends StatelessWidget {
String url;
VPMontag(this.url);
最终完成者 _controller = Completer();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Vertretungsplan Montag'),
),
body: Builder(builder: (BuildContext context) {
return WebView(
initialUrl: url,
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_controller.complete(webViewController);
},
navigationDelegate: (NavigationRequest request) {
if (request.url.startsWith('https://www.youtube.com/')) {
print('blocking navigation to $request}');
return NavigationDecision.prevent;
}
print('allowing navigation to $request');
return NavigationDecision.navigate;
},
onPageStarted: (String url) {
print('Page started loading: $url');
},
onPageFinished: (String url) {
print('Page finished loading: $url');
},
gestureNavigationEnabled: true,
);
}));
}
}
...
vpmontag() {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => VPMontag('myurl')));
}
int _selectedIndex = 0;
static TextStyle optionStyle = TextStyle(fontSize: 30, fontWeight: FontWeight.bold);
static List<Widget> _widgetOptions = <Widget>[
Text(
'Index 0: Home',
style: optionStyle,
),
Center(
child: Container(
child: Column(
children: <Widget>[
RaisedButton(
onPressed: vpmontag,
child: Text('Montag'),
),
),
],
),
),
),
Text(
'Index 2: School',
style: optionStyle,
),
];
void _onItemTapped(int index) {
setState(() {
_selectedIndex = index;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('VP App'),
),
body: Center(
child: _widgetOptions.elementAt(_selectedIndex),
),
bottomNavigationBar: BottomNavigationBar(
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('Startseite'),
),
BottomNavigationBarItem(
icon: Icon(Icons.view_headline),
title: Text('Vertretungspläne'),
),
BottomNavigationBarItem(
icon: Icon(Icons.calendar_today),
title: Text('Stundenpläne'),
),
],
currentIndex: _selectedIndex,
selectedItemColor: Colors.blue[800],
onTap: _onItemTapped,
),
);
}
}
但我得到这个错误:
Compiler message:
lib/main.dart:314:26: Error: Can't access 'this' in a field initializer to read 'vpmontag'.
onPressed: vpmontag,
^^^^^^^^
我有五次“VP Montag”课程,但有其他名字。
我该如何解决这个问题?我必须在任何地方添加“this.vpmontag”吗?
非常感谢任何帮助。
解决方案
只需尝试在 State 类的initState()方法中初始化_widgetOptions变量
List<Widget> _widgetOptions = [];
@override
void initState() {
_widgetOptions = <Widget>[
Text(
'Index 0: Home',
style: optionStyle,
),
Center(
child: Container(
child: Column(
children: <Widget>[
RaisedButton(
onPressed: vpmontag,
child: Text('Montag'),
),
],
),
),
),
Text(
'Index 2: School',
style: optionStyle,
),
];
super.initState();
}
推荐阅读
- javascript - Vue:应用过滤器后如何清除过滤器?
- docker - Traefik v2:将 http://servername/foo 重定向到 http://servername:port
- android-databinding - Android Studio 不会创建绑定类
- logic - 将一阶逻辑 (FOL) 转换为 CNFFormula
- javascript - 两个数组的最小值以创建一个新数组
- c# - 从字符串中删除前导零
- reactjs - 带有 react-google-maps API 的谷歌地图
- java - 如何跳过某个数字并继续?
- java - 使用 Selenium WebDriver 的新选项卡
- python - 我想计算数据框中的 python 列表的元素,并将输出作为数据框中的一列。我怎么做?