Search code examples
iosangularnativescriptnativescript-angular

Nativescript Mediafilepicker customizing DKImagePickerController UI

I'm currently using Nativescript-Mediafilepicker plugin to handle image selection and also capturing image from camera in iOS. In ns mediafilepicker docs , i can see that it is using DKImagePickerController native libraries to handle the image selection and In the DKImagePickerController docs, i can see there is an option to customize the UI (CustomUIDelegate).

Is there any possible way to do the same with Nativescript? I wish to customize the camera icon in the image picker gallery. In the DKImagePickerController CustomUIDelegate doc, i can see it is using DKAssetGroupDetailBaseCell to achieve the customization. How can i do this in Nativescript Angular?

enter image description here

Solution

  • Short answer: you cannot do it easily.

    Long Answer

    You need to override methods since the plugin you are referring to does not expose APIs to modify the icon.

    I have tried modifying it myself and I found out modifying the original plugin source code. I can give you hints on what you would have to do based on the understanding I have put in during the last few hours.

    1. Create your custom MediaPicker
    class MyMediaPicker extends Mediafilepicker {
...
}
    1. Extend and copy the original openImagePicker method.
    2. As you can see in the original source code, you have access to the picker, but you need to create a custom iOS delegate that handles the task of getting the UIImage for the camera.... This last task is painful, since the DK plugin guy created a custom class to refer to the Camera Cell that you now have to modify as well.

    Once you modify (1) the picker plugin method, (2) the internal DK picker delegate, and (3) created a custom CameraCell. You should be able to modify that camera icon.

    Here are some useful links: