expo-media-gallery v0.0.3

❓ Questions

Why was this lib created?

This lib was created to help in the process of creating media galleries for React Native projects created with Expo.

How to contribute?

1. Fork the project.

2. You will need to clone the repository.

git clone your-repository

3. Create an Expo project to test new features.

expo init your-test-project

4. After the test project is installed, drag all files from the expo-media-gallery repository into your test project.

5. Now install the project dependencies.

yarn or npm install

6. After finishing your contribution copy your src folder to expo-media-gallery folder. Remember to add the new dependencies to package.json if you have a new package.

7. After uploading your contribution, make a pull request.

🚀 How to use the component?

Example of use:

import React from 'react'
import { View } from 'react-native'

import { GalleryProvider, Gallery } from 'expo-media-gallery'

// Create a View around to define spacing and fills.

export const App: React.FC = () => {
  return (
    <GalleryProvider>
      <Gallery />
    </GalleryProvider>
  )
}

Required

It is necessary to pass the <GalleryProvider/> component around the component that will use the hook.

Properties

rules (Object):

• selectionLimit: Number - Selected media limit.

templateWithoutPermission (React.FC) - Component when you don't have access to the gallery.

Hooks

useMedia - Returns all currently selected averages.

Example useMedia:

import React from 'react'
import { View } from 'react-native'

import { Gallery, useMedia } from 'expo-media-gallery'

export const App: React.FC = () => {
  const medias = useMedia()
  
  /*
    [
      { 
        id: 1, 
        type: 'photo', 
        uri: 'file:image-location'
      }
    ]
  */
  

  return (
    <GalleryProvider>
      <Gallery />
    </GalleryProvider>
  )
}

🔧 Typescript

GalleryProps - Available properties of the gallery component.

✅ Component result

The component will be listing all photographs if you have permission for all images.