Search code examples
flutterdartappbar

AppBar title with image flutter


I have the attached AppBar and I want to add an image next to the title, not in action Icon, only image, how can I handle this?

appBar: AppBar(
            title: Text('Title'),
            actions: <Widget>[
              new IconButton(
                icon: new Icon(Icons.refresh),
                onPressed: () {
                  setState(
                    () {
                      widget.athkarCategory.reset();
                    },
                  );
                },
              ),
            ],
          ),

enter image description here


Solution

  • The title property of the AppBar accepts a Widget, which means any combination of them.

    So for instance, if you want an image next to the title you can simply wrap it in a Row widget and then add the Image next to the Text which will contain your title.

    Here a code example of what you are trying to accomplish: https://dartpad.dev/b6409e10de32b280b8938aa75364fa7b

    The relevant code parts are this:

          appBar: AppBar(
            title: Row(
              children: <Widget>[
                Text(widget.title),
                Image.network("https://i.ytimg.com/vi/Uk1RPEQI8mI/maxresdefault.jpg", width: 50, height:50)
              ],
            ),
          ),