[image_picker] ability to have custom UI for picker and confirmation

[YazeedAlKhalaf]

now the UI for android and iOS is not customizable nor good looking

[YazeedAlKhalaf]

I would be happy to do it, but I need to know where to find the UI part. I tried searching the files but found nothing so I hope you can give me a link to the files responsible for UI in the package image_picker

@darshankawar @TahaTesser @christopherfujino

[christopherfujino]

cc @shihaohong

[shihaohong]

I believe image_picker is a plugin: https://github.com/flutter/plugins/tree/master/packages/image_picker

I'm not as familiar with plugins and this particular package, but I hope that this was what you were looking for @YazeedAlKhalaf

[shihaohong]

Because it's a plugin, if you want to update the underlying implementation, you'll likely need to make changes to the platform-specific code under image_picker/ios or image_picker/android. I'm thinking @cyanglaz or someone else more familiar with plugins might be able to better assist you

[cyanglaz]

@YazeedAlKhalaf the image_picker plugin uses default image picker in iOS and Android. On iOS it uses the default image picker UI provided by the system. On Android, it fires an intent to pick the image and in most cases, it opens the default image picking activity in the specific Android device. (For example, in a pixel phone, google photo is opened when the source is set to gallery , and the camera app is opened when the source is set to camera)

Which UI do you want to customize? The gallery or camera?
If you want fully customize the UI of the camera, the camera plugin is your best bet.
If you want to customize the UI of the gallery, there is no easy way to do so. I would suggest to find some plugins that allows you to query all the image files in the device and go from there. pub.dev is probably a good place to start finding a such plugin.

[YazeedAlKhalaf]

What I would like to customize is the confirmation dialog. For example, when choosing a video, it shows a very not good looking UI. Take Whatsapp's UI, the confirmation is custom. I have my uncle @AboAlimk . Who worked on a native app for android where he customized the confirmation dialog and the way photos and videos are shown.
I mean Flutter is all about building beautiful UI, and the image_picker is official. Why not make it look a lot better.

Now when choosing a video it shows the video in iOS using some custom but not good looking interface. The icons look weird and they do not have a good aspect ratio. And the slider up is not controllable. I have an iPhone and I know that this is not the regular action. Impossible that this is the default. And if it is I prefer having the ability to have more customizable UI or at least a better one where it symbolizes Flutter.

[YazeedAlKhalaf]

I am not a Native iOS developer but from looking at the package image_picker. I can see that the package uses UIKit in this file. My guess is that the UI is in here:
https://github.com/flutter/plugins/blob/master/packages/image_picker/image_picker/ios/Classes/FLTImagePickerPlugin.m

[YazeedAlKhalaf]

My goal is to be able to make a custom UI when choosing the image and confirming it.
Take WhatsApp as an example, they have a custom UI before sending not the native one which, to be honest, looks ugly.

Plus when making an app that you want to ship, having a weird looking UI in between all the good ones makes the app feel cheap.

What I mean is like a flutter method that gives you some arguments which you can then make a UI of and callback methods for confirmation, cancellation and playing the video if it is a video.

[YazeedAlKhalaf]

I have found a package that has a custom UI which looks great, I feel safe to close this issue.
Package: https://pub.dev/packages/multi_image_picker

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.