bottomnavigationbar를 유지하는 방법

CupertinoTabBar를 이용하는 방법

https://stackoverflow.com/questions/49628510/flutter-keep-bottomnavigationbar-when-push-to-new-screen-with-navigator

문제점

CupertinoScafold에서는 scafold와 appbar를 사용할 수 없다는 단점이 있습니다.

provider controller를 이용하는 방법

bottom_navigation_provider.dart

import 'package:flutter/material.dart';

class BottomNavigationProvider extends ChangeNotifier {
  final List<int> _indexList = [0];
  int get currentPage => _indexList[_indexList.length - 1];
  int get prevPage => _indexList[_indexList.length - 2];
  push(int index) {
    _indexList.add(index);
    notifyListeners();
  }

  pop() {
    _indexList.removeLast();
    notifyListeners();
  }
}

home.dart

Widget _navigationBody(
      BottomNavigationProvider bottomNavigationProvider, BuildContext context) {
    switch (bottomNavigationProvider.currentPage) {
      case 0:
        return const FirstPage();
      case 1:
        return WebViewGithub();
      case 2:
        return const MotivePage();
      case 3:
        return const CareerPage();
      case 4:
        return const KeywordDetail();
    }
    return Container();
  }

home.dart

**class _BottomNavigationBar extends StatelessWidget {
  final BottomNavigationProvider bottomNavigationProvider;
  const _BottomNavigationBar({
    Key? key,
    required this.bottomNavigationProvider,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Consumer<BottomNavigationProvider>(
      builder: (context, provider, widget) {
        return BottomNavigationBar(
          type: BottomNavigationBarType.fixed,
          selectedFontSize: 10,
          unselectedFontSize: 10,
          items: [
            BottomNavigationBarItem(
              icon: SvgPicture.asset(
                'assets/icons/home.svg',
              ),
              activeIcon: SvgPicture.asset(
                'assets/icons/home_pink.svg',
              ),
              label: '홈',
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset('assets/icons/flower.svg'),
              activeIcon: SvgPicture.asset(
                'assets/icons/flower_pink.svg',
              ),
              label: '깃허브',
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset('assets/icons/chat.svg'),
              activeIcon: SvgPicture.asset(
                'assets/icons/chat_pink.svg',
              ),
              label: '지원동기',
            ),
            BottomNavigationBarItem(
              icon: SvgPicture.asset('assets/icons/flower.svg'),
              activeIcon: SvgPicture.asset(
                'assets/icons/flower_pink.svg',
              ),
              label: '경력기술서',
            ),
          ],
          currentIndex: bottomNavigationProvider.currentPage > 3
              ? bottomNavigationProvider.prevPage
              : bottomNavigationProvider.currentPage,
          selectedItemColor: customColor[CustomColor.crimson],
          onTap: (index) {
            bottomNavigationProvider.push(index);
          },
        );
      },
    );
  }
}**

코드 설명

KeywordDetail 페이지는 bottomnavigation으로는 접근이 불가능하고 firstpage에서만 접근이 가능하고 할 때 bottomNavigationProvider에 4라는 값을 넣어준다. 하지만 단지 push만 해주면 _BottomNavigationBar의 currentIndex에서 에러가 발생함으로 currentPage가 3을 초과할 경우 이전의 페이지를 focusing하게 해주면 문제가 해결된다.
솔직히 bottomnavigation을 처음 써봐서 이게 맞는 방법인지는 잘 모르겠다.

다른 해결법?

https://thuthi.tistory.com/entry/Flutter-BottomNavigationBar-유지하는-방법-총-정리?category=1001228
provider를 이용한 방법의 문제점을 발겨하지 못하여서 시도하지 않았지만 다른 방법도 있는것 같다.