Feature/android pip #1776

matejpolak · 2019-09-30T12:45:56Z

Provide an example of how to test the change

In order to test this change, you should follow all new steps listed in readme under picureInPicture props:

Add following to the AndroidManifest.xml -> MainActivity:

  android:configChanges="keyboard|keyboardHidden|orientation|screenSize|screenLayout"
  android:resizeableActivity="true"
  android:supportsPictureInPicture="true"

Enable PIP feature for you app in your device settings
Add following methods to MainActivity:

    // To let JS knows about PIP mode change. 
    override fun onPictureInPictureModeChanged(isInPictureInPictureMode: Boolean, newConfig: Configuration?) {
       super.onPictureInPictureModeChanged(isInPictureInPictureMode, newConfig)
       val intent = Intent("onPictureInPictureModeChanged")
       intent.putExtra("isInPictureInPictureMode", isInPictureInPictureMode)
       this.sendBroadcast(intent)
    }
    
    // To trigger PIP mode by pressing `Home` or `Recent` buttons
    override fun onUserLeaveHint() {
       val intent = Intent("onUserLeaveHint")
       this.sendBroadcast(intent)
       super.onUserLeaveHint()
    }
        
    // To close and kill the app when closing PIP window.
    override fun onStop() {
       super.onStop()
       finishAndRemoveTask()
    }

Afterwards, set `pictureInPicture` prop, or press Home/Recent HW button.

Describe the changes

So far PIP mode has been supported only on iPad. From now on, it should be working also on all Android Phones and Tablets running Oreo at least. This implementation includes:

Ability to toggle PIP mode by setting pictureInPicture prop.
onPictureInPictureStatusChanged prop callback returning PIP state same as iOS does.
Ability to turn on PIP mode by pressing Home/Recent HW button.
Previous / Pause/Play / Next PIP window buttons.
Implementation of closing and killing the entire app when closing PIP window.

# Conflicts: # CHANGELOG.md # android-exoplayer/build.gradle # android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java # package.json

android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java

dylancom · 2020-09-14T14:47:05Z

Why isn't this merged yet?

Spoutnik97 · 2020-09-18T13:12:12Z

Hi !
Is there an update of the pull request ?

matejpolak · 2020-09-23T11:21:54Z

Hello everyone, let me take a look at this PR again, solve the conflicts, and then we are ready for reviews and eventually for merging. Anyways I would need someone to give a green light.

I think I should be able to get back to this somewhere this week.

mbrimmer83 · 2020-10-14T13:32:04Z

Hi,
Any updates on this pull request?
Thanks

michael-kiley-verified · 2020-11-13T14:16:33Z

Hi all,
This looks like good work and is a feature I would really love to get access to. Is this still active?
Thanks!

KingAmo · 2021-03-05T08:39:15Z

@nickfujita what do you think about this pr

victoromarques · 2021-05-16T14:27:17Z

How do I apply this change to my project? how do i install this update?

jrhager84 · 2022-04-23T02:02:59Z

How do we implement this in our react-native-video projects? It seems to be great. Why hasn't this been merged?

hueniverse · 2022-04-23T05:01:44Z

I automatically closed PRs and issues that were stale. We can reopen if there is interest and resources to review and test. If you are interested in helping getting this PR through, I'm happy to reopen. Merging this would require 3 people to review, test, and approve it.

jrhager84 · 2022-04-23T05:22:27Z

I automatically closed PRs and issues that were stale. We can reopen if there is interest and resources to review and test. If you are interested in helping getting this PR through, I'm happy to reopen. Merging this would require 3 people to review, test, and approve it.

I would, actually. I'll see if I can carve some time. 😎👍

freeboub · 2022-04-23T11:39:05Z

Code looks good, but I am afraid this change is not really expected in react-native-video...
I agree this is a must have feature ! :)
But pip is not be linked to react-native-video (google maps also supports pip)
I have just publish a fork of rn-android-pip here: https://github.com/iFeelSmart/rn-android-pip/
With this project I am able to use pip in any app (including react-native-video).

For exemple, if tomorrow you want to do pip with react-native-youtube, (https://www.npmjs.com/package/react-native-youtube) you can have issues to make multiple pip handling bindings ...

jrhager84 · 2022-04-23T16:20:35Z

Code looks good, but I am afraid this change is not really expected in react-native-video... I agree this is a must have feature ! :) But pip is not be linked to react-native-video (google maps also supports pip) I have just publish a fork of rn-android-pip here: https://github.com/iFeelSmart/rn-android-pip/ With this project I am able to use pip in any app (including react-native-video).

For exemple, if tomorrow you want to do pip with react-native-youtube, (https://www.npmjs.com/package/react-native-youtube) you can have issues to make multiple pip handling bindings ...

What about pip for ios? Wouldn't react native youtube support that as well? In my mind it would make sense to handle pip in rn video because it also supports ios.

freeboub · 2022-04-23T17:29:56Z

I agree that ios pip is already handle by react-native-video so it make sens to support it on android.
For react-native-youtube, i don.t think they support...
I just want to highlight it can cause conflicts with other implementations...

freeboub · 2022-04-23T17:33:02Z

In other words, it is very useful for quick integration, but it doesn't fullfil all expected requirements of an advanced android application :)

jrhager84 · 2022-04-23T18:45:31Z

In other words, it is very useful for quick integration, but it doesn't fullfil all expected requirements of an advanced android application :)

What advanced requirements are you referring to? Is it something that other package can do? Maybe I just don't know enough about android pip to weigh in.

TomMichalkevic · 2022-04-24T08:20:19Z

I'll make some time to test this tomorrow ;) Let's get this reviewed and merged.

TomMichalkevic · 2022-04-25T10:48:17Z

So I've tested it a bit and I'm not sure it works the way it should:

The app crashes now each time there is an attempt to play any video with the added pictureInPicture prop.
If I remove the prop, it works fine. As in, no PiP, but playback works again.

TomMichalkevic · 2022-04-25T10:59:42Z

android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java

+                && packageManager
+                .hasSystemFeature(
+                        PackageManager.FEATURE_PICTURE_IN_PICTURE)) {
+            long videoPosition = player.getCurrentPosition();


This line should be removed. The variable is not used anywhere and causes crashes.

TomMichalkevic · 2022-04-25T11:04:44Z

With the line removed above it continues on working, but the PiP floating window disappears.
Here's what I get from logcat:
MainActivity has leaked window DecorView@ca3e234[] that was originally added here at android.view.ViewRootImpl.<init>(ViewRootImpl.java:733) at android.view.ViewRootImpl.<init>(ViewRootImpl.java:717) at android.view.WindowManagerGlobal.addView(WindowManagerGlobal.java:399) at android.view.WindowManagerImpl.addView(WindowManagerImpl.java:109) at android.app.ActivityThread.handleResumeActivity(ActivityThread.java:4535) at android.app.servertransaction.ResumeActivityItem.execute(ResumeActivityItem.java:52) at android.app.servertransaction.TransactionExecutor.executeLifecycleState(TransactionExecutor.java:176) at android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:97) at android.app.ActivityThread$H.handleMessage(ActivityThread.java:2066) at android.os.Handler.dispatchMessage(Handler.java:106) at android.os.Looper.loop(Looper.java:223) at android.app.ActivityThread.main(ActivityThread.java:7656) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:592) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:947)

hueniverse · 2022-04-26T05:21:47Z

@TomMichalkevic Thanks for the review.

@matejpolak Are you still interested in getting this meged?

paulohc · 2022-07-07T13:20:35Z

Hello @hueniverse!
Is there still any chance to reopen and merge this PR?

hueniverse · 2022-07-14T05:38:58Z

@paulohc there is no point to reopen it because it needs to be rebased. If you want to do the work and open a new PR with these changes against master, it will get reviewed. Someone needs to do the work.

watadarkstar · 2023-06-01T21:40:33Z

Here is the Java code for anyone who needs it as the instructions were written in Kotlin for the MainActivity:

import android.content.Intent;
import android.content.res.Configuration;

...
    
@Override
protected void onStop() {
    super.onStop();
    finishAndRemoveTask();
}

@Override
protected void onUserLeaveHint() {
    super.onUserLeaveHint();
    Intent intent = new Intent("onUserLeaveHint");
    this.sendBroadcast(intent);
}

@Override
public void onPictureInPictureModeChanged(boolean isInPictureInPictureMode, Configuration newConfig) {
    super.onPictureInPictureModeChanged(isInPictureInPictureMode, newConfig);
    Intent intent = new Intent("onPictureInPictureModeChanged");
    intent.putExtra("isInPictureInPictureMode", isInPictureInPictureMode);
    this.sendBroadcast(intent);
}

Daniel Mariño and others added 9 commits September 8, 2019 08:32

5.0.2

367031b

fix readme

00b3eda

Added a PIP support for Android

db9bc3f

Added another receiver

d9fc905

Added mediaSession extension to enable PIP controls.

ebc7b1b

ReadMe + changelog

8312fa3

readme change

42f9803

Merge branch 'react-native-video/master' into feature/android-pip

8c05762

# Conflicts: # CHANGELOG.md # android-exoplayer/build.gradle # android-exoplayer/src/main/java/com/brentvatne/exoplayer/ReactExoplayerView.java # package.json

Added PR link into the changelog

38e2e7a

CHaNGeTe requested review from cobarx, benoitdion, ashnfb and n1ru4l September 30, 2019 12:49

benoitdion reviewed Sep 30, 2019

View reviewed changes

Entering PIP mode on leave is now PROP driven + Unregistering receivers.

8cc54f7

CHaNGeTe added Platform: Android feature ExoPlayer labels Oct 1, 2019

matejpolak added 2 commits October 1, 2019 22:26

A little fix of video resuming while entering pip mode.

6833de7

Removed mediaSession related things

11ff5f4

matejpolak requested a review from benoitdion October 2, 2019 10:16

matejpolak added the needs review label Nov 14, 2019

matejpolak mentioned this pull request Dec 18, 2019

How to do Picture in Picture for android in this library. Thanks #1841

Closed

hueniverse added stale Closed due to inactivity or lack or resources and removed ExoPlayer labels Apr 22, 2022

hueniverse closed this Apr 22, 2022

hueniverse reopened this Apr 23, 2022

hueniverse removed request for benoitdion, cobarx, n1ru4l and ashnfb April 23, 2022 07:35

hueniverse added 3 labels Apr 23, 2022

TomMichalkevic reviewed Apr 25, 2022

View reviewed changes

hueniverse closed this May 21, 2022

paulohc mentioned this pull request Jul 6, 2022

React Native Video Picture In Picture for Android #2621

Open

bulkinav mentioned this pull request Oct 5, 2023

[Project. Status] Version 6.0.0-alpha #2723

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feature/android pip #1776

Feature/android pip #1776

matejpolak commented Sep 30, 2019

dylancom commented Sep 14, 2020

Spoutnik97 commented Sep 18, 2020

matejpolak commented Sep 23, 2020

mbrimmer83 commented Oct 14, 2020

michael-kiley-verified commented Nov 13, 2020

KingAmo commented Mar 5, 2021

victoromarques commented May 16, 2021

jrhager84 commented Apr 23, 2022

hueniverse commented Apr 23, 2022

jrhager84 commented Apr 23, 2022

freeboub commented Apr 23, 2022

jrhager84 commented Apr 23, 2022 •

edited

Loading

freeboub commented Apr 23, 2022

freeboub commented Apr 23, 2022

jrhager84 commented Apr 23, 2022

TomMichalkevic commented Apr 24, 2022

TomMichalkevic commented Apr 25, 2022 •

edited

Loading

TomMichalkevic Apr 25, 2022

TomMichalkevic commented Apr 25, 2022 •

edited

Loading

hueniverse commented Apr 26, 2022

paulohc commented Jul 7, 2022

hueniverse commented Jul 14, 2022

watadarkstar commented Jun 1, 2023 •

edited

Loading

Feature/android pip #1776

Feature/android pip #1776

Conversation

matejpolak commented Sep 30, 2019

Provide an example of how to test the change

Afterwards, set pictureInPicture prop, or press Home/Recent HW button.

Describe the changes

dylancom commented Sep 14, 2020

Spoutnik97 commented Sep 18, 2020

matejpolak commented Sep 23, 2020

mbrimmer83 commented Oct 14, 2020

michael-kiley-verified commented Nov 13, 2020

KingAmo commented Mar 5, 2021

victoromarques commented May 16, 2021

jrhager84 commented Apr 23, 2022

hueniverse commented Apr 23, 2022

jrhager84 commented Apr 23, 2022

freeboub commented Apr 23, 2022

jrhager84 commented Apr 23, 2022 • edited Loading

freeboub commented Apr 23, 2022

freeboub commented Apr 23, 2022

jrhager84 commented Apr 23, 2022

TomMichalkevic commented Apr 24, 2022

TomMichalkevic commented Apr 25, 2022 • edited Loading

TomMichalkevic Apr 25, 2022

Choose a reason for hiding this comment

TomMichalkevic commented Apr 25, 2022 • edited Loading

hueniverse commented Apr 26, 2022

paulohc commented Jul 7, 2022

hueniverse commented Jul 14, 2022

watadarkstar commented Jun 1, 2023 • edited Loading

Afterwards, set `pictureInPicture` prop, or press Home/Recent HW button.

jrhager84 commented Apr 23, 2022 •

edited

Loading

TomMichalkevic commented Apr 25, 2022 •

edited

Loading

TomMichalkevic commented Apr 25, 2022 •

edited

Loading

watadarkstar commented Jun 1, 2023 •

edited

Loading