Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to replace title with image in AppBar

Tags:

flutter

dart

How can I replace the AppBar title with image logo in Flutter?

like image 547
Nusendra Hanggarawan Avatar asked Apr 23 '18 14:04

Nusendra Hanggarawan


People also ask

How do you insert an image in AppBar title flutter?

To add the background image to AppBar widget, we can use the flexibleSpace option of the widget. The flexibleSpace property of AppBar accepts a widget as its value, so we can pass a Container widget as its value and set an image background to the Container.

How do I add an image to AppBar?

Use leading to set a widget before appBar title and use actions to specify list of widgets in appBar which appears on right side of appBar title. AppBar( leading: Image. asset('yourImage'), // you can put any Widget title: Text ("Title"), actions: [ Icon(Icons. shopping_cart), Icon(Icons.

How can I change the color of my AppBar title?

Step 2: Inside the AppBar widget, find the Text widget inside the title parameter. Step 3: Inside the Text widget, add the style parameter and add the TextStyle widget. Step 4: Inside the TextStyle widget, add the color parameter and assign the appropriate color. Step 5: Run the app.


2 Answers

The title property takes a Widget, so you can pass any widget to it.

For example, an image added to assets

Scaffold(   appBar: AppBar(     title: Image.asset('assets/title.png', fit: BoxFit.cover),   ),   body: ... ) 

More info

like image 141
Günter Zöchbauer Avatar answered Sep 23 '22 05:09

Günter Zöchbauer


  appBar: AppBar(           title: Row(               mainAxisAlignment: MainAxisAlignment.center,               children: [                   Image.asset(                  'assets/logo.png',                   fit: BoxFit.contain,                   height: 32,               ),               Container(                   padding: const EdgeInsets.all(8.0), child: Text('YourAppTitle'))             ],            ),   ) 
like image 36
Sérgio Oliveira Avatar answered Sep 22 '22 05:09

Sérgio Oliveira