my_icon_package 1.1.6 copy "my_icon_package: ^1.1.6" to clipboard
my_icon_package: ^1.1.6 copied to clipboard

A comprehensive collection of 128 beautiful SVG icons for Flutter applications. Easy to use, customizable, and optimized for performance.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:my_icon_package/my_icon_package.dart';

void main() => runApp(const ExampleApp());

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'My Icon Package Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const IconGalleryScreen(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('My Icon Package Gallery'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        leading: const MyIcon(
            MyIcons.heartssymbolentertainmentgamingcardheartssymbol),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              'Icon Gallery (128 icons)',
              style: Theme.of(context).textTheme.headlineSmall,
            ),
            const SizedBox(height: 8),

            // Colored Icons Demo Section
            Container(
              padding: const EdgeInsets.all(12),
              decoration: BoxDecoration(
                color: Colors.blue.shade50,
                borderRadius: BorderRadius.circular(8),
                border: Border.all(color: Colors.blue.shade200),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '🎨 Colored Icons (Original SVG Colors)',
                    style: Theme.of(context).textTheme.titleMedium?.copyWith(
                          fontWeight: FontWeight.bold,
                        ),
                  ),
                  const SizedBox(height: 8),
                  Wrap(
                    spacing: 12,
                    runSpacing: 8,
                    children: [
                      ColoredIcon.heart(size: 32),
                      ColoredIcon.shrimp(size: 32),
                      ColoredIcon.batteryAlert(size: 32),
                      ColoredIcon.store(size: 32),
                      ColoredIcon.beach(size: 32),
                      ColoredIcon.ambulance(size: 32),
                    ],
                  ),
                  const SizedBox(height: 8),
                  Text(
                    'These icons preserve original SVG colors',
                    style: Theme.of(context).textTheme.bodySmall,
                  ),
                ],
              ),
            ),
            const SizedBox(height: 16),
            Expanded(
              child: GridView.builder(
                gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 6,
                  crossAxisSpacing: 8,
                  mainAxisSpacing: 8,
                  childAspectRatio: 1,
                ),
                itemCount: _sampleIcons.length,
                itemBuilder: (context, index) {
                  final iconItem = _sampleIcons[index];
                  return InkWell(
                    onTap: () => _showIconDetails(context, iconItem),
                    child: Container(
                      decoration: BoxDecoration(
                        border: Border.all(color: Colors.grey.shade300),
                        borderRadius: BorderRadius.circular(8),
                      ),
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          MyIcon(
                            iconItem.iconData,
                            size: 24,
                            color: Theme.of(context).primaryColor,
                          ),
                          const SizedBox(height: 4),
                          Text(
                            iconItem.name,
                            style: const TextStyle(fontSize: 8),
                            textAlign: TextAlign.center,
                            maxLines: 2,
                            overflow: TextOverflow.ellipsis,
                          ),
                        ],
                      ),
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        items: const [
          BottomNavigationBarItem(
            icon:
                MyIcon(MyIcons.heartssymbolentertainmentgamingcardheartssymbol),
            label: 'Heart',
          ),
          BottomNavigationBarItem(
            icon: MyIcon(MyIcons.shrimpseafoodshrimp),
            label: 'Food',
          ),
          BottomNavigationBarItem(
            icon: MyIcon(MyIcons
                .batteryalert1phonemobilechargedeviceelectricitypowerbatteryalertwarning),
            label: 'Battery',
          ),
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () => _showUsageDialog(context),
        child: const Icon(Icons.info),
      ),
    );
  }

  void _showIconDetails(BuildContext context, IconItem iconItem) {
    showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: Text(iconItem.name),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            MyIcon(
              iconItem.iconData,
              size: 64,
              color: Theme.of(context).primaryColor,
            ),
            const SizedBox(height: 16),
            SelectableText(
              'MyIcons.${iconItem.name}',
              style: const TextStyle(fontFamily: 'monospace'),
            ),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.of(context).pop(),
            child: const Text('Close'),
          ),
        ],
      ),
    );
  }

  void _showUsageDialog(BuildContext context) {
    showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: const Text('How to Use'),
        content: const SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisSize: MainAxisSize.min,
            children: [
              Text('1. Add dependency to pubspec.yaml:'),
              SizedBox(height: 8),
              SelectableText(
                'dependencies:\n  my_icon_package: ^1.0.0',
                style: TextStyle(fontFamily: 'monospace', fontSize: 12),
              ),
              SizedBox(height: 16),
              Text('2. Import the package:'),
              SizedBox(height: 8),
              SelectableText(
                "import 'package:my_icon_package/my_icon_package.dart';",
                style: TextStyle(fontFamily: 'monospace', fontSize: 12),
              ),
              SizedBox(height: 16),
              Text('3. Use the icons:'),
              SizedBox(height: 8),
              SelectableText(
                '''MyIcon(
  MyIcons.heartssymbolentertainmentgamingcardheartssymbol,
  size: 24.0,
  color: Colors.blue,
)''',
                style: TextStyle(fontFamily: 'monospace', fontSize: 12),
              ),
            ],
          ),
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.of(context).pop(),
            child: const Text('Got it!'),
          ),
        ],
      ),
    );
  }
}

class IconItem {
  final IconData iconData;
  final String name;

  const IconItem(this.iconData, this.name);
}

// Sample icons for demonstration (first 10 icons that we confirmed exist)
const List<IconItem> _sampleIcons = [
  IconItem(
      MyIcons
          .batteryalert1phonemobilechargedeviceelectricitypowerbatteryalertwarning,
      'battery_alert'),
  IconItem(MyIcons.shrimpseafoodshrimp, 'shrimp'),
  IconItem(
      MyIcons.heartssymbolentertainmentgamingcardheartssymbol, 'hearts_symbol'),
  IconItem(
      MyIcons
          .refrigeratorfridgecookappliancescookingnutritionfreezerappliancefoodkitchenware,
      'refrigerator'),
  IconItem(MyIcons.moustachefashionbeautymoustachegrooming, 'moustache'),
  IconItem(MyIcons.store1storeshopshopsstores, 'store'),
  IconItem(MyIcons.cameravideofilmtelevisiontvcameramoviesvideorecorder,
      'camera_video'),
];
0
likes
145
points
316
downloads

Publisher

unverified uploader

Weekly Downloads

A comprehensive collection of 128 beautiful SVG icons for Flutter applications. Easy to use, customizable, and optimized for performance.

Repository (GitHub)
View/report issues

Topics

#icons #ui #design #flutter-package

Documentation

API reference

License

MIT (license)

Dependencies

flutter, flutter_svg

More

Packages that depend on my_icon_package