Android Studio中Jetpack Compose TV预览为何显示移动布局而非TV_720p？

可能原因及修复方案 #

1. 检查Android Studio与Compose插件兼容性 #

• 确保Android Studio版本（推荐Electric Eel及以上）和Compose插件版本匹配，旧版本可能存在TV预览适配bug。可通过File > Settings > Plugins查看插件版本，建议升级至最新稳定版。

2. 强制刷新预览配置 #

• 预览面板可能未自动加载新配置，尝试：
  • 点击预览面板右上角的刷新按钮（圆形箭头）重新加载预览。
  • 关闭并重新打开预览面板，或直接重启Android Studio。

3. 验证TV主题配置 #

• 确认ComposeTvTheme是否使用了TV专属的Material组件，避免混用手机端主题：

  @Composable
  fun ComposeTvTheme(content: @Composable () -> Unit) {
      TvMaterialTheme(
          colorScheme = TvColorScheme.default(),
          typography = TvTypography.default(),
          content = content
      )
  }
  

  若主题基于手机端MaterialTheme开发，会导致布局适配逻辑异常。

4. 手动指定预览尺寸 #

• 若设备配置未生效，可在@Preview注解中强制指定TV标准尺寸：

  @Preview(
      device = Devices.TV_720p,
      uiMode = Configuration.UI_MODE_NIGHT_YES,
      widthDp = 1280,
      heightDp = 720
  )
  @Composable
  internal fun VitrineContentViewEmptyStatePreview() {
      ComposeTvTheme {
          /*My Composable*/
      }
  }
  

  TV_720p标准分辨率为1280x720，TV_1080p为1920x1080，手动指定尺寸可确保预览容器正确渲染。

5. 检查模块依赖配置 #

• 确认模块build.gradle已添加TV Compose相关依赖：

  dependencies {
      implementation("androidx.tv:tv-material:1.0.0")
      implementation("androidx.tv:tv-foundation:1.0.0")
      // 其他必要依赖
  }
  

  同时确保compileSdk和targetSdk版本不低于33（TV Compose最低要求）。

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