Flutter image_picker choose video

flutter image picker
image picker flutter web
flutter image picker github
flutter video player
flutter image_picker androidx
flutter camera
multi image picker flutter
flutter image picker resize

I am successfully using the Flutter Plugin Image_picker to choose images so that I can use them for upload, display, etc... I wondered if anyone had any guidance on how to modify this plugin to also see videos and allow them to be chosen and use for upload, etc...

Looking for iOS and Android modifications if anyone has guidance on how to proceed or example code. I have made some progress but still need to get the camera to save video and be able to present. I will post the code changes so far. I have it selecting a video, but it will not present back to the app.

// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

@import UIKit;
#import <MobileCoreServices/MobileCoreServices.h>

#import "ImagePickerPlugin.h"

@interface ImagePickerPlugin ()<UINavigationControllerDelegate, UIImagePickerControllerDelegate>
@end

static const int SOURCE_ASK_USER = 0;
static const int SOURCE_CAMERA = 1;
static const int SOURCE_GALLERY = 2;

@implementation ImagePickerPlugin {
  FlutterResult _result;
  NSDictionary *_arguments;
  UIImagePickerController *_imagePickerController;
  UIViewController *_viewController;
}

+ (void)registerWithRegistrar:(NSObject<FlutterPluginRegistrar> *)registrar {
  FlutterMethodChannel *channel =
      [FlutterMethodChannel methodChannelWithName:@"image_picker"
                                  binaryMessenger:[registrar messenger]];
  UIViewController *viewController =
      [UIApplication sharedApplication].delegate.window.rootViewController;
  ImagePickerPlugin *instance = [[ImagePickerPlugin alloc] initWithViewController:viewController];
  [registrar addMethodCallDelegate:instance channel:channel];
}

- (instancetype)initWithViewController:(UIViewController *)viewController {
  self = [super init];
  if (self) {
    _viewController = viewController;
    _imagePickerController = [[UIImagePickerController alloc] init];
  }
  return self;
}

- (void)handleMethodCall:(FlutterMethodCall *)call result:(FlutterResult)result {
  if (_result) {
    _result([FlutterError errorWithCode:@"multiple_request"
                                message:@"Cancelled by a second request"
                                details:nil]);
    _result = nil;
  }

  if ([@"pickImage" isEqualToString:call.method]) {
    _imagePickerController.modalPresentationStyle = UIModalPresentationCurrentContext;
    _imagePickerController.delegate = self;

    _result = result;
    _arguments = call.arguments;

    int imageSource = [[_arguments objectForKey:@"source"] intValue];

    switch (imageSource) {
      case SOURCE_ASK_USER:
        [self showImageSourceSelector];
        break;
      case SOURCE_CAMERA:
        [self showCamera];
        break;
      case SOURCE_GALLERY:
        [self showPhotoLibrary];
        break;
      default:
        result([FlutterError errorWithCode:@"invalid_source"
                                   message:@"Invalid image source."
                                   details:nil]);
        break;
    }
  } else {
    result(FlutterMethodNotImplemented);
  }
}

- (void)showImageSourceSelector {
  UIAlertControllerStyle style = UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad
                                     ? UIAlertControllerStyleAlert
                                     : UIAlertControllerStyleActionSheet;

  UIAlertController *alert =
      [UIAlertController alertControllerWithTitle:nil message:nil preferredStyle:style];
  UIAlertAction *camera = [UIAlertAction actionWithTitle:@"Take Photo"
                                                   style:UIAlertActionStyleDefault
                                                 handler:^(UIAlertAction *action) {
                                                   [self showCamera];
                                                 }];
  UIAlertAction *library = [UIAlertAction actionWithTitle:@"Choose Photo"
                                                    style:UIAlertActionStyleDefault
                                                  handler:^(UIAlertAction *action) {
                                                    [self showPhotoLibrary];
                                                  }];


  UIAlertAction *cancel =
      [UIAlertAction actionWithTitle:@"Cancel" style:UIAlertActionStyleCancel handler:nil];
  [alert addAction:camera];
  [alert addAction:library];
  [alert addAction:cancel];
  [_viewController presentViewController:alert animated:YES completion:nil];
}

- (void)showCamera {
  // Camera is not available on simulators
  if ([UIImagePickerController isSourceTypeAvailable:UIImagePickerControllerSourceTypeCamera]) {
    _imagePickerController.sourceType = UIImagePickerControllerCameraCaptureModeVideo;
    [_viewController presentViewController:_imagePickerController animated:YES completion:nil];
  } else {
    [[[UIAlertView alloc] initWithTitle:@"Error"
                                message:@"Camera not available."
                               delegate:nil
                      cancelButtonTitle:@"OK"
                      otherButtonTitles:nil] show];
  }
}

- (void)showPhotoLibrary {
  // No need to check if SourceType is available. It always is.
  //_imagePickerController.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
    _imagePickerController.mediaTypes =[UIImagePickerController availableMediaTypesForSourceType:_imagePickerController.sourceType];
  [_viewController presentViewController:_imagePickerController animated:YES completion:nil];
}

- (void)imagePickerController:(UIImagePickerController *)picker
    didFinishPickingMediaWithInfo:(NSDictionary<NSString *, id> *)info {
  [_imagePickerController dismissViewControllerAnimated:YES completion:nil];
  UIImage *image = [info objectForKey:UIImagePickerControllerEditedImage];
  NSURL *videoURL = [info objectForKey:UIImagePickerControllerMediaURL];
  if (image == nil) {
    image = [info objectForKey:UIImagePickerControllerOriginalImage];
  } else {
      image = [self normalizedImage:image];
  }
  if (videoURL == nil) {

  } else {
      //image = videoURL;
  }


  NSNumber *maxWidth = [_arguments objectForKey:@"maxWidth"];
  NSNumber *maxHeight = [_arguments objectForKey:@"maxHeight"];

  if (maxWidth != (id)[NSNull null] || maxHeight != (id)[NSNull null]) {
    image = [self scaledImage:image maxWidth:maxWidth maxHeight:maxHeight];
  }

  NSData *data = UIImageJPEGRepresentation(image, 1.0);
  NSString *tmpDirectory = NSTemporaryDirectory();
  NSString *guid = [[NSProcessInfo processInfo] globallyUniqueString];
  // TODO(jackson): Using the cache directory might be better than temporary
  // directory.
  NSString *tmpFile = [NSString stringWithFormat:@"image_picker_%@.jpg", guid];
  NSString *tmpPath = [tmpDirectory stringByAppendingPathComponent:tmpFile];
  if ([[NSFileManager defaultManager] createFileAtPath:tmpPath contents:data attributes:nil]) {
    _result(tmpPath);
  } else {
    _result([FlutterError errorWithCode:@"create_error"
                                message:@"Temporary file could not be created"
                                details:nil]);
  }
  _result = nil;
  _arguments = nil;
}

// The way we save images to the tmp dir currently throws away all EXIF data
// (including the orientation of the image). That means, pics taken in portrait
// will not be orientated correctly as is. To avoid that, we rotate the actual
// image data.
// TODO(goderbauer): investigate how to preserve EXIF data.
- (UIImage *)normalizedImage:(UIImage *)image {
  if (image.imageOrientation == UIImageOrientationUp) return image;

  UIGraphicsBeginImageContextWithOptions(image.size, NO, image.scale);
  [image drawInRect:(CGRect){0, 0, image.size}];
  UIImage *normalizedImage = UIGraphicsGetImageFromCurrentImageContext();
  UIGraphicsEndImageContext();
  return normalizedImage;
}


- (UIImage *)scaledImage:(UIImage *)image
                maxWidth:(NSNumber *)maxWidth
               maxHeight:(NSNumber *)maxHeight {
  double originalWidth = image.size.width;
  double originalHeight = image.size.height;

  bool hasMaxWidth = maxWidth != (id)[NSNull null];
  bool hasMaxHeight = maxHeight != (id)[NSNull null];

  double width = hasMaxWidth ? MIN([maxWidth doubleValue], originalWidth) : originalWidth;
  double height = hasMaxHeight ? MIN([maxHeight doubleValue], originalHeight) : originalHeight;

  bool shouldDownscaleWidth = hasMaxWidth && [maxWidth doubleValue] < originalWidth;
  bool shouldDownscaleHeight = hasMaxHeight && [maxHeight doubleValue] < originalHeight;
  bool shouldDownscale = shouldDownscaleWidth || shouldDownscaleHeight;

  if (shouldDownscale) {
    double downscaledWidth = (height / originalHeight) * originalWidth;
    double downscaledHeight = (width / originalWidth) * originalHeight;

    if (width < height) {
      if (!hasMaxWidth) {
        width = downscaledWidth;
      } else {
        height = downscaledHeight;
      }
    } else if (height < width) {
      if (!hasMaxHeight) {
        height = downscaledHeight;
      } else {
        width = downscaledWidth;
      }
    } else {
      if (originalWidth < originalHeight) {
        width = downscaledWidth;
      } else if (originalHeight < originalWidth) {
        height = downscaledHeight;
      }
    }
  }

  UIGraphicsBeginImageContextWithOptions(CGSizeMake(width, height), NO, 1.0);
  [image drawInRect:CGRectMake(0, 0, width, height)];

  UIImage *scaledImage = UIGraphicsGetImageFromCurrentImageContext();
  UIGraphicsEndImageContext();

  return scaledImage;
}

@end

Thanks

Here is the IOS code that I have completed, I am still working on the Android if anyone wants to assist, I will post where I am at so far. This code replaces what is in the .m file of the IOS folder, no other changes are needed for this to work to pick and capture video along with images. You must figure out how to display the selected video/image in your app, but that's however you want to handle it. Again let me know if you want to assist with finishing he Android side.

@import UIKit;
#import <MobileCoreServices/MobileCoreServices.h>

#import "MediaPickerPlugin.h"

@interface MediaPickerPlugin ()<UINavigationControllerDelegate, UIImagePickerControllerDelegate>
@end

static const int SOURCE_ASK_USER = 0;
//static const int SOURCE_CAMERA = 0;
//static const int SOURCE_GALLERY = 0;

@implementation MediaPickerPlugin {
    FlutterResult _result;
    NSDictionary *_arguments;
    UIImagePickerController *_imagePickerController;
    UIViewController *_viewController;
}

+ (void)registerWithRegistrar:(NSObject<FlutterPluginRegistrar> *)registrar {
    FlutterMethodChannel *channel =
    [FlutterMethodChannel methodChannelWithName:@"media_picker"
                                binaryMessenger:[registrar messenger]];
    UIViewController *viewController =
        [UIApplication sharedApplication].delegate.window.rootViewController;
    MediaPickerPlugin *instance =
        [[MediaPickerPlugin alloc] initWithViewController:viewController];
    [registrar addMethodCallDelegate:instance channel:channel];
}

- (instancetype)initWithViewController:(UIViewController *)viewController {
    self = [super init];
    if (self) {
      _viewController = viewController;
      _imagePickerController = [[UIImagePickerController alloc] init];
    }
    return self;
}

- (void)handleMethodCall:(FlutterMethodCall *)call result:(FlutterResult)result {
  if (_result) {
    _result([FlutterError errorWithCode:@"multiple_request"
                                message:@"Cancelled by a second request"
                                details:nil]);
    _result = nil;
      _arguments = nil;
}

if ([@"pickImage" isEqualToString:call.method]) {
  _imagePickerController.modalPresentationStyle = UIModalPresentationCurrentContext;
  _imagePickerController.delegate = self;

  _result = result;
  _arguments = call.arguments;

  int imageSource = [[_arguments objectForKey:@"source"] intValue];

    switch (imageSource) {
        case SOURCE_ASK_USER:
            [self showImageSourceSelector];
            break;
        default:
            result([FlutterError errorWithCode:@"invalid_source"
                                       message:@"Invalid image source."
                                       details:nil]);
            break;
        }
    } else {
      result(FlutterMethodNotImplemented);
    }
}

- (void)showImageSourceSelector {
    UIAlertControllerStyle style = UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad
                                        ? UIAlertControllerStyleAlert
                                        : UIAlertControllerStyleActionSheet;

    UIAlertController *alert =
        [UIAlertController alertControllerWithTitle:nil message:nil preferredStyle:style];
    UIAlertAction *camera = [UIAlertAction actionWithTitle:@"Camera"
                                                     style:UIAlertActionStyleDefault
                                                   handler:^(UIAlertAction *action) {
                                                       [self showCamera];
                                                   }];
    UIAlertAction *library = [UIAlertAction actionWithTitle:@"Gallery"
                                                      style:UIAlertActionStyleDefault
                                                    handler:^(UIAlertAction *action) {
                                                        [self showPhotoLibrary];
                                                    }];
    UIAlertAction *cancel =
    [UIAlertAction actionWithTitle:@"Cancel" style:UIAlertActionStyleCancel handler:nil];
    [alert addAction:camera];
    [alert addAction:library];
    [alert addAction:cancel];
    [_viewController presentViewController:alert animated:YES completion:nil];
}

- (void)showCamera {
    // Camera is not available on simulators
    if ([UIImagePickerController isSourceTypeAvailable:UIImagePickerControllerSourceTypeCamera]) {
        _imagePickerController.sourceType = UIImagePickerControllerSourceTypeCamera;
        _imagePickerController.mediaTypes = [NSArray arrayWithObjects:@"public.movie", @"public.image", nil];
        _imagePickerController.delegate = self;
        _imagePickerController.restoresFocusAfterTransition = false;
        _imagePickerController.allowsEditing = NO;
        _imagePickerController.videoQuality = UIImagePickerControllerQualityTypeLow;
        _imagePickerController.videoMaximumDuration = 30.0f; // 30 seconds
        [_viewController presentViewController:_imagePickerController animated:YES completion:nil];
    } else {
        [[[UIAlertView alloc] initWithTitle:@"Error"
                                    message:@"Camera not available."
                                   delegate:nil
                          cancelButtonTitle:@"OK"
                          otherButtonTitles:nil] show];
    }
}

- (void)showPhotoLibrary {
// No need to check if SourceType is available. It always is.
_imagePickerController.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
    _imagePickerController.mediaTypes = [NSArray arrayWithObjects:@"public.movie", @"public.image", nil];
//_imagePickerController.mediaTypes =[UIImagePickerController availableMediaTypesForSourceType:_imagePickerController.sourceType];
[_viewController presentViewController:_imagePickerController animated:YES completion:nil];
}

- (void)imagePickerController:(UIImagePickerController *)picker
      didFinishPickingMediaWithInfo:(NSDictionary<NSString *, id> *)info {
  [_imagePickerController dismissViewControllerAnimated:YES completion:nil];
  NSString *mediaType = [info objectForKey:UIImagePickerControllerMediaType];
  if ([mediaType isEqualToString:@"public.movie"]) {
    NSURL *videoURL = [info objectForKey:UIImagePickerControllerMediaURL];
    NSString *videoString = [videoURL absoluteString];
    NSLog(@"Video File:%@", videoString);
    _result(videoString);
  } else {
    UIImage *image = [info objectForKey:UIImagePickerControllerEditedImage];
    if (image == nil) {
      image = [info objectForKey:UIImagePickerControllerOriginalImage];
    }
    image = [self normalizedImage:image];

    NSNumber *maxWidth = [_arguments objectForKey:@"maxWidth"];
    NSNumber *maxHeight = [_arguments objectForKey:@"maxHeight"];

    if (maxWidth != (id)[NSNull null] || maxHeight != (id)[NSNull null]) {
      image = [self scaledImage:image maxWidth:maxWidth maxHeight:maxHeight];
    }

    NSData *data = UIImageJPEGRepresentation(image, 1.0);
    NSString *tmpDirectory = NSTemporaryDirectory();
    NSString *guid = [[NSProcessInfo processInfo] globallyUniqueString];
    // TODO(jackson): Using the cache directory might be better than temporary
    // directory.
    NSString *tmpFile = [NSString stringWithFormat:@"image_picker_%@.jpg", guid];
    NSString *tmpPath = [tmpDirectory stringByAppendingPathComponent:tmpFile];
    NSLog(@"Image File:%@", tmpPath);
    if ([[NSFileManager defaultManager] createFileAtPath:tmpPath contents:data attributes:nil]) {
        _result(tmpPath);
    } else {
        _result([FlutterError errorWithCode:@"create_error"
                                    message:@"Temporary file could not be created"
                                    details:nil]);
    }
      _result = nil;
      _arguments = nil;
  }
  _result = nil;
  _arguments = nil;
}

// The way we save images to the tmp dir currently throws away all EXIF data
    // (including the orientation of the image). That means, pics taken in portrait
    // will not be orientated correctly as is. To avoid that, we rotate the actual
    // image data.
// TODO(goderbauer): investigate how to preserve EXIF data.
- (UIImage *)normalizedImage:(UIImage *)image {
    if (image.imageOrientation == UIImageOrientationUp) return image;

    UIGraphicsBeginImageContextWithOptions(image.size, NO, image.scale);
    [image drawInRect:(CGRect){0, 0, image.size}];
    UIImage *normalizedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return normalizedImage;
}
//- (NSString *)normalVideo:(NSURL *)videoURL {
  //    NSString *normalVideo = UIImagePickerControllerMediaURL;
  //    return normalVideo;
//}

- (UIImage *)scaledImage:(UIImage *)image
    maxWidth:(NSNumber *)maxWidth
    maxHeight:(NSNumber *)maxHeight {
    double originalWidth = image.size.width;
    double originalHeight = image.size.height;

    bool hasMaxWidth = maxWidth != (id)[NSNull null];
    bool hasMaxHeight = maxHeight != (id)[NSNull null];

    double width = hasMaxWidth ? MIN([maxWidth doubleValue], originalWidth) : originalWidth;
    double height = hasMaxHeight ? MIN([maxHeight doubleValue], originalHeight) : originalHeight;

    bool shouldDownscaleWidth = hasMaxWidth && [maxWidth doubleValue] < originalWidth;
    bool shouldDownscaleHeight = hasMaxHeight && [maxHeight doubleValue] < originalHeight;
    bool shouldDownscale = shouldDownscaleWidth || shouldDownscaleHeight;

    if (shouldDownscale) {
          double downscaledWidth = (height / originalHeight) * originalWidth;
          double downscaledHeight = (width / originalWidth) * originalHeight;

          if (width < height) {
            if (!hasMaxWidth) {
              width = downscaledWidth;
            } else {
              height = downscaledHeight;
            }
          } else if (height < width) {
            if (!hasMaxHeight) {
              height = downscaledHeight;
            } else {
              width = downscaledWidth;
            }
          } else {
            if (originalWidth < originalHeight) {
              width = downscaledWidth;
            } else if (originalHeight < originalWidth) {
              height = downscaledHeight;
            }
          }
    }

    UIGraphicsBeginImageContextWithOptions(CGSizeMake(width, height), NO, 1.0);
    [image drawInRect:CGRectMake(0, 0, width, height)];

    UIImage *scaledImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return scaledImage;
}

@end

Flutter Image / Video Picker — Flutter | by Karthik Ponnam, Add image_picker plugin in pubspec.yaml; Add Requied image picker demo. Let's see how to pick the video from Gallery and Camera. All of you know that flutter 1.9 has release and supports many new widgets. To know more what added release notes here Today we are gonna see how to use image_picker plugin to get Image & Video

I would probably add another method pickVideo to image_picker.dart, and then add the corresponding Android and iOS implementations of that in imagePickerPlugin.m and ImagePickerPlugin.java.

Inside the latter two, I would use the iOS and Android APIs for videos, e.g. something like this on iOS: Objective c - ios : How to pick video from Camera Roll?

image_picker, Flutter plugin for selecting images from the Android and iOS image your app needs access to the microphone, if you intend to record videos. Flutter Video player from the gallery and live camera in flutter in this video, i will show you how can you Flutter Image Picker Flutter Video Player Flutter Video player Library Link https://pub

as of version 0.4.2, the plugin allows video to be selected

Added support for picking videos. Updated example app to show video preview.

Image picker camera gallery Flutter, flutter video tutorial in English , In this video, I have discussed Image Picker Plugin that is used to pick image from device Duration: 7:54 Posted: 27 Feb 2020 Flutter image_picker choose video. Ask Question Asked 2 years, 5 months ago. Active 2 days ago. Viewed 2k times 3. 1. I am successfully using the Flutter Plugin Image

You can do that now using pickVideo available in image_picker

final _picker = ImagePicker();
PickedFile video = await _picker.getVideo(...)
...

Ref - https://pub.dev/packages/image_picker

Image picker extended to videos in gallery or even files � Issue , Was not sure where to put feature request for image_picker plugin. Any chance to be able to select videos that are in the same gallery as images? @ abbadabbatech I am currently using it in production on Flutter master� Flutter Image Picker is used to select image from device and set it to image widget.Almost every app will have to upload some images in terms of profile images and more. Now a days every social networking sites like facebook, instagram, whatsapp has the ability to choose a image from device and upload it to user dashboard.

you can use the image picker for recording video, and chewie library to show a video via video controller. for more reference use this video link - https://www.youtube.com/watch?time_continue=17&v=XSn5EwWBG-4&feature=emb_logo

[image_picker] image picker pick video returns jpg format video , [image_picker] image picker pick video returns jpg format video #57156 ( 9269 ): Video Source ImageSource.gallery I/flutter ( 9269): Video File� Image / Video Picker — Flutter. Hello All Flutter Developers. All of you know that flutter 1.9 has release and supports many new widgets. To know more what added release notes here. Today we are gonna see how to use image_picker plugin to get Image & Video file from Gallery & Camera. Here how it the flow will. Add image_picker plugin in

Pick image/video from Album by Flutter, Pick image/video from album by flutter. Support ios and android. UI by flutter, no native. image picker, multi picker support ios icloud support video use flutter as� photo. image picker, multi picker. support ios icloud. support video. use flutter as ui. if you want to build custom ui, you just need api to make custom ui. to use photo_manager or fork the library to custom ui.

Imagepicker Widget in Flutter, Choose an Image or Choose a Video; Choose one of the above from a Gallery or a Camera Source directly. This is an image picker app which I have tried to implement in a flutter About the app:-When you open this app you will be seeing two floating action buttons.

photo_manager, A flutter api for photo, you can get image/video from ios or android. selector, you can choose to use photo library , a multi image picker. First, add multiple_image_picker as a dependency in your pubspec.yaml file. multiple_image_picker: 0.4.8. Warning # This package is fork from flutter package by Google. The use case for this package is because right now original package isn't support multiple image pick and this for personal use only. iOS #

Comments
  • Any code examples or have you done it before for this plugin?
  • Anyone have a code example, I have tried to see how the code would fit in the current plugin but not as well versed in Objective c right now. I see how it could work, but not how to modify the current code to make the changes. Any help would be appreciated.
  • I have it selecting video, but can not figure out how to get it to present back to the plugin, it crashes or hangs when I choose it, any thoughts or has anyone done it yet, need to capture video on camera too.
  • I have added some code I have been working on, but still looking for some assistance.
  • @Slabo I just posted my finished ios code, android is almost done, I will probably do a PR when I am complete or make a new one called media_picker and post as a package.