Nonsense:
Currently about RN more well-known and well-packaged picture selection control a lot, but can support multi-image upload, the number of control compatible ios/ad is very few, and today introduced this framework can be achieved: Picture clipping, maximum number of pictures limit, photo, local photo album and other functions.
Effect:
Introduction to use:
principle:react-native-syan-image-picker Multi-image selector:
Android based on Pictureselector 2.0
IOS based on Tzimagepickercontroller 1.9.0
ios/android Configuration: specific steps refer to: Https://github.com/syanbo/react-native-syan-image-picker
Core code:
Import imagepicker from ' React-native-syan-image-picker '/** * Default parameters*/Const Options={imagecount:6,//Maximum number of images selected, default 6Iscamera:true,//whether to allow users to take photos internally, by default TrueIscrop:false,//whether to allow clipping, default falseCROPW: ~ ~ (Width * 0.6),//clipping width, default screen width 60%Croph: ~ ~ (Width * 0.6),//crop height, default screen width 60%Isgif:false,//whether to allow GIF selection, default false, no callback GIF dataShowcropcircle:false,//whether to display a circular cropping area, false by defaultShowcropframe:true,//Show clipping area, default TrueShowcropgrid:false //whether to hide the crop area grid, false by default }; /** * 1, in the form of callback, the album parameter temporarily supports only the attributes listed in the default parameters; * 2, callback form: Showimagepicker (Options, (err, selectedphotos) = { }) * 1) Select the picture succeeds, err is null,selectedphotos as the selected picture array * 2), ERR returns "Cancel", Selectedphotos will be undefined * on demand to determine the value of each parameter, ensure that the call normal , Example Usage: * Showimagepicker (Options, (err, Selectedphotos) = {* if (err) {*/// Cancel selection * return; *} *//Select Success *}) * * @param {Object} options album parameter * @param {Function} Callbac K success, or failure callback*/ /** * 1 in promise form, the album parameter temporarily only supports the properties listed in the default parameters, * 2, how to use * 1) async/await * Handleselectphoto = AS Ync () = {* try {* Const photos = await syimagepicker.asyncshowimagepicker (options); *//Select Success *} catch (Err) {*//deselect, err.message to "Cancel" *} *} * 2) Promise.then form * Handleselectphoto = () = {* Syimagepicker.asyncshowimagepicker (options) * . Then (Photos = {*//Select Success *}) *. catch (Err = {*//deselect, Err.mes Sage for "Cancel" *}) *} * @param {object} options album parameter * @return {Promise} returns a Promise object*/
To this end, the overall use is very convenient, such as the use of questions or questions welcome comments Message ~
React-native Multi-image selection, picture clipping (support Ad/ios picture Count control)