Flutter-底部导航栏不显示当前选项卡视图

时间:2019-05-15 11:04:27

标签: flutter rxdart

我正在学习颤振。我想使用底部导航栏制作应用。我建立了底部导航栏与5选项卡。其中之一是个人资料标签。我的情况是,当我点击配置文件选项卡时,我的应用程序将检查用户是否已登录。如果用户未登录,则我的应用将使用Navigator.push()重定向到LoginPage,并从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')],
              ),
            )
          ],
        ));
  }
}

1 个答案:

答案 0 :(得分:0)

我通过更改代码意外解决了

来自

 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];
      });
    });