UX Lesson One, Logos

Could you create how this logo is situated?

So let me show you this trick to align your logo with your App name on the baseline.

The Implementation

Obviously, if you put the logo image in a row with the App Title as a text, the two items will not align with the baseline of the text. Now, so let’s ask; which widget allows us to align dissimilar items?

It’s a combination of three widgets; RichText, TextSpan, and WidgetSpan:

So how does this work? That WidgetSpan will act as a leaf node and inline it in an inlinespan which results in it aligning with the baseline of any included TextSpans per the flutter docs: