React-Native-Video отключает TouchableOpacity в Android - PullRequest
Новая
       61

React-Native-Video отключает TouchableOpacity в Android

0 голосов
/ 02 января 2019

Я работаю над собственным приложением реагирования, которое включает в себя видеоплеер (act-native-video) и несколько простых элементов управления, которые я настраиваю сам. в iOS это работает нормально, но в Android элементы TouchableOpacity, которые я использую для элементов управления и навигации, похоже, не обнаруживают прикосновения. (Навигация обрабатывается по реакции-родной-жидкости-переходов в моем приложении). Когда я включаю инспектор, поверх моих элементов управления появляется вид, покрывающий экран. Однако это не относится к iOS, и я также не настроил такое представление.

Я установил Atom, чтобы использовать его функцию инспектора, чтобы видеть фактический порядок моих просмотров. Это выглядит следующим образом:

enter image description here

VideoView - это имя моего компонента, Video - это актуальный видеоплеер, а TouchableOpacity, который я выделил, - это кнопка, которую я пытаюсь заставить работать. В этой иерархии представлений никакие представления, кажется, не находятся ни перед чем. Я также сравнил эту разбивку с другими компонентами, где мои кнопки действительно работают, и выглядит так же.

Мой код выглядит следующим образом: 

return (
      <View style={internalStyles.container}>
        <Video style={internalStyles.videoContainer}
            ref={(ref) => {
             this.props.player = ref
            }}
            source={{uri: url}}
            controls={false}
            onEnd={() => this.videoEnded()}
            paused={this.state.paused}
            muted={false}
            repeat={false}
            resizeMode={"contain"}
            volume={1.0}
            rate={1.0}
            ignoreSilentSwitch={"obey"}
          />              
        {this.renderControls()}
        {Renderer.getInstance().renderNavigationButton()}
      </View>
  );

где renderControls - это функция, которая отображает кнопку паузы, а Renderer - одноэлементный компонент, содержащий функцию рендеринга для элементов, которые я использую в других компонентах моего приложения. Все это прекрасно работает на iOS, но не на Android. реакция-нативное видео кажется несовместимой с реакцией-нативная-текучая среда, поскольку все работает, когда я удаляю один из них.

Кто-нибудь знает, что может вызвать такое поведение? Любая помощь будет принята с благодарностью.

Ответы [ 2 ]

0 голосов
/ 02 января 2019

Попробуйте удалить реквизит activeOpacity из компонента TouchableOpacity.Или вы можете использовать платформо-зависимый код для установки значений для activeOpacity prop 

import { Platform, TouchableOpacity } from 'react-native'

    <TouchableOpacity 
      activeOpacity={Platform.OS==='android' ? 0 : 0.2}
      >
      <Text>submit</Text>
    </TouchableOpacity>
0 голосов
/ 02 января 2019 
import {TouchableOpacity} from 'react-native';

<TouchableOpacity>some text</TouchableOpacity>
...