首页 > 解决方案 > 大家好,如何在 React Native Home Button Pressed 上实现 PiP(画中画)视频?我无法在 React Native 中正确显示画中画视频

问题描述

当我按下 android 主页按钮时,通过本机模块播放 pip 视频并传递视频 url 和视频的当前持续时间,并且本机模块接受该参数和意图给 Video Activity。在 Video Activity OnCreate 方法中,我尝试显示 PiP 视频。当我按下在反应本机图标上,画中画模式显示,但我无法返回反应本机视图。当我按下 Android 主页按钮时,画中画模式无法显示。

PiPModule.java

public class PiPModule extends ReactContextBaseJavaModule {

public PiPModule(ReactApplicationContext reactContext){
    super(reactContext);
}

@NonNull
@Override
public String getName() {
    return "PiPModule";
}

@ReactMethod
public void showPiPVideo(String videoURL,int seekToDuration)
{
    Toast.makeText(getReactApplicationContext(),"showPiPVideo is working",Toast.LENGTH_SHORT).show();
    Intent intent = new Intent(getCurrentActivity(), PiPVideoActivity.class);
    intent.putExtra("VIDEO_URL",videoURL);
    intent.putExtra("VIDEO_CURRENT_DURATION",seekToDuration);
    getCurrentActivity().startActivity(intent);
}

}

在 React-Native 组件中的使用

import {NativeModules} from 'react-native'
const pipVideo = NativeModules.PiPModule;
pipVideo.showPiPVideo(videoURL, Math.floor(currentTime) * 1000);

画中画活动

public class PiPVideoActivity extends AppCompatActivity {

private String videoPath;
private int videoDuration;
VideoView myVideoView;

@RequiresApi(api = Build.VERSION_CODES.O)
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_pip_video);

    Intent i = getIntent();

    if(i != null){
        myVideoView = (VideoView) findViewById(R.id.videoView);
        videoPath = i.getStringExtra("VIDEO_URL");
        videoDuration = i.getIntExtra("VIDEO_CURRENT_DURATION",0);
        PlayVideo();
    }
    else{
        Toast.makeText(PiPVideoActivity.this, "VideoURL not found", Toast.LENGTH_SHORT).show();
    }

    PictureInPictureParams params = new PictureInPictureParams
            .Builder()
            .setAspectRatio(new Rational(1,1))
            .build();
    enterPictureInPictureMode(params);

}

private void PlayVideo() {
    try {
        getWindow().setFormat(PixelFormat.TRANSLUCENT);
        Uri video = Uri.parse(videoPath);
        myVideoView.setVideoURI(video);
        myVideoView.requestFocus();
        myVideoView.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
            public void onPrepared(MediaPlayer mp) {
                //seek to receive miliseconds
                myVideoView.seekTo(videoDuration);
                myVideoView.start();
            }
        });

    } catch (Exception e) {
        System.out.println("Video Play Error :" + e.toString());
        finish();
    }

}

}

标签: androidreact-nativeandroid-picture-in-picturereact-native-modules

解决方案


推荐阅读