Search code examples
flutterandroid-appbarlayoutflutter-appbar

How to make some icons at Appbar with different alignment?


I faced some problem. I want make an image, a text and two icons in AppBar but I can't make it work as I want.

I tried to make some fonts in a row after the images and text. The images and the text successful show in my AppBar, but the rest of 2 fonts (Trolley and notifications) show some error.

Widget build(BuildContext context) {
    return new Scaffold(
      backgroundColor: Colors.amber,  
      appBar: new AppBar
        (
        title: new Row
          (
          mainAxisAlignment: MainAxisAlignment.start,
            children:
            [
              Image.asset('images/logoapp.png',fit: BoxFit.contain,height: 32,), 
              Container(padding: const EdgeInsets.all(8.0), child: Text('Solid Shop'))
            ],
          )

        ),

....


Solution

  • Use leading to set a widget before appBar title & 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 Icon as well, it accepts any widget.
        title: Text ("Your Title"),
        actions: [
            Icon(Icons.add),
            Icon(Icons.add),
        ],
    );
    

    Read more about it here