I am new to flutter and would like to create an app bar with 2 different text values, please see below:
So far, I have written the following code:
class HomePage extends StatelessWidget {
final double toolbarOpacity = 2.0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar:
PreferredSize(
preferredSize: Size(double.infinity, 114),
child: AppBar(
centerTitle: false,
title: Text(
'My App',
style: TextStyle(
color: titleTextColor,
fontWeight: titleTextFontWeight,
fontFamily: titleFontFamily,
fontSize: titleFontSize),
),
backgroundColor: Color.fromRGBO(232, 232, 242, 1),
),
),
);
}
}
Which has given me the following results:
Could somebody please either direct me to material or help me to achieve my desired output?
Thanks in advance.
As title accepts widget u can use column widget in it like this
AppBar(
centerTitle: false,
title: Column(
children: <Widget>[
Text(
'My App',
style: TextStyle(
color: titleTextColor,
fontWeight: titleTextFontWeight,
fontFamily: titleFontFamily,
fontSize: titleFontSize),
),
Text("My second text"),
]
)
backgroundColor: Color.fromRGBO(232, 232, 242, 1),
),
u can use PreferredSize to defined size
appBar:
PreferredSize(
preferredSize: Size(double.infinity, 114),
child: AppBar(
centerTitle: false,
title: Column(
children: <Widget>[
Text(
'My App',
style: TextStyle(
color: titleTextColor,
fontWeight: titleTextFontWeight,
fontFamily: titleFontFamily,
fontSize: titleFontSize),
),
Text("My second text"),
]
)
backgroundColor: Color.fromRGBO(232, 232, 242, 1),
),
),