When to use In App Gallery
In App Gallery is a Flutter package that brings a polished, ready‑to‑use media picker to any mobile application. It abstracts the native gallery APIs on Android and iOS, presenting a unified, theme‑aware UI that can be tailored to match your app’s branding. Beyond simple selection, the package offers optional compression for both images and videos, helping you keep upload payloads small without sacrificing visual quality. The widget works entirely on the client side, so you retain full control over how selected assets are stored, uploaded, or processed further.
When building a social feed, chat interface, or any feature that requires user‑generated media, In App Gallery eliminates the boilerplate of handling permissions, file paths, and platform‑specific quirks. Its API is deliberately minimal: you invoke a single `showGallery` method, receive a list of `XFile` objects, and optionally configure compression quality, maximum dimensions, or allowed media types. Because the package returns standard `XFile` instances, it integrates seamlessly with popular state‑management solutions, networking libraries, and cloud storage SDKs.
From an architectural standpoint, In App Gallery fits cleanly into a layered Flutter app. The UI layer calls the picker, the domain layer validates the returned files (size, type, etc.), and the data layer decides whether to upload them to Firebase Storage, a REST endpoint, or keep them locally. Since the package does not impose any backend, you can pair it with any server‑side solution. Its dependency list is lightweight, avoiding heavy native SDKs, which keeps your app’s binary size modest. The widget also respects the current `ThemeData`, allowing dark mode support out of the box.
Setting up the package is straightforward. After adding the dependency, you must declare the required permissions in the Android `AndroidManifest.xml` and iOS `Info.plist`. The package handles runtime permission requests automatically, but you should test edge cases such as denied permissions or limited storage. For production builds, consider enabling the optional compression only when you need to reduce bandwidth, and benchmark the trade‑off between quality and CPU usage on target devices. The documentation includes guidance on handling large video files, including progress callbacks and cancellation support.
For beginners, a typical use case looks like a single button that opens the gallery, lets the user pick up to five photos, compresses them to 80 % quality, and then displays thumbnails in a `GridView`. More advanced scenarios might involve multi‑step workflows: pick a video, trim it using a separate plugin, compress, then upload with a background isolate. Because the API is promise‑based (`Future<List<XFile>>`), it works naturally with `async/await`, making error handling and UI state updates simple and predictable. Whether you are prototyping a hobby project or shipping a production‑grade marketplace app, In App Gallery provides a reliable, customizable foundation for media selection.
Pros
- single API for images and videos
- built‑in compression options
- theme‑aware UI
- supports multiple selection
- lightweight dependency list
Watch outs
- no web or desktop support
- requires manual permission handling on older Android versions
- compression may increase CPU usage on low‑end devices
Setup notes
Add the dependency with: ``` flutter pub add in_app_gallery ``` Then update platform-specific files: - Android: add `READ_EXTERNAL_STORAGE` and `WRITE_EXTERNAL_STORAGE` permissions to `android/app/src/main/AndroidManifest.xml`. - iOS: add `NSPhotoLibraryUsageDescription` (and optionally `NSCameraUsageDescription`) to `Info.plist`. Run `flutter pub get` and rebuild the app.
Supports Android API 21+ and iOS 11+. Requires Flutter 2.5 or newer. The package does not currently support web or desktop platforms; attempts to use it on unsupported platforms will throw a `UnsupportedError`.
```dart
import 'package:flutter/material.dart';
import 'package:in_app_gallery/in_app_gallery.dart';
class MediaPickerDemo extends StatefulWidget {
const MediaPickerDemo({Key? key}) : super(key: key);
@override
State<MediaPickerDemo> createState() => _MediaPickerDemoState();
}
class _MediaPickerDemoState extends State<MediaPickerDemo> {
List<XFile> _files = [];
Future<void> _pickMedia() async {
try {
final result = await InAppGallery.showGallery(
allowMultiple: true,
maxSelection: 5,
compressQuality: 80, // compress images to 80%
allowedTypes: [MediaType.image, MediaType.video],
);
setState(() => _files = result);
} catch (e) {
// Handle permission denial or other errors
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Failed to pick media: $e')),
);
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('In App Gallery Demo')),
body: Column(
children: [
ElevatedButton(onPressed: _pickMedia, child: const Text('Pick Media')),
Expanded(
child: GridView.builder(
padding: const EdgeInsets.all(8),
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
crossAxisSpacing: 4,
mainAxisSpacing: 4,
),
itemCount: _files.length,
itemBuilder: (context, index) {
final file = _files[index];
return Image.file(File(file.path), fit: BoxFit.cover);
},
),
),
],
),
);
}
}
```