Icon Widget and Attributes

The Icon widget in Flutter is used to display icons in your application. It can represent material icons, custom icons, or even icons from different font packages. Let's explore the key attributes and properties of the Icon widget.

Key Attributes and Properties:

1. icon:

   • The icon attribute is crucial for specifying the icon to be displayed. It takes an IconData object, which can represent a built-in material icon or a custom icon.

Example:

    Icon(
      Icons.favorite,
      color: Colors.red,
      size: 30,
    )

1. color:

   • The color property sets the color of the icon.

Example:

    Icon(
      Icons.star,
      color: Colors.yellow,
    )

1. size:

   • The size property determines the size of the icon.

Example:

    Icon(
      Icons.mail,
      size: 40,
    )

Example:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Icon Widget Example'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(
                'Flutter Icon Widget Example',
                style: TextStyle(fontSize: 18),
              ),
              SizedBox(height: 20),
              Icon(
                Icons.favorite,
                color: Colors.red,
                size: 30,
              ),
              SizedBox(height: 20),
              Icon(
                Icons.star,
                color: Colors.yellow,
                size: 40,
              ),
              SizedBox(height: 20),
              Icon(
                Icons.mail,
                size: 50,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Explanation:

• The example demonstrates the usage of the Icon widget with different attributes.

• Three instances of the Icon widget are used to display different icons: heart, star, and mail.

• The color and size properties are customized to showcase the versatility of the Icon widget.