font_awesome_flutter
![](https://thana.in.th/wp-content/uploads/2021/07/Screen-Shot-2564-07-31-at-11.36.37.png)
This will add a line like this to your package’s pubspec.yaml (and run an implicit dart pub get
):
dependencies:
font_awesome_flutter: ^9.1.0
![](https://thana.in.th/wp-content/uploads/2021/07/Screen-Shot-2564-07-31-at-11.42.18.png)
Import it
Now in your Launcher.dart , you can use:
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
![](https://thana.in.th/wp-content/uploads/2021/07/Screen-Shot-2564-07-31-at-11.45.33.png)
class _LauncherState extends State<Launcher> {
int _selectedIndex = 0;
List<Widget> _pageWidget = [
HomePage(),
ProfilePage(),
AboutPage()
];
List<BottomNavigationBarItem> _menuBar = <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(FontAwesomeIcons.home),
label: 'Home'
),
BottomNavigationBarItem(
icon: Icon(FontAwesomeIcons.userAlt),
label: 'Profile'
),
BottomNavigationBarItem(
icon: Icon(FontAwesomeIcons.infoCircle),
label: 'About'
),
];
void _onItemTapped(int index) {
setState(() {
_selectedIndex = index;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: _pageWidget.elementAt(_selectedIndex),
bottomNavigationBar: BottomNavigationBar(
items: _menuBar,
currentIndex: _selectedIndex,
selectedItemColor: Theme.of(context).primaryColor,
unselectedItemColor: Colors.grey,
onTap: _onItemTapped,
),
);
}
![](https://thana.in.th/wp-content/uploads/2021/07/Screen-Shot-2564-07-31-at-12.16.38.png)
Run & Debug
![](https://thana.in.th/wp-content/uploads/2021/07/image-12-473x1024.png)
![](https://thana.in.th/wp-content/uploads/2021/07/image-13-473x1024.png)
![](https://thana.in.th/wp-content/uploads/2021/07/image-14-473x1024.png)
import 'package:flutter/material.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import 'package:flutter_workshoptest/pages/AboutPage.dart'; import 'package:flutter_workshoptest/pages/HomePage.dart'; import 'package:flutter_workshoptest/pages/ProfilePage.dart'; class Launcher extends StatefulWidget { Launcher({Key? key}) : super(key: key); @override _LauncherState createState() => _LauncherState(); } class _LauncherState extends State<Launcher> { int _selectedIndex = 0; List<Widget> _pageWidget = [HomePage(), ProfilePage(), AboutPage()]; List<BottomNavigationBarItem> _menuBar = <BottomNavigationBarItem>[ BottomNavigationBarItem(icon: Icon(FontAwesomeIcons.home), label: 'Home'), BottomNavigationBarItem( icon: Icon(FontAwesomeIcons.userAlt), label: 'Profile'), BottomNavigationBarItem( icon: Icon(FontAwesomeIcons.infoCircle), label: 'About'), ]; void _onItemTapped(int index) { setState(() { _selectedIndex = index; }); } @override Widget build(BuildContext context) { return Scaffold( body: _pageWidget.elementAt(_selectedIndex), bottomNavigationBar: BottomNavigationBar( items: _menuBar, currentIndex: _selectedIndex, selectedItemColor: Theme.of(context).primaryColor, unselectedItemColor: Colors.grey, onTap: _onItemTapped, ), ); } }
(Visited 287 times, 1 visits today)