react-native-video, video in mkv format goes black but the sound is heard

214 Views Asked by At

I am developing an application capable of playing an IPTV list. All the contents are in mkv format and most are reproduced correctly but in some, the image remains black while the sound is heard.

This is the metadata of the video:

{
  "audioTracks": Array [
    Object {
      "bitrate": "",
      "index": 0,
      "language": "and",
      "title": "2",
      "type": "audio/mpeg",
    },
  ],
  "canPlayFastForward": true,
  "canPlayReverse": true,
  "canPlaySlowForward": true,
  "canPlaySlowReverse": true,
  "canStepBackward": true,
  "canStepForward": true,
  "currentTime": 0,
  "duration": 7097.049,
  "naturalSize": Object {
    "height": 0,
    "orientation": "portrait",
    "width": 0,
  },
  "textTracks": Array [],
  "trackId": "-1",
  "videoTracks": Array [
    Object {
      "bitrate": 0,
      "codecs": "",      "height": 404,
      "trackId": "1",
      "width": 720,
    },
  ],
}

This is the code I use with the react-native-video library:

<Video
        key={keyload}
        ref={(ref) => {setVideo(ref)}}
        style={styles.video}
        onLoad={(data) => setMetadata(data)}//
        source={{
          URI: uriLoad, initOptions: ['--codec=avcodec']
        }}
        onProgress={progress => {setProgress(progress.currentTime)}}
        controls={false}
        fullscreen={true}
        paused={paused}
        volume={volumen}
        fullscreenAutorotate={true}
        selectedVideoTrack={videoTrack}
        selectedAudioTrack={audioTrack}
        selectedTextTrack={textTrack}
        resizeMode={resizemode}
        onEnd={() => end()}
        isLooping 
        onError={error => playerError(error)}
        onPlaybackStatusUpdat
        allowsExternalPlayback
        e={status => setStatus(() => status)}//setStatus(() => status)
    />

package.json

{
  "name": "someiptv",
  "version": "1.0.0",
  "scripts": {
    "start": "expo start --dev-client",
    "android": "expo run:android",
    "ios": "expo run: ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@react-native-community/slider": "4.2.3",
    "@react-navigation/native": "^6.0.12",
    "@react-navigation/native-stack": "^6.8.0",
    "expo": "~46.0.9",
    "expo-av": "~12.0.4",
    "expo-font": "~10.2.0",
    "expo-linear-gradient": "~11.4.0",
    "expo-screen-orientation": "~4.3.0",
    "expo-splash-screen": "~0.16.2",
    "expo-sqlite": "~10.3.0",
    "expo-status-bar": "~1.4.0",
    "lodash.filter": "^4.6.0",
    "react": "18.0.0",
    "react-dom": "18.0.0",
    "react-native": "0.69.5",
    "react-native-marquee": "^0.4.0",
    "react-native-paper": "^5.0.0-rc.4",
    "react-native-safe-area-context": "4.3.1",
    "react-native-screens": "~3.15.0",
    "react-native-system-setting": "^1.7.6",
    "react-native-video": "^6.0.0-alpha.3",
    "react-native-web": "~0.18.7",
    "react-navigation": "^4.4.4"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9"
  },
  "private": true
}

I have tried with different versions of the library and with different buffer configurations, but nothing works. Does anyone know why this error occurs and how to fix it? Thanks.

0

There are 0 best solutions below