React-Native ScrollView Implementation

Android Sdk

Add PrimisPlayer to a react-native application as a Native UI Component

πŸ“˜

Note

Please remember to add PrimisPlayer SDK and IMA SDK to your Android Studio project as described above

Create an RCTViewManager for PrimisPlayer

import android.widget.FrameLayout;

import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.SimpleViewManager;
import com.facebook.react.uimanager.ThemedReactContext;

import java.util.ArrayList;
import java.util.List;

import tech.primis.player.PrimisPlayer;

public class PrimisPlayerViewManager extends SimpleViewManager<PrimisPlayer> {

    private final ReactApplicationContext context;

    public PrimisPlayerViewManager(ReactApplicationContext reactContext) {
        this.context = reactContext;
    }

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

    @NonNull
    @NotNull
    @Override
    protected PrimisPlayer createViewInstance(@NonNull @NotNull ThemedReactContext reactContext) {

        // Initialize the player
        PrimisPlayer player = new PrimisPlayer(reactContext);

        // Adding a flow parent as described above
        FrameLayout flowParent = new FrameLayout(reactContext.getReactApplicationContext());
        FrameLayout.LayoutParams flowParentLp =
                new FrameLayout.LayoutParams(
                        FrameLayout.LayoutParams.MATCH_PARENT,
                        FrameLayout.LayoutParams.MATCH_PARENT
                );

        reactContext.getCurrentActivity().addContentView(flowParent, flowParentLp);

        List<PrimisPlayer.param> params = new ArrayList<>();
        params.add(new PrimisPlayer.param("placementId", "YOUR_PLACEMENT_ID")); 
        params.add(new PrimisPlayer.param("flowParent", flowParent));

        player.setConfig(params);

         player.add();

        return player;
    }
}

Create a native component

// PrimisPlayerView.js
 
import { requireNativeComponent } from 'react-native';
 
module.exports = requireNativeComponent('PrimisPlayerViewManager');

Add Primis Player view to your page

// App.js

import PrimisPlayerView from './PrimisPlayerView.js';

 . . .
 
<PrimisPlayerView/>