import 'package:flutter/material.dart';

void main() {
  runApp(const IconButtonApp());
}

class IconButtonApp extends StatelessWidget {
  const IconButtonApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        brightness: Brightness.dark,
        colorSchemeSeed: const Color(0xff3c602b),
        useMaterial3: true,
        materialTapTargetSize: MaterialTapTargetSize.padded
    ),
      home: const Scaffold(
        body: ButtonExample(),
      ),
    );
  }
}

class ButtonExample extends StatelessWidget {
  const ButtonExample({super.key});

  Widget filledIconButton(ColorScheme colors) =>
    IconButton(
      icon: const Icon(Icons.back_hand),
      onPressed: () {},
      style: IconButton.styleFrom(
        foregroundColor: colors.onPrimary,
        backgroundColor: colors.primary,
      ),
    );

  Widget outlinedIconButton(ColorScheme colors) =>
    IconButton(
      icon: const Icon(Icons.more_vert),
      onPressed: () {},
      style: IconButton.styleFrom(
        focusColor: colors.onSurfaceVariant.withOpacity(0.12),
        highlightColor: colors.onSurface.withOpacity(0.12),
        side: BorderSide(color: colors.outline),
      ).copyWith(
        foregroundColor: MaterialStateProperty.resolveWith((Set<MaterialState> states) {
          if (states.contains(MaterialState.pressed)) {
            return colors.onSurface;
          }
          return null;
        }),
      ),
    );

  Widget roundedRectangleButton(ColorScheme colors) =>
    IconButton(
      icon: const Icon(Icons.call_end),
      onPressed: () {},
      style: IconButton.styleFrom(
        foregroundColor: colors.error,
        backgroundColor: colors.errorContainer,
        visualDensity: const VisualDensity(horizontal: 2),
      ),
    );

  @override
  Widget build(BuildContext context) {
    final ColorScheme colors = Theme.of(context).colorScheme;

    return Center(
      child: IntrinsicHeight(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            filledIconButton(colors),
            outlinedIconButton(colors),
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 4),
              child: roundedRectangleButton(colors),
            ),
          ],
        ),
      ),
    );
  }
}