无法在 WebRTC 视频通话中显示本地表面

Question

我正在开发 WebRTC 视频通话安卓应用 但是，本地表面显示在框中，但如果呼叫已连接，则本地视图会移动到远程视图的背面。

显示我的 main.xml 文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">


        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/colorBlack"
            android:gravity="center_horizontal"
            android:orientation="vertical">

            <FrameLayout
                android:id="@+id/rootView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <LinearLayout
                    android:id="@+id/remoteVideoLl"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" />

                <org.webrtc.SurfaceViewRenderer
                    android:id="@+id/localVideo"
                    android:layout_gravity="right"
                    android:translationZ="@dimen/_10sdp"
                    android:layout_marginTop="@dimen/_10sdp"
                    android:layout_marginRight="@dimen/_10sdp"
                    android:layout_width="@dimen/_100sdp"
                    android:layout_height="@dimen/_130sdp" />
            </FrameLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:gravity="center"
                android:padding="@dimen/_10sdp">

                <ImageView
                    android:id="@+id/exit"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_call_cut" />

                <ImageView
                    android:id="@+id/muteAudio"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/_10sdp"
                    android:src="@drawable/ic_microphone_on" />

                <ImageView
                    android:id="@+id/switchCamera"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/_10sdp"
                    android:src="@drawable/ic_camera_rotation" />

                <ImageView
                    android:id="@+id/spickerCall"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/_10sdp"
                    android:layout_marginRight="@dimen/_10sdp"
                    android:src="@drawable/ic_speaker_on" />
                
            </LinearLayout>


        </RelativeLayout>
    </LinearLayout>
</LinearLayout>

启动相机方法

localSurfaceViewRenderer.init(rootEglBase.getEglBaseContext(), null);
localSurfaceViewRenderer.setScalingType(RendererCommon.ScalingType.SCALE_ASPECT_FIT);
localSurfaceViewRenderer.setZOrderMediaOverlay(true);
localSurfaceViewRenderer.setEnableHardwareScaler(false);
localSurfaceViewRenderer.setMirror(true);
localSurfaceViewRenderer.setBackground(null);
webRtcClient.startCamera(localSurfaceViewRenderer,WebRtcClient.FONT_FACTING);
isCameraOpen = true;
webRtcClient.createAndJoinRoom(roomName);

呼叫连接事件

 @Override
public void onAddRemoteStream(String peerId, VideoTrack videoTrack) {
    this.runOnUiThread(new Runnable() {
        @Override
        public void run() {
            SurfaceViewRenderer remoteView = new SurfaceViewRenderer(CallActivity.this);
            remoteView.init(rootEglBase.getEglBaseContext(), null);
            remoteView.setScalingType(RendererCommon.ScalingType.SCALE_ASPECT_FIT);
            remoteView.setZOrderMediaOverlay(true);
            remoteView.setEnableHardwareScaler(false);
            remoteView.setMirror(true);
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(500,500);
            layoutParams.topMargin = 20;
            remoteVideoLl.addView(remoteView,layoutParams);
            remoteViews.put(peerId,remoteView);
            videoTrack.addSink(remoteView);
        }
    });
}

我参考了相同的解决方案，但不能这样做

本地 SurfaceViewRenderer.setZOrderMediaOverlay(true);

Answer 1

将框架布局置于线性布局下方， 试试这个，

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">


        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/colorBlack"
            android:gravity="center_horizontal"
            android:orientation="vertical">

           
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:gravity="center"
                android:padding="@dimen/_10sdp">

                <ImageView
                    android:id="@+id/exit"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_call_cut" />

                <ImageView
                    android:id="@+id/muteAudio"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/_10sdp"
                    android:src="@drawable/ic_microphone_on" />

                <ImageView
                    android:id="@+id/switchCamera"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/_10sdp"
                    android:src="@drawable/ic_camera_rotation" />

                <ImageView
                    android:id="@+id/spickerCall"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/_10sdp"
                    android:layout_marginRight="@dimen/_10sdp"
                    android:src="@drawable/ic_speaker_on" />
                
            </LinearLayout>

            <FrameLayout
                android:id="@+id/rootView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <LinearLayout
                    android:id="@+id/remoteVideoLl"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" />

                <org.webrtc.SurfaceViewRenderer
                    android:id="@+id/localVideo"
                    android:layout_gravity="right"
                    android:translationZ="@dimen/_10sdp"
                    android:layout_marginTop="@dimen/_10sdp"
                    android:layout_marginRight="@dimen/_10sdp"
                    android:layout_width="@dimen/_100sdp"
                    android:layout_height="@dimen/_130sdp" />
            </FrameLayout>

        </RelativeLayout>
    </LinearLayout>
</LinearLayout>