如何让SceneView中的TextView始终显示在3D模型上方？

在Android中使用SceneView渲染3D模型时，顶部的TextView会被3D模型覆盖——即使在FrameLayout中TextView位于SceneView之后、添加了elevation属性，甚至调用sceneView.setZOrderMediaOverlay(true)都无法解决。以下是可行的解决方法：

核心原因 #

SceneView继承自SurfaceView，其渲染的Surface默认层级高于普通View组件，导致TextView被Surface覆盖，常规的View层级属性（如elevation）无法生效。

解决方案 #

1. 调整SceneView的Z轴渲染顺序 #

通过代码将SceneView的Surface层级调整到普通View之下：

sceneView.setZOrderOnTop(false);
sceneView.setZOrderMediaOverlay(false);

2. 优化TextView的层级属性 #

用translationZ替代elevation来确保TextView处于上层（translationZ直接控制View的绘制顺序，对SurfaceView上层的View更有效），同时给SceneView设置透明背景避免遮挡：

<FrameLayout
    android:id="@+id/frameLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <io.github.sceneview.SceneView
        android:id="@+id/sceneView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/transparent"/>

    <TextView
        android:id="@+id/topView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="This view is on top of the SceneView!"
        android:textSize="24sp"
        android:textColor="#FFFFFF"
        android:background="#88000000"
        android:translationZ="10dp"/>

</FrameLayout>

3. 调整模型的3D位置（可选） #

如果模型离相机过近导致视觉上覆盖文本，可以调整模型的Z轴位置让其远离相机：

val modelNode = ModelNode(
    position = Position(z = -1.0f), // Z轴负数表示远离相机
    rotation = Rotation(x = 0.0f),
)

完整修改后的Java代码示例 #

ModelRenderable.builder()
    .setSource(
        activity,
        Uri.parse(file.toString())
    )
    .setIsFilamentGltf(true)
    .build(lifecycle)
    .thenAccept { modelRenderable ->
    }
    .exceptionally { throwable ->
        val toast = Toast.makeText(
            activity,
            "Unable to load model ".plus(name),
            Toast.LENGTH_LONG
        )
        toast.setGravity(Gravity.CENTER, 0, 0)
        toast.show()
        null
    }

// 调整SceneView的Z轴顺序
sceneView.setZOrderOnTop(false);
sceneView.setZOrderMediaOverlay(false);

val modelNode = ModelNode(
    position = Position(z = -1.0f),
    rotation = Rotation(x = 0.0f),
)

sceneView.addChild(modelNode)

lifecycleScope.launchWhenCreated {
    modelNode.loadModel(
        context = activity,
        lifecycle = lifecycle,
        glbFileLocation = "https://sceneview.github.io/assets/models/MaterialSuite.glb",
        scaleToUnits = 1.1f,
        autoAnimate = false,
        centerOrigin = Position(x = 0.0f, y = 0.0f, z = 0f)
    )
}

内容的提问来源于stack exchange，提问作者Amro Shekh Zain