Как мне сделать интерактивную оболочку TouchableOpacity для камеры на React Native Android?

#reactjs #react-native #touchableopacity

#reactjs #реагировать-родной #осязаемая емкость #react-native #touchableopacity

Вопрос:

Я визуализирую вид камеры внутри встроенного в react TouchableOpacity, как мне сделать его интерактивным?

Та же версия кода хорошо работает на iOS, TouchableOpacity является интерактивным и выдает правильный вывод

 <TouchableOpacity style={{width:'100%', height:300}} onPress={() =>alert("hey")}>
    <Camera 
        style={{ height: 300, width: '100%', display: this.state.camera }}  
        type={this.state.type} 
        autoFocus={'on'} 
        ratio={'4:3'}   
        focusDepth={0} 
        ref={(ref) => { this.camera = ref }}>
    </Camera>
</TouchableOpacity>
  

Я ожидаю, что на выходе будет предупреждение с надписью «hey», когда я нажимаю TouchableOpacity, вместо этого я ничего не получаю на Android, но я получаю «hey» на iOS

Ответ №1:

Это потому, что поведение TouchableOpacity отличается между iOS и Android. Быстрым решением было бы просто заменить TouchableOpacity на TouchableWithoutFeedback в Android. Вот способ сделать это:

 const Touchable = Platform.select({ ios: TouchableOpacity, android: TouchableWithoutFeedback });
  

Затем просто используйте эту константу для переноса вида с камеры.

PS: Убедитесь, что вы импортировали TouchableOpacity, TouchableWithoutFeedback и платформу из модуля react-native.