All Projects → weta-vn → advance_image_picker

weta-vn / advance_image_picker

Licence: BSD-3-Clause license
Flutter plugin for selecting multiple images from the Android and iOS image library, taking new pictures with the camera, and edit them before using such as rotating, cropping, adding sticker/filters.

Programming Languages

dart
5743 projects

Projects that are alternatives of or similar to advance image picker

nil
A simple Flutter widget to add in the widget tree when you want to show nothing, with minimal impact on performance.
Stars: ✭ 130 (+42.86%)
Mutual labels:  flutter-package
flutter easyloading
✨A clean and lightweight loading/toast widget for Flutter, easy to use without context, support iOS、Android and Web
Stars: ✭ 1,021 (+1021.98%)
Mutual labels:  flutter-package
bloc
A predictable state management library that helps implement the BLoC design pattern
Stars: ✭ 12 (-86.81%)
Mutual labels:  flutter-package
Flutter-Custom-Carousel
Flutter Custom Carousel Application Design and Animation - day 18
Stars: ✭ 44 (-51.65%)
Mutual labels:  flutter-package
glass kit
💎 A package containing widgets to implement glass morphism in flutter apps
Stars: ✭ 50 (-45.05%)
Mutual labels:  flutter-package
barcode.flutter
barcode generate library for Flutter
Stars: ✭ 58 (-36.26%)
Mutual labels:  flutter-package
flutter event calendar
Gregorian and Jalali Event calendar for flutter with options for change style
Stars: ✭ 28 (-69.23%)
Mutual labels:  flutter-package
flutter syntax view
Flutter Syntax Highlighter
Stars: ✭ 88 (-3.3%)
Mutual labels:  flutter-package
Daguerre
Local image and video selector for Android
Stars: ✭ 33 (-63.74%)
Mutual labels:  image-picker
stop watch timer
This is Stop Watch Timer for flutter plugin.🏃‍♂️
Stars: ✭ 76 (-16.48%)
Mutual labels:  flutter-package
very good infinite list
A Very Good Infinite List Widget created by Very Good Ventures. Great for activity feeds, news feeds, and more. 🦄
Stars: ✭ 109 (+19.78%)
Mutual labels:  flutter-package
alphabet scroll view
A Scrollable ListView Widget with the dynamic vertical Alphabet List on the Side which you can drag and tap to scroll to the first item starting with that letter in the list.
Stars: ✭ 21 (-76.92%)
Mutual labels:  flutter-package
flutter paging
A small library support load infinite for ListView - GridView on Flutter.
Stars: ✭ 32 (-64.84%)
Mutual labels:  flutter-package
flutter device type
Determine the type of handheld device on Flutter. Like if the device is a Tablet or is iPhoneX.
Stars: ✭ 26 (-71.43%)
Mutual labels:  flutter-package
getwidget-docs
Get Widgets UI library docs.
Stars: ✭ 17 (-81.32%)
Mutual labels:  flutter-package
bottom animation
Bottom Navigation Mixed Animation
Stars: ✭ 32 (-64.84%)
Mutual labels:  flutter-package
dgraph
Dgraph Dart client which communicates with the server using gRPC.
Stars: ✭ 27 (-70.33%)
Mutual labels:  flutter-package
flutter-app
Full Feature Todos Flutter Mobile app with fireStore integration.
Stars: ✭ 138 (+51.65%)
Mutual labels:  flutter-package
flutter auth buttons
Auth Buttons is a flutter widget library, include buttons for authenticating with the most popular social networks.
Stars: ✭ 23 (-74.73%)
Mutual labels:  flutter-package
syntax highlighter
Syntax Highlighter for Dart/Flutter Code
Stars: ✭ 28 (-69.23%)
Mutual labels:  flutter-package

advance_image_picker

Flutter plugin for selecting multiple images from the Android and iOS image library, taking new pictures with the camera, and edit them before using such as rotating, cropping, adding sticker/filters.

This is an advanced version of image_picker plugin.

Key Features

  • Display live camera preview in a widget
  • Adjust exposure
  • Zoom camera preview
  • Capture photo without saving into device library
  • Capture with preview size mode & full screen size mode
  • Select photos from device library by browsing photo albums
  • Preview selected images
  • Support button label & text translation
  • Easy image editing features, such as rotation, cropping, adding sticker/filters
  • Allow user add external image editors for editing selected images.
  • Support for displaying object detection & OCR result on selected image view
  • Allow setting user's own stickers

Apps using this package

1. freemar.vn - Shopping app for Vietnamese

Google Play App Store

2. trainghiem.vn - Find places to have fun, find places to experience!

Google Play App Store

3. Henoo - Heritage in your pocket (Le patrimoine dans la poche)

Google Play App Store

Demo & Screenshots


Youtube Demo Link

Installation

Dart

This plugin requires dart version 2.16.1 or later

iOS

Add these settings to the ios/Runner/Info.plist

<key>NSCameraUsageDescription</key>
<string>Can I use the camera please?</string>
<key>NSMicrophoneUsageDescription</key>
<string>Can I use the mic please?</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>App need your agree, can visit your album</string>

Modify TOCropViewController version in snapshot (ios/Podfile.lock) to 2.6.1

TOCropViewController (2.6.1)

Android

Change the minimum Android sdk version to 21 (or higher), and compile sdk to 31 (or higher) in your android/app/build.gradle file (refer example project).

compileSdkVersion 31
minSdkVersion 21

Change kotlin version to 1.5.21 or later in your android/build.gradle file (refer example project).

ext.kotlin_version = '1.5.21'

Add activity and uses-permissions to your AndroidManifest.xml, just like next.

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="vn.weta.freemarimagepickerexample">

    <application
        android:name="io.flutter.app.FlutterApplication"
        android:label="freemarimagepicker_example"
        android:requestLegacyExternalStorage="true"
        android:icon="@mipmap/ic_launcher">
        <activity
            android:name="com.yalantis.ucrop.UCropActivity"
            android:screenOrientation="portrait"
            android:theme="@style/Theme.AppCompat.Light.NoActionBar"/>
    </application>
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.CAMERA" />
</manifest>

Usages

Add to pubspec

dependencies:
  advance_image_picker: $latest_version

Import dart code

import 'package:advance_image_picker/advance_image_picker.dart';

Setting configs & text translate function

// Setup image picker configs (global settings for app)
var configs = ImagePickerConfigs();
configs.appBarTextColor = Colors.black;
configs.stickerFeatureEnabled = false; // ON/OFF features
configs.translateFunc = (name, value) => Intl.message(value, name: name); // Use intl function

// Add plugin's string inside lib/l10n/intl_**.arb of your project to use translation
// For example about english messages, declared inside intl_en.arb
{
  "app_title": "FreeMar - Share your things",
  "image_picker_exit_without_selecting": "Do you want to exit without selecting images?",
  "image_picker_select_images_title": "Selected images count",
  "image_picker_select_images_guide": "You can drag images for sorting list...",
  "image_picker_camera_title": "Camera",
  "image_picker_album_title": "Album",
  "image_picker_preview_title": "Preview",
  "image_picker_confirm_delete": "Do you want to delete this image?",
  "image_picker_confirm_reset_changes": "Do you want to clear all changes for this image?",
  "image_picker_no_images": "No images...",
  "image_picker_image_crop_title": "Image crop",
  "image_picker_image_filter_title": "Image filter",
  "image_picker_image_edit_title": "Image edit",
  "image_picker_select_button_title": "Select",
  "image_picker_image_sticker_title": "Image sticker",
  "image_picker_image_addtext_title": "Image add text",
  "image_picker_image_sticker_guide": "You can click on below icons to add into image, double click to remove it from image",
  "image_picker_edit_text": "Edit text",
  "suitcase": "Suitcase",
  "handbag": "Handbag",
  "bottle": "Bottle",
  "tie": "Tie",
  ...
}

// Or you can simply write your own translate function like this
// configs.translateFunc = (name, value) => Intl.message(value, name: name);
   configs.translateFunc = (name, value) {
     switch (name) {
       case 'image_picker_select_images_title':
         return 'Le immagini selezionate contano';
       case 'image_picker_select_images_guide':
         return 'È possibile trascinare le immagini per lelenco di ordinamento...';
       case 'image_picker_camera_title':
         return 'Telecamera';
       case 'image_picker_album_title':
         return 'Album';
       // ... Declare all your strings here
       default:
         return value;
     }
   }

Sample for adding external image editors.
(You can replace ImageEdit widget by your owned image editor widget, that output file after editing finised)

configs.externalImageEditors['external_image_editor_1'] = EditorParams(
      title: 'external_image_editor_1',
      icon: Icons.edit_rounded,
      onEditorEvent: (
              {required BuildContext context,
              required File file,
              required String title,
              int maxWidth = 1080,
              int maxHeight = 1920,
              int compressQuality = 90,
              ImagePickerConfigs? configs}) async => await Navigator.of(context).push(MaterialPageRoute<File>(
              fullscreenDialog: true,
              builder: (context) => ImageEdit(file: file, title: title, maxWidth: maxWidth, maxHeight: maxHeight, configs: configs)))
  );

Sample for usage

// Get max 5 images
List<ImageObject> objects =
    await Navigator.of(context).push(
        PageRouteBuilder(pageBuilder:
            (context, animation, __) {
  return ImagePicker(maxCount: 5);
}));

if (objects.length > 0) {
  setState(() {
    imageFiles.addAll(objects
        .map((e) => e.modifiedPath)
        .toList());
  });
}

Credits

This software uses the following open source packages:

  • camera
  • photo_manager
  • photo_view
  • image
  • image_cropper
  • image_editor
  • flutter_native_image
  • path_provider

Support

If this plugin was useful to you, helped you to deliver your app, saved you a lot of time, or you just want to support the project, I would be very grateful if you buy me a cup of coffee.

Buy Me A Coffee

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].