• 카테고리

    질문 & 답변
  • 세부 분야

    모바일 앱 개발

  • 해결 여부

    미해결

네비게이션바 질문

23.06.09 17:09 작성 조회수 287

0

안녕하세요!

강사님께서 구현해주신 메인 화면에서 네비게이션바를 onTap의 controller를 통해 받아오며 화면이 전환되는데,
상세화면에 들어간 후에도 하위 탭이 유지되는 기능을 구현하고 싶어 구현중입니다.

class _DefaultLayoutState extends State<DefaultLayout> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: widget.backgroundColor ?? Colors.white,
      appBar: renderAppBar(),
      body: widget.child,
      bottomNavigationBar: NavigationBar(),
      floatingActionButton: widget.floatingActionButton,
    );
  }

  NavigationBar() {
    if(widget.bottomNavigationBar == null) {
      return BottomNavigationBar(
          selectedItemColor: PRIMARY_COLOR,
          unselectedItemColor: BODY_TEXT_COLOR,
          selectedFontSize: 10,
          unselectedFontSize: 10,
          type: BottomNavigationBarType.fixed,
          onTap: (int index) {
            Navigator.of(context).push(
              MaterialPageRoute(
                builder: (_) => MainBoard(index: 1,),
              ),
            );
          },
          items: [
            BottomNavigationBarItem(
              icon: Icon(Icons.work_history_outlined),
              label: '1',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.attach_money),
              label: '2',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.people_alt),
              label: '3',
            ),
        ],
      );
    }
    else{
      return widget.bottomNavigationBar;
    }
  }

위의 코드처럼 메인 화면에서 네비게이션바가 null로 전송된다면 디폴트 네비게이션바를 구현하려고 시도하는데,
화면이 넘어간 이후, 값을 다른 화면에 넘겨 NavigationBar 탭을 변경시키려고 하고 있습니다.

근데, widget.index 형식으로 받아오는 방식으로 이용하면 하위 탭만 선택되었다고 변경이 되고 onTap기능인 TabBarView의 controller 영역인 메인 화면이 변경되지 않는데 혹시 해당 부분은 어떤식으로 event를 줘야하는지 알 수 있을까요?

 

 

 

답변 1

답변을 작성해보세요.

-1

안녕하세요!

혹시 제가 새로 올려드린 GoRouter v7강의 보셨을까요?

ShellRoute를 사용하면 매우 쉽게 구현 할 수 있습니다!

ShellRoute를 감싸고 있는 하위 라우트에 원하시는 화면을 넣으시면 됩니다.

감사합니다!