Instagram Mention Widgets

Instagram CustomPainter

'small details do matter' ❤️

This package provides simple and almost the same UI details that the real Instagram mention widget has.

It contains two types of widgets

  • InstagramMention - Only Text
  • InstagramMentionWithAvatar - Text and Image


You can simply use the widgets inside your app like this

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            // Text only
            InstagramMention(text: 'Lily Collins'),

            const  SizedBox(height: 75),

            // Text and Image
              text:  'Lily Collins',

Or, you can use the custom Painter class that I've provided RectangleWithNotchPainter so you can apply the painting style to any widget you like.


Instagram CustomPainter

Medium articles by the author

You can always read the articles I write on my devmuaz account which I write pretty great flutter content out there.

Contributions & Support

Issues and pull requests are always welcome 😄

If you find this package useful for you and liked it, give it a like ❤️ and star the repo ⭐️ it would mean a lot!