Act99 기술블로그

[비전공자] flutter / Tabbar in appBar / 앱 바에 탭 바를 넣고 싶을 때, bottom 을 사용하지 않고 앱바에 탭바를 넣고 싶을 때 본문

개발팁저장소/flutter

[비전공자] flutter / Tabbar in appBar / 앱 바에 탭 바를 넣고 싶을 때, bottom 을 사용하지 않고 앱바에 탭바를 넣고 싶을 때

Act99 2020. 11. 25. 10:48

플러터 Scaffod -> appBar 에서 탭바를 넣고 싶을 땐, bottom 을 호출하여 탭바를 넣을 수 있다.

하지만 앱바의 사이즈가 커지기 때문에 좀 불편....하다.

 

이 때, PreferredSize를 이용하면 UI 가 그나마 이쁘게 나온다.

(action을 호출해 사용해봤지만 상당히 불안정하기 때문에 이 방법이 그나마 낫다.)

 

------------------------------------------------------------------

 

                        appBar: PreferredSize(

                          preferredSize: Size.fromHeight(height * 0.155),

                          child: AppBar(

                            backgroundColor: Colors.transparent,

                            shadowColor: Colors.transparent,

                            bottom: TabBar(

                              indicator: BoxDecoration(

                                  border: Border(

                                      bottom: BorderSide(

                                          color: Theme.of(context).shadowColor))),

                              tabs: [

                                Container(

                                    height: height * 0.08,

                                    child: new Text("Today's schedule")),

                                Container(

                                    height: height * 0.08,

                                    child: new Text("All notes")),

                              ],

                            ),

                          ),

                        ),

 

---------------------------------------