如何在GLSurfaceView上方添加两张各占50%宽的全屏高Base64图片？

我来帮你搞定这个需求！要在GLSurfaceView上方放置两张横屏模式下各占50%宽度、100%高度的图片，同时处理从API获取的Base64格式PNG图片，咱们分三步走：布局调整 + 图片加载逻辑 + 横屏配置。

一、修改RelativeLayout布局 #

你需要在原有的RelativeLayout中，添加一个水平方向的LinearLayout覆盖在GLSurfaceView上方，里面包含两个ImageView，通过layout_weight让它们平分宽度。具体代码如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="me.kevingleason.androidrtc.de.kevingleason...">

    <!-- 原有的GLSurfaceView，保持不变 -->
    <android.opengl.GLSurfaceView
        android:id="@+id/gl_surface_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <!-- 覆盖在GLSurfaceView上方的图片容器 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:weightSum="2">

        <!-- 第一张图片，占50%宽度 -->
        <ImageView
            android:id="@+id/img_left"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:scaleType="fitXY" />

        <!-- 第二张图片，占50%宽度 -->
        <ImageView
            android:id="@+id/img_right"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:scaleType="fitXY" />

    </LinearLayout>

</RelativeLayout>

关键布局说明： #

• LinearLayout的weightSum="2"配合两个ImageView的layout_weight="1"，实现横屏时各占50%宽度。
• android:scaleType="fitXY"让图片拉伸填满ImageView的整个空间，保证高度100%适配。
• LinearLayout和GLSurfaceView都设置为match_parent，由于RelativeLayout中后添加的View层级更高，图片会自动显示在GLSurfaceView上方。

二、处理Base64图片加载逻辑 #

从API获取到PNG格式的Base64字符串后，需要先去除可能的前缀（比如data:image/png;base64,），再解码为Bitmap，最后设置到ImageView中。以下是Java和Kotlin的示例代码：

Java示例： #

import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.util.Base64;
import android.widget.ImageView;

// 解码Base64为Bitmap的工具方法
private Bitmap decodeBase64ToBitmap(String base64Str) {
    // 移除Base64前缀（如果接口返回的字符串带前缀）
    if (base64Str.startsWith("data:image/png;base64,")) {
        base64Str = base64Str.substring("data:image/png;base64,".length());
    }
    // 解码Base64字节数组为Bitmap
    byte[] decodedBytes = Base64.decode(base64Str, Base64.DEFAULT);
    return BitmapFactory.decodeByteArray(decodedBytes, 0, decodedBytes.length);
}

// 调用示例：假设你已经从API拿到两张图片的Base64字符串
String leftImgBase64 = "你的左侧图片Base64字符串";
String rightImgBase64 = "你的右侧图片Base64字符串";

ImageView leftImg = findViewById(R.id.img_left);
ImageView rightImg = findViewById(R.id.img_right);

leftImg.setImageBitmap(decodeBase64ToBitmap(leftImgBase64));
rightImg.setImageBitmap(decodeBase64ToBitmap(rightImgBase64));

Kotlin示例： #

import android.graphics.Bitmap
import android.graphics.BitmapFactory
import android.util.Base64
import android.widget.ImageView

// 解码Base64为Bitmap的工具方法
private fun decodeBase64ToBitmap(base64Str: String): Bitmap {
    // 移除Base64前缀（如果接口返回的字符串带前缀）
    val cleanBase64 = if (base64Str.startsWith("data:image/png;base64,")) {
        base64Str.substring("data:image/png;base64,".length)
    } else {
        base64Str
    }
    // 解码Base64字节数组为Bitmap
    val decodedBytes = Base64.decode(cleanBase64, Base64.DEFAULT)
    return BitmapFactory.decodeByteArray(decodedBytes, 0, decodedBytes.size)
}

// 调用示例：假设你已经从API拿到两张图片的Base64字符串
val leftImgBase64 = "你的左侧图片Base64字符串"
val rightImgBase64 = "你的右侧图片Base64字符串"

val leftImg = findViewById<ImageView>(R.id.img_left)
val rightImg = findViewById<ImageView>(R.id.img_right)

leftImg.setImageBitmap(decodeBase64ToBitmap(leftImgBase64))
rightImg.setImageBitmap(decodeBase64ToBitmap(rightImgBase64))

三、强制横屏设置 #

要确保Activity始终处于横屏模式，可以通过两种方式配置：

1. 在AndroidManifest.xml中静态配置：

<activity
    android:name=".YourActivityName"
    android:screenOrientation="landscape"
    android:configChanges="orientation|screenSize">
</activity>

2. 在代码中动态设置：

// Java
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);

// Kotlin
requestedOrientation = ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE

这样就能完美实现你想要的效果啦！

内容的提问来源于stack exchange，提问作者tigerel