my_icon_package 1.1.6
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'),
];