This is a multi-picker package that includes several different modes, making it easy to use.
- Easy integration.
- Customizable components.
- Performance optimized.
- Extensive documentation.
- Picker Ui Instagram.
- This is a multi-picker.
import 'package:flutter_better_pickers/flutter_better_pickers.dart';
dependencies:
flutter_better_pickers: ^0.0.1
List<AssetEntity> selectedAssetList = [];
ElevatedButton(
onPressed: () {
var picker = const FlutterBetterPickers(
maxCount: 5,
requestType: MyRequestType.image,
).instagram(context);
picker.then((value) {
selectedAssetList = value;
convertToFileList();
});
},
child: const Text("Instgram picker"),
),
- OR
onPressed: () {
const FlutterBetterPickers(maxCount: 10, requestType: MyRequestType.image)
.instagram(context)
.then((onValue) {
setState(() {
selectedAssetList = onValue;
convertToFileList();
});
});
},

ElevatedButton(
onPressed: () {
var picker = const CustomPicker(
maxCount: 5,
requestType: MyRequestType.image,
).getPicAssets(context);
picker.then((value) {
selectedAssetList = value;
convertToFileList();
});
})


ElevatedButton(
onPressed: () {
var picker = FlutterBetterPickers.bottomSheets(
context: context,
maxCount: 5,
requestType: MyRequestType.image,
);
picker.then(
(value) {
setState(() {
selectedAssetList = value;
convertToFileList(); // تبدیل AssetEntity به فایلها
});
},
);
},
child: const Text("BottomSheet"),
),


- Step 1: Create a GlobalKey Start by creating a GlobalKey to manage the state of the TelegramMediaPickers widget.
final GlobalKey<TelegramMediaPickersState> _sheetKey = GlobalKey();
- Step 2: Create a Button to Open the Picker Next, create a button that will open the media picker when pressed.
ElevatedButton(
onPressed: () {
// Open the TelegramMediaPickers
_sheetKey.currentState?.toggleSheet(context);
},
child: const Text("Open Telegram Pickers"),
),
- Step 3: Implement the TelegramMediaPickers Widget Add the TelegramMediaPickers widget to your widget tree. It's important to set the requestType to a general value (like MyRequestType.all) to ensure that all types of media (images, videos, files) are displayed. Avoid changing this to a more specific type if you want the user to have access to all media options.
TelegramMediaPickers(
key: _sheetKey,
requestType: MyRequestType.all, // Set to 'all' to display images, videos, and files
maxCountPickMedia: 5, // Maximum number of media that can be selected
primeryColor: Colors.green, // Primary color for the UI
isRealCameraView: false, // Set to true to use the real camera view
onMediaPicked: (assets, files) {
if (files != null) {
for (var file in files) {
debugPrint(file.path); // Print the path of selected files
}
} else if (assets != null) {
for (var asset in assets) {
debugPrint("Asset: ${asset.file}"); // Print the asset details
}
}
},
),
- Complete Example Here's a complete example of how to implement the TelegramMediaPickers in your Flutter app. This example shows how to select media files, convert them to a list of File, and prepare them for database storage.
import 'package:flutter/material.dart';
import 'package:telegram_media_pickers/telegram_media_pickers.dart';
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final GlobalKey<TelegramMediaPickersState> _sheetKey = GlobalKey();
List<File>? imageFiles = [];
List<AssetEntity> selectedAssetList = [];
void convertToFileList() async {
List<File>? files = [];
for (var asset in selectedAssetList) {
final file = await asset.file; // Convert AssetEntity to File
if (file != null) {
files.add(file);
}
}
setState(() {
imageFiles = files; // Update the state with the list of files
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Center(
child: ElevatedButton(
onPressed: () {
// Open and close TelegramMediaPickers
_sheetKey.currentState?.toggleSheet(context);
setState(() {});
},
child: const Text("Telegram Pickers"),
),
),
// TelegramMediaPickers widget
TelegramMediaPickers(
key: _sheetKey,
requestType: MyRequestType.all, // Set to 'all' to display all media types
maxCountPickMedia: 5,
maxCountPickFiles: 5,
primeryColor: Colors.green,
isRealCameraView: false,
onMediaPicked: (assets, files) {
// Update the selectedAssetList
if (assets != null) {
selectedAssetList = assets;
convertToFileList(); // Convert selected assets to files
}
if (files != null) {
for (var file in files) {
debugPrint(file.path); // Print the path of selected files
}
}
},
)
],
),
);
}
}

elevatedButton(
onPressed: () async {
await FlutterBetterPickers.scaffoldBottomSheet(
context: context,
maxCount: 5,
requestType: MyRequestType.image,
confirmText: "Confirm",
textEmptyList: "No album found",
confirmButtonColor: Colors.blue,
confirmTextColor: Colors.white,
backgroundColor: Colors.white,
textEmptyListColor: Colors.grey,
backgroundSnackBarColor: Colors.red,
).then((value) {
selectedAssetList = value;
convertToFileList();
});
},
child: const Text("scaffoldBottomSheet"),
),
elevatedButton(
onPressed: () async {
await FlutterBetterPickers.bottomSheetImageSelector(
cameraImageSettings: CameraImageSettings(),
context: context,
maxCount: 5,
requestType: MyRequestType.image,
confirmText: "Confirm",
textEmptyList: "No album found",
confirmButtonColor: Colors.blue,
confirmTextColor: Colors.black,
backgroundColor: Colors.white,
textEmptyListColor: Colors.grey,
backgroundSnackBarColor: Colors.red,
).then((value) {
selectedAssetList = value;
convertToFileList();
});
},
child: const Text("bottomSheetImageSelector"),
),
If you have any issues, questions, or suggestions related to this package, please feel free to contact us at swan.dev1993@gmail.com. We welcome your feedback and will do our best to address any problems or provide assistance. For more information about this package, you can also visit our GitHub repository where you can find additional resources, contribute to the package's development, and file issues or bug reports. We appreciate your contributions and feedback, and we aim to make this package as useful as possible for our users. Thank you for using our package, and we look forward to hearing from you!