`
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
class BottomNavBarWidget extends StatefulWidget {
@override
_BottomNavBarWidgetState createState() => _BottomNavBarWidgetState();
}
class _BottomNavBarWidgetState extends State<BottomNavBarWidget> {
@override
Widget build(BuildContext context) {
int _selectedIndex = 0;
void _onItemTapped(int index) {
setState(() {
_selectedIndex = index;
// navigateToScreens(index);
});
}
return BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text(
'Home',
style: TextStyle(color: Color(0xFF2c2b2b)),
),
),
],
currentIndex: _selectedIndex,
selectedItemColor: Color(0xFFfd5352),
onTap: _onItemTapped,
);
}
}
I was assigned to run a mobile application with the Flutter framework. But I don't understand how to use "title" in the navbar item, of course with style. Therefore, I want to ask, "How do I fix the error in the code?" and how to include a proper "title" parameter in Flutter?
CodePudding user response:
instead of defining the title
on BottomNavigationBarItem
because it doesn't exist anymore, you should use the label
which accepts a String
, like this:
// ...
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: 'Home', // use this
),
// ...
CodePudding user response:
In updated flutter version title
is migrated with label
.
Use it like :
BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Home')
CodePudding user response:
title
parameter is deprecated by the flutter, either use a previous flutter version or change your title parameter to label
which accepts only string
as a parameter.
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: const Text('Home') // remove this and replace it with
label: 'Home', // this instead...
),
For styling the text use customized theme in material app for example:
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(
bottomNavigationBarTheme: BottomNavigationBarThemeData(), // edit this object
home: const HomeScreen(),
),
);
}
}