Enviar el resultado de PictureInPictureModeChanged a un módulo de React Native.

04 Jun, 2023 Programación 0

Estoy tratando de hacer un modo de imagen sobre imagen utilizando react-native. Escribí un módulo de react.

Necesito generar algo similar a esto, pero dentro del módulo react native.

public class MainActivity extends AppCompatActivity {
    private PlayerView playerView;
    private Player player;
    private boolean playerShouldPause = true;
    ...

    @Override
    public void onPictureInPictureModeChanged(boolean isInPictureInPictureMode, Configuration newConfig) {
        super.onPictureInPictureModeChanged(isInPictureInPictureMode, newConfig);

        // Ocultando ActionBar
        if (isInPictureInPictureMode) {
            getSupportActionBar().hide();
        } else {
            getSupportActionBar().show();
        }
        playerView.onPictureInPictureModeChanged(isInPictureInPictureMode, newConfig);
    }
    ...
}

Hay alguna manera de hacerlo de la misma manera, pero dentro de ReactContextBaseJavaModule.

public class ReactNativeBitmovinPlayerModule extends ReactContextBaseJavaModule {
…

@Override
public void onPictureInPictureModeChanged(boolean isInPictureInPictureMode, Configuration newConfig) {
    super.onPictureInPictureModeChanged(isInPictureInPictureMode, newConfig);

    // Ocultando ActionBar
    if (isInPictureInPictureMode) {
        getSupportActionBar().hide();
    } else {
        getSupportActionBar().show();
    }
    playerView.onPictureInPictureModeChanged(isInPictureInPictureMode, newConfig);
}
...

}
“`

davy.ai

June 4, 2023 at 4:00 pm

Desafortunadamente, no es posible utilizar el código anterior directamente en un ReactContextBaseJavaModule porque extiende una clase diferente a MainActivity. Sin embargo, aún puede lograr la funcionalidad de imagen en imagen en React Native utilizando la API de PictureInPicture proporcionada por Android.

Primero, debe agregar el siguiente permiso a su AndroidManifest.xml:

<uses-permission android:name="android.permission.RECORD_AUDIO"></uses-permission>

Luego, en su módulo React Native, puede usar el modo PictureInPicture de manera similar como se muestra en el fragmento de código a continuación:

import android.app.PictureInPictureParams;
import android.os.Build;
import android.util.Rational;
import android.widget.VideoView;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

public class ReactNativeCustomModule extends ReactContextBaseJavaModule {
    private VideoView mVideoView;
    private PictureInPictureParams.Builder mPictureInPictureParamsBuilder;

    public ReactNativeCustomModule(ReactApplicationContext reactContext) {
        super(reactContext);
        mPictureInPictureParamsBuilder = new PictureInPictureParams.Builder();
    }

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

    @ReactMethod
    public void enterPictureInPictureMode() {
        // Verifique si la API está disponible
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
            Rational aspectRatio = new Rational(mVideoView.getWidth(), mVideoView.getHeight());
            mPictureInPictureParamsBuilder.setAspectRatio(aspectRatio);
            // Agregue opciones adicionales según sea necesario, como el comportamiento de la aplicación cuando se ingresa/sale del modo PIP.
            PictureInPictureParams params = mPictureInPictureParamsBuilder.build();
            getActivity().enterPictureInPictureMode(params);
        }
    }

    @ReactMethod
    public void exitPictureInPictureMode() {
        getActivity().exitPictureInPictureMode();
    }
}

Tenga en cuenta que el método enterPictureInPictureMode se llama cuando desea ingresar al modo PictureInPicture, y el método exitPictureInPictureMode se llama cuando desea salir. Además, deberá actualizar este módulo para que funcione con su caso de uso particular, como usar su instancia de reproductor Bitmovin en lugar de un VideoView.

es.davy.ai

¿Tienes una pregunta?

Enviar el resultado de PictureInPictureModeChanged a un módulo de React Native.

Answer

davy.ai