ConstraintLayout中TextView与YouTubePlayerFragment共存时不可见问题求助

嘿，这个问题我之前帮人排查过，大概率是YouTubePlayerFragment的视图层级特性在搞鬼！因为YouTubePlayer默认用的是SurfaceView，这种视图是直接在系统Window的Surface层绘制的，优先级比普通TextView这类View的Canvas绘制要高，哪怕你在布局里把TextView写在Fragment前面，它也会被SurfaceView给盖住，看起来就像设置了invisible一样。

下面给你几个可行的解决方案，按优先级排序：

1. 给TextView提升Z轴层级（最快见效） #

在ConstraintLayout里，普通View的Z轴顺序是按布局声明的先后，但SurfaceView不吃这套。咱们直接给TextView设置android:elevation属性，让它在Z轴上“飘”在YouTubePlayer上面：

<TextView
    android:id="@+id/video_title"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="你的视频标题"
    android:textColor="#FFFFFF"
    android:background="#80000000" <!-- 加个半透明背景方便确认显示 -->
    android:elevation="4dp" <!-- 关键属性，数值不用太大，比默认高就行 -->
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent" />

如果你的项目是Android 5.0以下（现在很少见了），可以用android:translationZ替代elevation，效果是一样的。

2. 切换YouTubePlayer到TextureView模式 #

SurfaceView的层级问题是天生的，咱们可以让YouTubePlayer改用TextureView来渲染，它是在普通View层级里绘制的，不会出现遮挡问题。不过这个需要在代码初始化的时候设置：

// 假设你是通过Fragment获取的Player
YouTubePlayerFragment playerFragment = (YouTubePlayerFragment) getFragmentManager().findFragmentById(R.id.youtube_fragment);
playerFragment.initialize("你的YouTube API Key", new YouTubePlayer.OnInitializedListener() {
    @Override
    public void onInitializationSuccess(YouTubePlayer.Provider provider, YouTubePlayer player, boolean wasRestored) {
        // 尝试切换到TextureView模式
        if (provider instanceof YouTubePlayerView) {
            ((YouTubePlayerView) provider).setUseTextureView(true);
        }
        player.loadVideo("你的视频ID");
    }

    @Override
    public void onInitializationFailure(YouTubePlayer.Provider provider, YouTubeInitializationResult errorReason) {
        // 初始化失败的处理逻辑
    }
});

注意：这个方法依赖YouTube SDK的版本，部分旧版本可能不支持，建议先检查你的SDK文档。

3. 用FrameLayout包裹两者（更直观的层级管理） #

把TextView和YouTubePlayerFragment放进一个FrameLayout里，FrameLayout的子View默认是后声明的在上面。配合elevation使用，层级关系会更清晰：

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

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent">

        <!-- YouTubeFragment放在前面 -->
        <fragment
            android:id="@+id/youtube_fragment"
            android:name="com.google.android.youtube.player.YouTubePlayerFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <!-- TextView放在后面，配合elevation确保在上面 -->
        <TextView
            android:id="@+id/video_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="你的视频标题"
            android:textColor="#FFFFFF"
            android:background="#80000000"
            android:elevation="4dp" />
    </FrameLayout>

</android.support.constraint.ConstraintLayout>

4. 排除基础问题 #

最后快速排查下有没有低级错误：

• 检查TextView的文字颜色是否和背景色一致（比如白色文字在白色背景上，看起来就是“看不见”）
• 确认ConstraintLayout的约束是否正确，比如TextView是否真的被约束在Fragment上方，有没有被设置成match_parent高度导致被挤压
• 给TextView设置一个明显的背景色（比如红色），看看是否能显示，确认它的位置是否正确

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