Flutter: how to add icon to text?

Here are two approaches, depending on exactly what you want.

RichText with WidgetSpan

Using RichText you can mix TextSpans with WidgetSpans. WidgetSpan allows you to place any Flutter widget inline with the text. For example:

RichText(
  text: TextSpan(
    style: Theme.of(context).textTheme.body1,
    children: [
      TextSpan(text: 'Created with '),
      WidgetSpan(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 2.0),
          child: Icon(Icons.airport_shuttle),
        ),
      ),
      TextSpan(text: 'By Michael'),
    ],
  ),
)

Will give the following:

(Note: MaterialIcons did not include a heart when I answered, but does now with Icons.favorite)

This is a good general purpose solution, but for your specific example there's something simpler...

Emoji

Flutter's text supports Emoji out of the box. So you can do this:

Center(
  child: Text(
    'Created with ❤ ️by Michael',
    maxLines: 1,
  ),
),

And you get this:

You can also use Unicode escapes in the string and get the same result:

'Created with \u2764️ by Michael'

Note that not all fonts have support for the full set of Emoji, so make sure you test on a variety of devices or use a specific font (see other answer below).

Regarding Emojis, in android not all emojis are supported (depending on OS version).

For full emoji compatibility you can use the google free font Noto Color Emoji at https://www.google.com/get/noto/#emoji-zsye-color

• Add it to the fonts folder
• add in pubspec.yaml

    fonts:
    - family: NotoEmoji
      fonts:
        - asset: fonts/NotoColorEmoji.ttf
          weight: 400

• use with TextStyle

  Text("🤑", TextStyle(fontFamily: 'NotoEmoji'))