Here is your full README.md file for your Flutter Image Upload Widget, including setup, permissions, usage, customization, and platform-specific instructions:


πŸ“„ README.md

# πŸ“Έ Flutter Image Upload Widget

A reusable, beautiful, and customizable Flutter widget to upload images using the device **camera** or **gallery**, with support for **edit, delete**, and **upload** actions.

> βœ… No third-party dependencies except `image_picker`.

---

## ✨ Features

- πŸ“· Pick images from **camera** or **gallery**
- πŸ–ΌοΈ Display image preview (supports multiple)
- πŸ—‘οΈ **Delete** or ✏️ **Edit** (replace) images
- πŸ”˜ Upload action with callback
- 🎨 Fully customizable UI (labels, colors, size)
- 🚫 No external compression/storage dependencies

---

## πŸ“¦ Installation

### 1. Add dependencies

In your `pubspec.yaml`:

```yaml
dependencies:
  flutter:
    sdk: flutter
  image_upload: ^latest_version

Then run:

flutter pub get

2. Android Setup

βž• AndroidManifest.xml

Path: android/app/src/main/AndroidManifest.xml

Add permissions outside <application>:

<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.READ_MEDIA_IMAGES"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" android:maxSdkVersion="28"/>

Add this inside <application>:

<provider
    android:name="androidx.core.content.FileProvider"
    android:authorities="${applicationId}.fileprovider"
    android:exported="false"
    android:grantUriPermissions="true">
    <meta-data
        android:name="android.support.FILE_PROVIDER_PATHS"
        android:resource="@xml/provider_paths"/>
</provider>

βž• Create file: android/app/src/main/res/xml/provider_paths.xml

<?xml version="1.0" encoding="utf-8"?>
<paths xmlns:android="http://schemas.android.com/apk/res/android">
    <external-path name="external_files" path="." />
</paths>

3. iOS Setup

βž• ios/Runner/Info.plist

Add the following entries inside <dict>:

<key>NSCameraUsageDescription</key>
<string>This app needs access to the camera to take photos.</string>

<key>NSPhotoLibraryUsageDescription</key>
<string>This app needs access to the photo library to select images.</string>

<key>NSMicrophoneUsageDescription</key>
<string>This app needs access to the microphone for video recording.</string>

πŸš€ Usage

Import the widget:

import 'image_upload_widget.dart';

Use in your UI:

ImageUploadWidget(
  allowMultiple: true,
  onImagesSelected: (List<File> images) {
    // Called after image(s) selected
    debugPrint("Selected images: ${images.map((e) => e.path)}");
  },
  onUploadTap: (List<String> paths) {
    // Called when upload button is pressed
    debugPrint("Ready to upload: $paths");
  },
);

πŸŽ›οΈ Customization

Parameter Type Default Description
allowMultiple bool false Allow picking multiple images
title String "Upload Image" Title displayed on top
cameraText String "Camera" Camera button label
galleryText String "Gallery" Gallery button label
uploadButtonText String "Upload" Upload button label
onImagesSelected Function(List<File>) required Triggered after image(s) selected
onUploadTap Function(List<String>) required Triggered when upload is tapped

πŸ“‚ Directory Structure

lib/
 ┣ widgets/
 ┃ β”— image_upload_widget.dart
 β”— main.dart

πŸ“Έ Screenshots

Empty State With Images
Empty With

πŸ›‘ Permissions

Use permission_handler (optional) if you want to ask permissions manually on runtime:

// Optional: Check and request permissions
await Permission.camera.request();
await Permission.photos.request();

πŸ“ƒ License

This widget is licensed under the MIT License β€” free for personal & commercial use.


πŸ’¬ Contributions

Found a bug or want to add a feature? Feel free to contact with me.

Happy Coding πŸ’™


---
## πŸ‘¨β€πŸ’» Author

**Md. Rahul Reza**

* Website: [rahulreza.com](https://www.rahulreza.com)
* Contact: contact@rahulreza.com


Libraries

image_upload