Can't Detect Gif Selection From TextInput In React Native

25 Views Asked by At

Using react native TextInput (on version 0.72.10), I am unable to detect when a GIF has been selected by a user. Consequently, one is unable to retrieve the GIF data and implement any sort of logic to display the said GIF in another component better suited to display this data.

Looking at the documentation for TextInput, it seems that there is no default callback to detect any sort of GIF or image selection, so instead I opted to use the React Native Keyboard package with a onImageChange, but the callback does not appear to execute at all. The callback seems to be detected in vscode so I would think it is linking in some sense. Sample code is below (can also be seen in this expo snack):


import { useState } from 'react';
import { Text, TextInput, SafeAreaView, StyleSheet } from 'react-native';

export default function App() {
  const [debug, setDebug] = useState('No image change detected yet :(');
  const [message, setMessage] = useState('');

  const _onImageChange = (event) => {
    setDebug("Can detect image change!");
    const {uri, linkUri, mime, data} = event.nativeEvent;
  }

  return (
    <SafeAreaView style={styles.container}>
      <Text>{debug}</Text>
      <TextInput
          value={message}
          onChangeText={setMessage}
          placeholder={'Comments?'}
          style={styles.input}
          onImageChange={_onImageChange}
      />
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
  },
  input: {
    width: 250,
    height: 44,
    borderRadius: 10,
    padding: 10,
    marginTop: 20,
    marginBottom: 10,
    backgroundColor: 'paleturquoise',
  },
});
0

There are 0 best solutions below