Closed lilemma closed 6 months ago
Given the usage of compose, this looks like a duplicate of #1237
You are right, the device is also running version AP1A.240305.019.A1
@lilemma, would it be possibly for you to provide full implementation of your MainActivity.kt AND the test media?
On the outset, @icbaker is right and that does look like a duplicate candidate for the issue we've been seeing with Interop Compose (AndroidView) and SurfaceView/AspectRatioFrameLayout interaction. However, we've had a bunch of cases where the rendering of the video can be fixed with correct Modifier
s, layout parameters and remember
-ing.
@oceanjules Thanks for the response.
I have a snippet of our MainActivity, MainScreen and NavigationGraph, but I think it will be way to complicated to supply all the implementation from MainActivity to our Player implementation, there are multiple composables, compose-destinations and verticalPager in between.
You mentioned AspectRatioFrameLayout, and I tried changing from AspectRatioFrameLayout.RESIZE_MODE_ZOOM
to AspectRatioFrameLayout.RESIZE_MODE_FILL
it works, but it's just not the resizeMode I need.
Also when I experience the issue, my VideoPlayer is inside a VerticalPager, and when I drag down just a bit, the view gets redrawn, and it shows correctly.
If I replace my VerticalPager with a Box, I still experience the rendering issue, so I don't believe it's related to the VerticalPager.
We are using the same VideoPlayer implementation multiple places in the app. When I test the video in one of our implementations which uses a specific aspectRatio and graphicsLayer for the container, it renders as it should.
BoxWithConstraints(
modifier = Modifier
.align(Alignment.Center)
.fillMaxWidth()
.aspectRatio(3 / 4f)
.graphicsLayer {
scaleX = scale.value
scaleY = scale.value
translationX = x.value
translationY = y.value
}
) {
It feels like there is a rendering order issue related to the RESIZE_MODE_ZOOM and aspect ratio
Please let me know if you need more details :)
MainActivity.kt
override fun onCreate(savedInstanceState: Bundle?) {
installSplashScreen()
super.onCreate(savedInstanceState)
onNewIntent(intent)
if (DeviceProperties.isTablet(resources)) {
requestedOrientation = ActivityInfo.SCREEN_ORIENTATION_FULL_SENSOR
}
if (Build.VERSION.SDK_INT in 21..29) {
window.statusBarColor = Color.TRANSPARENT
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
window.decorView.systemUiVisibility = SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN or SYSTEM_UI_FLAG_LAYOUT_STABLE
WindowCompat.setDecorFitsSystemWindows(window, false)
} else if (Build.VERSION.SDK_INT >= 30) {
window.statusBarColor = Color.TRANSPARENT
WindowCompat.setDecorFitsSystemWindows(window, false)
}
setContent {
val bottomSheetNavigator = rememberBottomSheetNavigator(skipHalfExpanded = true)
navController = rememberNavController(bottomSheetNavigator)
MainScreen(mainViewModel, navController, bottomSheetNavigator)
}
}
}
---
MainScreen.kt
@OptIn(ExperimentalAnimationApi::class, ExperimentalComposeUiApi::class)
@Composable
fun MainScreen(
viewModel: MainViewModel,
navController: NavHostController,
bottomSheetNavigator: BottomSheetNavigator
) {
val scaffoldState = rememberScaffoldState()
AppTheme {
// Initialization
val systemUiController = rememberSystemUiController()
SideEffect {
systemUiController.setSystemBarsColor(Color.Transparent, darkIcons = true)
systemUiController.setNavigationBarColor(AppColor.sand20, darkIcons = true)
systemUiController.setStatusBarColor(Color.Transparent, darkIcons = true) { Color.Transparent }
}
com.google.accompanist.navigation.material.ModalBottomSheetLayout(
bottomSheetNavigator = bottomSheetNavigator,
sheetShape = RoundedCornerShape(10.dp, 10.dp, 0.dp, 0.dp),
modifier = Modifier
.navigationBarsPadding()
.imePadding()
.semantics {
testTagsAsResourceId = true
},
) {
Scaffold(
modifier = Modifier.semantics {
testTagsAsResourceId = true
},
scaffoldState = scaffoldState,
snackbarHost = { scaffoldState.snackbarHostState },
bottomBar = { BottomBar(hiltViewModel(), navController) }
) {
NavigationGraph(
navController = navController,
mainViewModel = viewModel,
startDestination = MediaGalleryScreenDestination
)
bottomSheetNavigator.popBackStack()
}
}
}
}
--
NavigationGraph.kt
@OptIn(ExperimentalMaterialNavigationApi::class)
@ExperimentalAnimationApi
@Composable
fun NavigationGraph(
navController: NavHostController,
mainViewModel: MainViewModel,
startDestination: TypedDestination<*>
) {
val navHostEngine = rememberAnimatedNavHostEngine(
rootDefaultAnimations = horizontalScreenTransitions,
)
DestinationsNavHost(
navGraph = NavGraphs.root,
startRoute = startDestination,
modifier = Modifier
.fillMaxSize()
.background(AppColor.sand10),
engine = navHostEngine,
navController = navController,
dependenciesContainerBuilder = {
},
manualComposableCallsBuilder = {
}
)
}
Version
Media3 main branch
More version details
Hi, I am having issues using the ExoPlayer. I don't believe we always had the issue, but we started experiencing the video not rendering fully.
The screenshots from a Pixel 7 Pro shows the video rendering black when the app is in foreground, and rendering transparent when the app moves to background.
Those devices where the bug does not appear, it always gets rendered correctly.
I have not been able to reproduce the issue in the demo app.
Implementation
Log from the app while the bug occurred: