[英]Flutter - Bottom Navigation Bar does not display current tab view
我正在学习扑动。 我想用底部导航栏制作应用程序。 我已经建立了带有5个标签的底部导航栏。 其中一个是个人资料标签。 我的情况是,当我点击个人资料标签时,我的应用程序将检查用户是否已登录。 如果用户没有登录,我的应用程序将使用Navigator.push()
重定向到LoginPage,如果登录成功则返回值为true
,如果登录失败则返回false
,或者用户点击应用栏上的返回按钮。
之后在ProfilePage中,它检查true将显示配置文件,false将重定向到上一页。
我正在使用rxdart和BehaviourSubject来更改索引页面。 我成功地更改了选项卡索引和选项卡主体。 但我的应用程序不显示当前正文(点按个人资料标签前的上一个标签)
Main.dart
import 'package:flutter/material.dart';
import 'package:usahaku_flutter/pages/HomePage.dart';
import 'package:usahaku_flutter/pages/ChatPage.dart';
import 'package:usahaku_flutter/pages/TransactionPage.dart';
import 'package:usahaku_flutter/pages/ProfilePage.dart';
import 'package:usahaku_flutter/pages/ShopPage.dart';
import './services/locator_service.dart';
import './blocs/NavTab.dart';
void main() {
setup();
runApp(MyApp());
}
class MyApp extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return MyAppState();
}
}
class MyAppState extends State<MyApp> {
final _pageOption = [
HomePage(),
ChatPage(),
UserProfile(),
TransactionPage(),
ShopPage(),
];
int _currentTabIndex = 0;
var _currentPage;
@override
initState() {
super.initState();
_currentPage = _pageOption[_currentTabIndex];
sl.get<NavTab>().subject_currentTab.listen((data) {
_currentTabIndex = data;
_currentPage = _pageOption[_currentTabIndex];
print(_currentPage);
});
}
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'UsahaKu',
theme: ThemeData(primarySwatch: Colors.brown),
home: SafeArea(
child: Scaffold(
body: _currentPage,
bottomNavigationBar: BottomNavigationBar(
fixedColor: Colors.black87,
currentIndex: _currentTabIndex,
type: BottomNavigationBarType.fixed,
items: [
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('Home'),
),
BottomNavigationBarItem(
icon: Icon(Icons.chat),
title: Text('Chat'),
),
BottomNavigationBarItem(
icon: Icon(Icons.person),
title: Text('Profile'),
),
BottomNavigationBarItem(
icon: Icon(Icons.transform),
title: Text('Transaksi'),
),
BottomNavigationBarItem(
icon: Icon(Icons.business_center),
title: Text('Toko'),
),
],
onTap: (index) {
setState(() {
sl.get<NavTab>().changeTab(index);
});
}),
),
));
}
}
NavTab.dart
import 'package:rxdart/rxdart.dart';
class NavTab {
BehaviorSubject<int> subject_currentTab = new BehaviorSubject<int>();
BehaviorSubject<int> subject_previousTab = new BehaviorSubject<int>();
// Observable<int> currentTab;
// Observable<int> previousTab;
NavTab() {
// currentTab = new Observable(subject_currentTab);
// previousTab = new Observable(subject_previousTab);
subject_currentTab.add(0);
subject_previousTab.add(null);
}
void changeTab(int c) {
var cr = subject_currentTab.value;
var pr = subject_previousTab.value;
if (cr != pr) {
subject_previousTab.add(cr);
subject_currentTab.add(c);
}else{
subject_currentTab.add(c);
}
}
void backToPreviousTab() {
var r = subject_previousTab.value;
subject_currentTab.add(r);
}
}
ProfilePage.dart
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:usahaku_flutter/services/Auth.dart';
import 'package:usahaku_flutter/services/locator_service.dart';
import './LoginPage.dart';
import '../blocs/NavTab.dart';
class UserProfile extends StatefulWidget {
@override
UserProfileState createState() => UserProfileState();
}
class UserProfileState extends State<UserProfile> {
Map<String, dynamic> _profile;
StreamSubscription _profileSubs = null;
@override
initState() {
super.initState();
print('constructor');
print('profile page');
_profileSubs = sl.get<AuthService>().profile.listen((state) => setState(() {
print('constructor');
print('state');
print(state);
if (state == null) {
print('navigate to loginpage');
Navigator.push(context,
MaterialPageRoute(builder: (context) => LoginPage())).then((t) {
if (t == false) {
sl.get<NavTab>().backToPreviousTab();
}
});
} else {
_profile = state;
}
}));
}
@override
void dispose() {
_profileSubs.cancel();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Profile'),
),
body: Column(
children: <Widget>[
Text(_profile.toString()),
MaterialButton(
onPressed: () => sl.get<AuthService>().signOut(),
child: Text('Logout'),
)
],
),
);
}
}
LoginPage.dart
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart';
import 'package:usahaku_flutter/services/Auth.dart';
import '../services/locator_service.dart';
class LoginPage extends StatefulWidget {
@override
LoginPageState createState() => LoginPageState();
}
class LoginPageState extends State<LoginPage> {
Observable _profileSubs = null;
@override
initState() {
super.initState();
_profileSubs = sl.get<AuthService>().user.switchMap((u) {
if (u != null) {
Navigator.pop(context, true);
}
});
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: IconButton(
icon: Icon(Icons.chevron_left),
onPressed: () => Navigator.pop(context, false),
),
title: Text('Login'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
MaterialButton(
onPressed: () {
sl.get<AuthService>().googleSignIn().then((value) {
if (value != null) {
Navigator.pop(context, true);
}
});
},
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: <Widget>[Icon(Icons.get_app), Text('Login')],
),
)
],
));
}
}
我通过更改代码意外地解决了这个问题
从
sl.get<NavTab>().subject_currentTab.listen((data) {
_currentTabIndex = data;
_currentPage = _pageOption[_currentTabIndex];
print(_currentPage);
});
至
sl.get<NavTab>().subject_currentTab.listen((data) {
setState(() {
_currentTabIndex = data;
_currentPage = _pageOption[_currentTabIndex];
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.