0

要するに: Android で reacte ネイティブを使用し、ネイティブの VideoView を使用して、Android 用の Google IMA SDK を使用した広告付きの動画を表示します。ビデオが再生され、広告が再生されますが、「続きを読む」と「広告をスキップ」を含む Web ビューは表示されません。ビュー階層に追加されますが、サイズは 0,0 で、子はありません。ネイティブ アプリでまったく同じコードを使用する場合。すべてが期待どおりに機能します。

もう少しコンテキスト：

  • ビデオ プレーヤーと google ima SDK の統合は、google ima サンプル アプリから直接コピーされます。
  • コンポーネントがネイティブ android アプリに配置されると、すべて正常に動作します。
  • ビュー階層を調べると、webview が追加され、サイズが 0,0 であることは明らかです
  • 自分でネイティブ Web ビューを追加すると、完全に正常にレンダリングされます。

React Native コンポーネントからの関連コード:

@SuppressLint("ViewConstructor")
public class ReactVideoViewWithAds extends FrameLayout implements
    LifecycleEventListener {

private VideoPlayerWithAdPlayback mVideoPlayerWithAdPlayback;
private RelativeLayout mCompanionAdSlot;
private VideoPlayerController mVideoPlayerController;

public ReactVideoViewWithAds(ThemedReactContext themedReactContext) {
    super(themedReactContext);
    createViews();
    themedReactContext.addLifecycleEventListener(this);
}

private void createViews() {

    FrameLayout.LayoutParams companionAdLayoutParams = new FrameLayout.LayoutParams(
            FrameLayout.LayoutParams.MATCH_PARENT,
            (int) (50 * getResources().getSystem().getDisplayMetrics().density));
    companionAdLayoutParams.gravity = Gravity.CENTER_HORIZONTAL;
    mCompanionAdSlot = new RelativeLayout(getContext());
    mCompanionAdSlot.setBackgroundColor(Color.BLUE);
    addView(mCompanionAdSlot, companionAdLayoutParams);

    //player with ad playback
    FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(
            FrameLayout.LayoutParams.MATCH_PARENT,
            FrameLayout.LayoutParams.MATCH_PARENT);
    mVideoPlayerWithAdPlayback = new VideoPlayerWithAdPlayback(getContext());
    addView(mVideoPlayerWithAdPlayback, layoutParams);


    initPlayer();
}

private void initPlayer() {
    mVideoPlayerController = new VideoPlayerController(
            getContext(),
            mVideoPlayerWithAdPlayback,
            null,
            null,
            "nl",
            mCompanionAdSlot,
            null);
}
4

1 に答える 1

3

この質問にはコメントで解決策がありました

ネイティブ コンポーネントにビューを動的に追加する場合、react-native が変更を反映するには、レイアウト サイクルを手動でトリガーする必要があるようです。（おそらく、シャドウビューのネイティブ更新に反応することに関連しています）

 @Override
    public void requestLayout() {
        super.requestLayout();
        post(measureAndLayout);
    }

    private final Runnable measureAndLayout = new Runnable() {
        @Override
        public void run() {
            measure(
                    MeasureSpec.makeMeasureSpec(getWidth(), MeasureSpec.EXACTLY),
                    MeasureSpec.makeMeasureSpec(getHeight(), MeasureSpec.EXACTLY));
            layout(getLeft(), getTop(), getRight(), getBottom());
        }
    };
于 2018-02-05T12:43:19.647 に答える