- TitleProvider 클래스를 생성 후 현재 탭 위치를 확인해주는
checkTab과 title을 변경해주는 changeTitl함수를 생성해줍니다
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
class TitleProvider extends ChangeNotifier{
String title = '사전등록';
String tab = '0';
void changeTitle(var newTitle){
title = newTitle;
notifyListeners();
}
void checkTab(String nowTab){
tab = nowTab;
print(tab);
notifyListeners();
}
}
- TabController선언 후 initState() 함수안에 탭이
변경될때마다 탭의 위치를 체크한값을 checkTab으로 넘겨줍니다1 2 3 4 5 6 7 8 9 10
class _MainScreenState extends State<MainScreen> with TickerProviderStateMixin{ void initState() { _tabController = TabController(length: tabs.length, vsync: this); _tabController.addListener(() { context.read<TitleProvider>().checkTab('${(_tabController.index + 1).toString()}'); } ); super.initState(); } }
- 그다음 Stirng값을 넘겨받는 appBarTitle함수를 생성하고 tab변수(현재 탭 위치를 체크해 넘겨받은 값) 로 현제의
탭위치를 구별하여 각각의 탭의 맞는 title을 return해줍니다1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
class _MainScreenState extends State<MainScreen> with TickerProviderStateMixin{ void initState() { _tabController = TabController(length: tabs.length, vsync: this); _tabController.addListener(() { context.read<TitleProvider>().checkTab('${(_tabController.index + 1).toString()}'); ///////////////////////////////////////////////////////////////////////////////////// String? appBarTitle(){ if (Provider.of<TitleProvider>(context, listen: false).tab == '1'){ return '사전등록'; // 첫번째 탭의 원하는 title } if (Provider.of<TitleProvider>(context, listen: false).tab == '2'){ return '즐겨찾기'; // 두번째 1번 탭의 원하는 title } if (Provider.of<TitleProvider>(context, listen: false).tab == '3'){ return 'MyPage'; // 세번 2번 탭의 원하는 title } } ///////////////////////////////////////////////////////////////////////////////////// } ); super.initState(); } }
- return받은 String값을 TitleProvider클래스의 changeTitle로 넘겨줘 title 변수에 저장합니다
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
class _MainScreenState extends State<MainScreen> with TickerProviderStateMixin{ void initState() { _tabController = TabController(length: tabs.length, vsync: this); _tabController.addListener(() { context.read<TitleProvider>().checkTab('${(_tabController.index + 1).toString()}'); String? appBarTitle(){ if (Provider.of<TitleProvider>(context, listen: false).tab == '1'){ return '사전등록'; } if (Provider.of<TitleProvider>(context, listen: false).tab == '2'){ return '즐겨찾기'; } if (Provider.of<TitleProvider>(context, listen: false).tab == '3'){ return 'MyPage'; } } ///////////////////////////////////////////////////////////////////////// context.read<TitleProvider>().changeTitle(appBarTitle()); ///////////////////////////////////////////////////////////////////////// } ); super.initState(); } }
- 마지막으로 appBar의 title값을 TitleProvider클래스의 title
변수값으로 줍니다 그러면 이제 탭이 변경될 때마다 지정된 title로 바뀌게 됩니다1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
void initState() { isSelected = [isMetric, isImperial, isLike]; isSelected2 = [beforeGame, afterGame]; _tabController = TabController(length: tabs.length, vsync: this); _tabController.addListener(() { context.read<TitleProvider>().checkTab('${(_tabController.index + 1).toString()}'); String? appBarTitle(){ if (Provider.of<TitleProvider>(context, listen: false).tab == '1'){ return '사전등록'; } if (Provider.of<TitleProvider>(context, listen: false).tab == '2'){ return '즐겨찾기'; } if (Provider.of<TitleProvider>(context, listen: false).tab == '3'){ return 'MyPage'; } } context.read<TitleProvider>().changeTitle(appBarTitle()); } ); super.initState(); } //////////////////////////////////////////////////////////////// @override Widget build(BuildContext maincontext) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text(context.watch<TitleProvider>().title), ), ) ) } } ////////////////////////////////////////////////////////////////