{"id":20643505,"url":"https://github.com/st0ffern/react-native-mediapicker","last_synced_at":"2025-08-31T03:40:21.736Z","repository":{"id":57338338,"uuid":"63486142","full_name":"st0ffern/react-native-mediapicker","owner":"st0ffern","description":"Media picker for React Native","archived":false,"fork":false,"pushed_at":"2017-10-12T08:08:26.000Z","size":7716,"stargazers_count":22,"open_issues_count":3,"forks_count":10,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-04-23T18:34:47.139Z","etag":null,"topics":["camera","media","mediapicker","photos","picker","react-native"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/st0ffern.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-07-16T14:17:38.000Z","updated_at":"2023-11-25T15:28:12.000Z","dependencies_parsed_at":"2022-08-31T08:00:30.288Z","dependency_job_id":null,"html_url":"https://github.com/st0ffern/react-native-mediapicker","commit_stats":null,"previous_names":["stoffern/react-native-mediapicker"],"tags_count":11,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/st0ffern%2Freact-native-mediapicker","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/st0ffern%2Freact-native-mediapicker/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/st0ffern%2Freact-native-mediapicker/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/st0ffern%2Freact-native-mediapicker/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/st0ffern","download_url":"https://codeload.github.com/st0ffern/react-native-mediapicker/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":224937408,"owners_count":17395121,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["camera","media","mediapicker","photos","picker","react-native"],"created_at":"2024-11-16T16:13:00.681Z","updated_at":"2024-11-16T16:13:01.186Z","avatar_url":"https://github.com/st0ffern.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-native-mediapicker [![version](https://img.shields.io/npm/v/react-native-mediapicker.svg?maxAge=1000\u0026style=flat-square)](https://www.npmjs.org/package/react-native-mediapicker) [![npm](https://img.shields.io/npm/dt/express.svg?maxAge=1000\u0026style=flat-square)](https://www.npmjs.org/package/react-native-mediapicker) [![dependencies](https://david-dm.org/stoffern/react-native-mediapicker.svg?maxAge=1000\u0026style=flat-square)](https://david-dm.org/stoffern/react-native-mediapicker) [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg?maxAge=2592000\u0026style=flat-square)](http://commitizen.github.io/cz-cli/) [![npm](https://img.shields.io/npm/l/react-native-mediapicker.svg?maxAge=2592000\u0026style=flat-square)]()\n\n[![Greenkeeper badge](https://badges.greenkeeper.io/stoffern/react-native-mediapicker.svg)](https://greenkeeper.io/)\n\n\nMedia Picker for React Native\n\n\n\u003cimg src=\"https://raw.githubusercontent.com/stoffern/react-native-mediapicker/master/demo/demo.gif\" width=\"350\"\u003e\n\n## Props\n\n- `callback`: ***required*** Callback function when images was selected.\n- `groupTypes`: The group where the photos will be fetched, one of 'Album', 'All', 'Event', 'Faces', 'Library', 'PhotoStream' and 'SavedPhotos'. (Default: SavedPhotos)\n- `assetType`: The asset type, one of 'Photos', 'Videos' or 'All'. (Default: Photos)\n- `maximum`: Maximum number of selected images. (Default: 15)\n- `imagesPerRow`: Number of images per row. (Default: 3)\n- `imageMargin`: Margin size of one image. (Default: 5)\n- `selectedMarker`: Custom selected image marker component. (Default: checkmark).\n- `backgroundColor`: Set background color. (Default: white).\n- `selected`: set preselected items (Default: none ).\n- `showLoading`: show loading spinners before image will show? (Default: true ).\n\n\n## Installation\n\n```bash\nnpm i -S react-native-mediapicker\n```\nor\n```bash\nyarn add react-native-mediapicker\n```\n\n### Link Native Modules (IOS)\n\nIn XCode, you need to add a link to RCTCameraRoll. You will find more information in the [react-native docs](https://facebook.github.io/react-native/docs/linking-libraries-ios.html#content)\n\n### Add Purpose String (IOS)\n\nFor IOS10 you need to add a “Privacy - Photo Library Usage Description”-key to Info.plist. For more information, see this [blog](https://useyourloaf.com/blog/privacy-settings-in-ios-10/)\n\n## Usage Examples\n\n```js\nimport MediaPicker from \"react-native-mediapicker\"\n```\n\n```javascript\n\u003cMediaPicker\n  callback={items =\u003e this.whenClicked(items)}\n  groupTypes=\"SavedPhotos\"\n  assetType=\"Photos\"\n  maximum={1}\n  imagesPerRow={3}\n  imageMargin={5}\n  showLoading={true}\n  backgroundColor=\"black\"\n  selectedMarker={\n    \u003cImage\n      style={[styles.checkIcon, {width: 25, height: 25, right: this.props.imageMargin + 5},]}\n      source={require('./checkmark.png')}\n    /\u003e\n  } /\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fst0ffern%2Freact-native-mediapicker","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fst0ffern%2Freact-native-mediapicker","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fst0ffern%2Freact-native-mediapicker/lists"}