Created
May 11, 2023 10:58
-
-
Save rubywai/4a1452fb373b598da3520c4e980d909f to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
import 'package:flutter_ui_lesson/screens/first_screen.dart'; | |
import 'package:flutter_ui_lesson/screens/second_screen.dart'; | |
import 'package:flutter_ui_lesson/screens/third_screen.dart'; | |
class MainScreen extends StatefulWidget { | |
const MainScreen({Key? key}) : super(key: key); | |
@override | |
State<MainScreen> createState() => _MainScreenState(); | |
} | |
class _MainScreenState extends State<MainScreen> { | |
final List<Widget> _bodyList = [const FirstScreen(),const SecondScreen(),const ThirdScreen()]; | |
Widget _bodyWidget = const FirstScreen(); | |
List<String> _titleList = ['First Screen','Second Screen','Third Screen']; | |
String _title = 'First Screen'; | |
int _selectedIndex = 0; | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar(title: Text(_title),), | |
body: _bodyWidget, | |
bottomNavigationBar: SafeArea( | |
child: NavigationBar( | |
onDestinationSelected: (int index){ | |
setState(() { | |
_selectedIndex = index; | |
_bodyWidget = _bodyList[index]; | |
_title = _titleList[index]; | |
}); | |
}, | |
selectedIndex: _selectedIndex, | |
destinations: const [ | |
NavigationDestination(icon: Icon(Icons.home), label: 'First screen'), | |
NavigationDestination(icon: Icon(Icons.video_call), label: 'Second screen'), | |
NavigationDestination(icon: Icon(Icons.settings), label: 'Third screen'), | |
], | |
), | |
), | |
); | |
} | |
} | |
theme => | |
theme: ThemeData.light().copyWith( | |
navigationBarTheme: NavigationBarThemeData( | |
backgroundColor: Colors.indigo, | |
indicatorColor: Colors.brown, | |
iconTheme: MaterialStateProperty.resolveWith((states){ | |
if(states.contains(MaterialState.selected)){ | |
return const IconThemeData(color: Colors.white,size: 28); | |
} | |
return const IconThemeData(color: Colors.grey,size: 23); | |
}), | |
labelTextStyle: MaterialStateProperty.resolveWith((states){ | |
if(states.contains(MaterialState.selected)){ | |
return const TextStyle(color: Colors.white,fontSize: 20); | |
} | |
return const TextStyle(color: Colors.grey); | |
}) | |
) | |
), |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment