Как показать элементы управления мультимедиа в режиме блокировки экрана / фона в реагирующем - PullRequest
1 голос
/ 30 июня 2019

Я делаю реактивный проект.И я играю в некоторые URL-адреса сети, которые получают с сервера.Это одиночная игра.

Итак, для воспроизведения звука я использую следующую библиотеку.

https://www.npmjs.com/package/react-native-sound-player

И я настроил элементы управления проигрывателем в соответствии с моим пользовательским интерфейсом.Звук воспроизводится хорошо, а также я включил воспроизведение звука в фоновом режиме в настройках.

Но, если я перехожу в режим переднего плана / блокировки экрана, Звук воспроизводится, но элементы управления мультимедиа не отображаются.

Iя новичок в реагировать родной, мне нужно настроить элементы управления мультимедиа для фона / состояния экрана блокировки тоже?Или что-то мне нужно сделать, чтобы добиться этого?

  componentDidMount() {
  const { audioURL } = this.state;
  SoundPlayer.playUrl(audioURL);
  }

    playPauseHandler = () => {
    const {
      paused, currentDuration, currentTime, audioSelectedIndex,
    } = this.state;
    console.log('currentDuration', currentDuration);
    console.log('currentTime', currentTime);
    this.getInfo();

    if (paused === true) {
      SoundPlayer.play();
      this.setState({ paused: !paused });
    } else {
      SoundPlayer.pause();
      this.setState({ paused: !paused });
    }
  }

       render() {

          return (

            <View style={styles.audioPlayerContainer}>
              <Image
                style={styles.podcastImage}
                source={{ uri: podcastImage }}
              />
              {/* <Text> {playTime} </Text> */}

              <View style={styles.sliderCloseButtonContainer}>
                <Slider
                  maximumValue={totalLength}
                  step={1}
                  value={currentTime}
                  onSlidingComplete={value => this.onValueChange(value)}
                  style={styles.slider}
                  thumbTintColor=“blue”
                // onSeek={this.seek.bind(this)}
                  trackLength={totalLength}
                // onSlidingStart={() => this.setState({ paused: true })}
                />
              </View>
              <View style={styles.stylesContainer}>
                  {title}
                </TextTicker>
                <TouchableWithoutFeedback onPress={this.playPauseHandler}>
                  <View style={styles.playButton}>
                    <Image source={paused ? res.images.play : 
                   res.images.pause} />
                  </View>
                </TouchableWithoutFeedback>
              </View>
            </View>
            )
            }
         );
      }

enter image description here

Есть предложения?

...