Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-27984] iOS 14: Use PHPicker for for accessing PhotoLibrary

GitHub Issuen/a
TypeNew Feature
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2020-09-16T18:58:19.000+0000
Affected Version/sn/a
Fix Version/sRelease 9.2.0
ComponentsiOS
Labelsphotogallery
ReporterVijay Singh
AssigneeVijay Singh
Created2020-06-24T19:46:06.000+0000
Updated2020-09-16T18:58:19.000+0000

Description

Apple has introduced PHPicker in PhotosUI framework to handle PhotoLibrary instead of UIImagePickerViewController. UIImagePickerViewController is deprecated in iOS 14. PHPicker has new API to select multiple photos. Details can be found https://developer.apple.com/documentation/photokit/phpickerviewcontroller https://developer.apple.com/documentation/photokit/phpickerconfiguration

Comments

  1. Vijay Singh 2020-07-30

    On comparing UIImagePickerViewController and PHPicker APIs wrt [Ti.Media.openPhotoGallary](https://docs.appcelerator.com/platform/latest/#!/api/Titanium.Media-method-openPhotoGallery), I found that following 2 properties are not supported in PHPicker APIs - 1. [allowEditing](https://docs.appcelerator.com/platform/latest/#!/api/PhotoGalleryOptionsType-property-allowEditing) 2. [allowTranscoding](https://docs.appcelerator.com/platform/latest/#!/api/PhotoGalleryOptionsType-property-allowTranscoding) 'allowEditing' is important feature and I believe many developers will be using it. So we can not replace UIImagePickerViewController completely. But Apple has deprecated it for PhotoLibrary handling, so we should also plan for same. And PHPicker has new API to select multiple images, which is a cool feature. Solution - If "allowEditing" is set to true or "allowTranscoding" is true while calling [Ti.Media.openPhotoGallary](https://docs.appcelerator.com/platform/latest/#!/api/Titanium.Media-method-openPhotoGallery), use UIImagePickerViewController (current implementation) to show Photo Library, with a deprecation warning. Otherwise use PHPickerViewController (PHPicker API) to show Photo Library. And in future major release these APIs can be removed. cc [~amukherjee] [~cwilliams] Let me know if you have any other thought. Edit - I will create a new ticket to deprecate "allowEditing" and "allowTranscoding" API which is not supported in PHPicker.
  2. Vijay Singh 2020-08-05

    PR - https://github.com/appcelerator/titanium_mobile/pull/11867 Test Case -
       var window = Ti.UI.createWindow();
       
       var navWindow = Ti.UI.createNavigationWindow({window: window});
       var tableView = Ti.UI.createTableView(
       {
       	width: Ti.UI.FILL,
       	height: Ti.UI.FILL,
       });
       window.add(tableView);
       var addButton = Ti.UI.createButton(
       {
       	title: "Add",
       	left: "10dp",
       	bottom: "10dp",
       });
       addButton.addEventListener("click", function(e) {
       	var dialog = Ti.UI.createAlertDialog(
       	{
       		message: "Which media type do you want to open?",
       		buttonNames: ["Photo", "Live Photo", "Video", "All"],
       	});
       	dialog.addEventListener("click", function(e) {
       		var mediaTypes;
       		if (e.index === 0) {
       			mediaTypes = [Ti.Media.MEDIA_TYPE_PHOTO];
       		} else if (e.index === 1) {
       			mediaTypes = [Ti.Media.MEDIA_TYPE_LIVEPHOTO];
       		} else if (e.index === 2) {
       			mediaTypes = [Ti.Media.MEDIA_TYPE_VIDEO];
       		} else if (e.index === 3) {
       			mediaTypes = [Ti.Media.MEDIA_TYPE_PHOTO, Ti.Media.MEDIA_TYPE_LIVEPHOTO, Ti.Media.MEDIA_TYPE_VIDEO];
       		} else {
       			Ti.API.info("@@@ Alert was canceled.");
       			return;
       		}
       		dialog.hide();
       		Ti.Media.openPhotoGallery(
       		{
       			allowMultiple: true,
       		    selectionLimit: 10,
       			autohide: true,
       			mediaTypes: mediaTypes,
       			success: function(e) {
       				Ti.API.info("@@@ success() e: " + JSON.stringify(e));
       				var createRowFrom = function(selectionEvent) {
       
       					var fileName = null;
       
       					if (!fileName) {
       						if (selectionEvent.mediaType === Ti.Media.MEDIA_TYPE_PHOTO) {
       							fileName = "Image";
       						} else if (selectionEvent.mediaType === Ti.Media.MEDIA_TYPE_VIDEO) {
       							fileName = "Video";
       						} else {
       							fileName = "Live Photo";
       						}
       					}
       					var row = Ti.UI.createTableViewRow({ title: fileName });
       					row.addEventListener("click", function(e) {
       						switch (selectionEvent.mediaType) {
       							case Ti.Media.MEDIA_TYPE_PHOTO:
       								var childWindow = Ti.UI.createWindow({backgroundColor: 'white'});
       								childWindow.add(Ti.UI.createImageView(
       								{
       									image: selectionEvent.media,
       									width: Ti.UI.FILL,
       									height: Ti.UI.FILL,
       								}));
       								navWindow.openWindow(childWindow);
       								break;
       							case Ti.Media.MEDIA_TYPE_LIVEPHOTO:
       								var childWindow = Ti.UI.createWindow({backgroundColor: 'white'});
       								var livePhotoView = Ti.UI.iOS.createLivePhotoView({
       									livePhoto: selectionEvent.livePhoto,
       									muted: true,
       									width: 300
       								});
       
       								livePhotoView.addEventListener("start", function(e) {
       									Ti.API.warn("-- Start playback --");
       									Ti.API.warn(e);
       								});
       
       								livePhotoView.addEventListener("stop", function(e) {
       									Ti.API.warn("-- Stop playback --");
       									Ti.API.warn(e);
       								});
       								childWindow.add(livePhotoView);
       								navWindow.openWindow(childWindow);
       								break;
       							case Ti.Media.MEDIA_TYPE_VIDEO:
       								var childWindow = Ti.UI.createWindow({backgroundColor: 'white'});
       								childWindow.add(Ti.Media.createVideoPlayer(
       								{
       									url: selectionEvent.media.nativePath,
       									autoplay: true,
       									mediaControlStyle: Ti.Media.VIDEO_CONTROL_DEFAULT,
       									scalingMode: Ti.Media.VIDEO_SCALING_ASPECT_FIT,
       									width: Ti.UI.FILL,
       									height: Ti.UI.FILL,
       								}));
       								navWindow.openWindow(childWindow);
       								break;
       							default:
       								alert("Unknown media type selected.");
       								break;
       						}
       					});
       					return row;
       				};
       				if (e.images) {
       					for (var index = 0; index < e.images.length; index++) {
       						tableView.appendRow(createRowFrom(e.images[index]));
       					}
       				}
       				if (e.livePhotos) {
       					for (var index = 0; index < e.livePhotos.length; index++) {
       						tableView.appendRow(createRowFrom(e.livePhotos[index]));
       					}
       				}
       				if (e.videos) {
       					for (var index = 0; index < e.videos.length; index++) {
       						tableView.appendRow(createRowFrom(e.videos[index]));
       					}
       				}
       			},
       			cancel: function() {
       				Ti.API.info("@@@ Photo gallery selection canceled.");
       			},
       			error: function() {
       				Ti.API.info("@@@ Photo gallery selection error.");
       			},
       		});
       	});
       	dialog.show();
       });
       window.add(addButton);
       var clearButton = Ti.UI.createButton(
       {
       	title: "Clear",
       	right: "10dp",
       	bottom: "10dp",
       });
       clearButton.addEventListener("click", function(e) {
       	tableView.data = [];
       });
       window.add(clearButton);
       navWindow.open();
       
  3. Satyam Sekhri 2020-09-11

    FR Passed On iOS 14 - Able to select multiple photo, live photo or video or a combination of these media types upto the defined selection limit. On iOS 13.x - The selection of single item of a media type works fine as before.
  4. Satyam Sekhri 2020-09-11

    Waiting for Jenkins build
  5. Satyam Sekhri 2020-09-16

    Verified on: Mac OS: 10.15.4 SDK: 9.2.0.v20200915123928, 9.3.0.v20200915132757 Appc CLI: 8.1.1 JDK: 11.0.4 Node: 10.17.0 Studio: 6.0.0.202005141803 Xcode: 12.0 GM iPhone 7Plus(v14.0 GM), iPhone X(v13.6.1)

JSON Source