Flutter icon 3 dots

Flutter Icon – Three Dots

The three dots icon is commonly used to represent a menu or a list of options in mobile applications. In Flutter, you can use the Icons.more_vert property from the Icons class to display the three dots icon.

Example

Here’s an example of how to use the three dots icon in Flutter:

    
    import 'package:flutter/material.dart';

    void main() {
      runApp(MyApp());
    }

    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Flutter Three Dots Icon',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: Scaffold(
            appBar: AppBar(
              title: Text('Three Dots Icon Example'),
              actions: [
                IconButton(
                  icon: Icon(Icons.more_vert),
                  onPressed: () {
                    // Add your menu or options logic here
                  },
                ),
              ],
            ),
            body: Center(
              child: Text(
                'Hello World!',
                style: TextStyle(fontSize: 24),
              ),
            ),
          ),
        );
      }
    }
    
    

In the above example, we have added an IconButton in the actions parameter of the AppBar. The IconButton displays the three dots icon using Icons.more_vert. You can add your menu or options logic inside the onPressed callback.

Leave a comment