📷 reusable_image_widget
A powerful, flexible, and platform-aware Flutter image handling package that supports displaying avatars, full-screen image viewing, file/network/asset loading, and gallery saving with minimal setup.
✨ Features
- ✔ Load images from
XFile, network URLs, or asset paths - ✔ Auto-detect platform and image source
- ✔ Full-screen image viewer with zoom, rotation, and hero animation
- ✔ Circular or rectangular avatar widgets
- ✔ Avatar with online indicator and edit support
- ✔ Customizable placeholder and error widgets
- ✔ Platform-aware image downloading (web, mobile, desktop)
- ✔ Lightweight and easily composable
📂 Installation
Add this to your pubspec.yaml:
dependencies:
reusable_image_widget: ^latest_version
🌍 Cross-Platform Image Support
Internally detects platform and source:
XFile(picked files)- Network URL
- Asset path (starts with
assets/)
Uses:
FileImage/Image.fileNetworkImage/CachedNetworkImageAssetImageMemoryImage(for web)
🚀 Usage
1. Basic Viewer
AppImageViewer(
imageSource: 'assets/images/profile_pic.jpeg',
)
2. From Picked File
AppImageViewer(
pickedFile: pickedFile, // XFile
)
3. Edit Profile Image Viewer
EditProfileImageViewer(
pickedFile: pickedFile,
imageSource: pickedFile?.path,
radius: 60,
showEditIcon: true,
onTapEdit: () => pickImage(),
)
4. Avatar With Online Indicator
AvatarWithOnlineIndicator(
imageSource: 'https://example.com/image.jpg',
isOnline: true,
border: true,
shadow: true,
imgRadius: 50,
)
5. AppAvatar (Circle or Rectangle)
AppAvatar(
isCircle: true,
imageSource: 'https://example.com/image.jpg',
radius: 48,
)
🎨 Avatar Widgets
AppAvatar— root avatar builder (circle or rectangle)AppCircleAvatarAppRectangleAvatarEditProfileImageViewer— avatar with edit icon & full-screen supportAvatarWithOnlineIndicator— avatar with status badge
🔄 Image Download (All Platforms)
final result = await downloadImage(
pickedFile: pickedFile,
imageSource: 'https://example.com/image.jpg',
);
Web Support
Web download is handled using AnchorElement and Uint8List blob download.
🎨 Customization
Each widget accepts:
placeholdererrorWidgetscale,fit,backgroundColor, etc.
🍂 Constants & Styling
AvatarStyleConstants.defaultRadius
AvatarStyleConstants.avatarPadding
🎓 Extensions
'image.jpg'.isAssetPath // true if starts with 'assets/'
👁 Hero Support
HeroWrapper(
tag: 'profile_pic',
child: AppImageViewer(...),
)
⚧ Dependencies
dependency_overrides:
cached_network_image: <latest_version>
photo_view: <latest_version>
image_gallery_saver_plus: <latest_version>
permission_handler: <latest_version>
📖 Example
AvatarTitleGridCard(
title: 'Your Logo',
imageSource: 'assets/icons/logo.jpg',
isCircleAvatar: true,
)
🔊 Note: Previously named
ImageWithTitle, now moved toreusable_list_itempackage.
📄 License
MIT © 2025 reusable_image_widget authors
🚀 Contributing
Pull requests and issues are welcome!
🔗 Links
👨💼 Author
reusable_image_widget Developed with ❤️ by Shohidul Islam Contributions, issues, and pull requests are welcome!
Libraries
- constants/avatar_style_constants
- constants/default_image_path
- constants/image_style_constant
- extensions/image_source_type_checker
- reusable_image_widget
- utils/image_downloader/i_image_downloader/i_image_downloader
- utils/image_downloader/image_downloader_impl
- utils/image_provider/app_image_provider
- utils/image_provider/app_image_resolver
- views/widgets/avatar_viewer/app_avatar
- views/widgets/avatar_viewer/avatar_with_online_indicator
- views/widgets/avatar_viewer/image_with_title
- views/widgets/build_avatar_image
- views/widgets/cached_image
- views/widgets/full_screen_viewer/full_screen_image_viewer
- views/widgets/full_screen_viewer/full_screen_viewer_app_bar
- views/widgets/full_screen_viewer/hero_wrapper
- views/widgets/full_screen_viewer/photo_view_image
- views/widgets/image_viewer/app_avatar_image
- views/widgets/image_viewer/app_circle_avatar
- views/widgets/image_viewer/app_image_loader
- views/widgets/image_viewer/app_image_viewer
- views/widgets/image_viewer/app_rectangle_avatar
- views/widgets/profile/edit_profile_icon
- views/widgets/profile/edit_profile_image_viewer