Native Image Picker
This guide can help you to comply with the new Google Play's android policy for photo and video permissions.
To enable the native image picker, you need to do the following steps and that would provide a native image picker for both iOS and Android.
Step 1: Uninstall the media library
Uninstall the media library by running the following command(if you have already installed it) else choose not to install it at all as it is a optional dependency.
- RN CLI
- Expo
yarn remove @react-native-camera-roll/camera-roll
yarn remove expo-media-library
Step 2: Install the native image picker
Install the native image picker by running the following command:
- RN CLI
- Expo
yarn add react-native-image-picker
npx expo install expo-image-picker
This shall give you a UI to select images from the gallery using native image picker or take a picture from the camera or alternatively select a file.
Please follow the post installation steps as mentioned in the react-native-image-picker.
Step 3: Add customization(if necessary)
You can customize what happens on clicking the AttachButton
by passing your own onPress
function to the handleAttachButtonPress
of the Channel
component.
import { useCallback } from 'react';
import { Channel } from 'stream-chat-react-native';
const App = () => {
const handleAttachButtonPress = useCallback(async () => {
// Your custom logic here
}, []);
return <Channel channel={channel} handleAttachButtonPress={handleAttachButtonPress} />;
};
The other alternative is customizing the AttachButton
component itself.
import { AttachButton } from 'stream-chat-react-native';
const CustomAttachButton = props => {
const { onPress } = props;
const handlePress = async () => {
// Your custom logic here
};
return <AttachButton onPress={handlePress} />;
};
const App = () => {
return <Channel channel={channel} AttachButton={CustomAttachButton} />;
};