ExoPlayer issue using AndroidView in LazyColumn Compose

Question

I am trying to have a videoplayer (using ExoPlayer occupying half of the screen's height) at the top of the LazyColumn and list of items below the video player using compose. The list of items redirects to a details screen. I am using navigation compose for these navigations. While trying to add slide up and slide down transition animations between these navigation using Accompanist Navigation Library. I am trying to make details screen slide up when clicked on list item and slide down when popped up. VideoPlayer view at the top is jumping (height seems to be little bigger and then adjusts to the calculated height and specified padding) when coming back to the list screen from the details screen.

I am making everything to be scrollable in the List Screen like in the below image:

Calculated height of the screen using the below code

@Composable
fun ListScreen(navController: NavHostController?){

  val context = LocalContext.current

  val windowMetrics = remember {
           context.resources.displayMetrics
      }

  val screenHeightPx = remember {
        windowMetrics.heightPixels.toFloat()
      }
  val screenHeightDp = remember {
         screenHeightPx / windowMetrics.density
  }
  val videoPlayerHeight = remember {
         screenHeightDp/2
   }
  Box{

   LazyColumn{
     item{
         VideoPlayerViewCompose(videoPlayerHeight)
     }
 
     items(sampleList){sampleItem ->
     ListItemCompose(sampleItem)
  
    }
}

Code of VideoPlayerViewCompose

@Composable
fun VideoPlayerViewCompose(height : float){
Box(modifier = Modifier.height(height.dp){
AndroidView(
     factory = {
          Logger.d { "PlayerView factory created" }
          PlayerView(context).apply {
              hideController()
              useController = false
              player = exoPlayer
              resizeMode = AspectRatioFrameLayout.RESIZE_MODE_ZOOM
              layoutParams = FrameLayout.LayoutParams(MATCH_PARENT, MATCH_PARENT)
              clipToOutline = true
          }
       },
     update = {
     // updating play pause of the video using lifecycleOwner.
      }

Here is my navigation composable using Accompanist Navigation Library

@Composable
fun AppNavigationCompose(){
  val navAnimatedController = rememberAnimatedNavController()

   AnimatedNavHost(
      navController = navAnimatedController,
      startDestination = "list_screen",
      ) {

      composable("list_screen") {
          ListScreen(navAnimatedController)
      }

     composable(
         route = "details_screen/{id}",
         arguments = listOf(
         navArgument(name = "id") {
               type = NavType.IntType
           }
      ),
      enterTransition = { -\>
           slideInVertically(
                 initialOffsetY = { fullHeight -\> 2 \* fullHeight },
                 animationSpec = tweenSpec
             )
           },
     exitTransition = { -\>
           null
         },

     popEnterTransition = { -\>
         null
     },

     popExitTransition = { -\>
          slideOutVertically(
                targetOffsetY = { fullHeight -\> 2 \* fullHeight },
                animationSpec = tweenSpec
               )
            },
      ) { navBackStackEntry -\>
       DetailsScreen(
            listItemId = navBackStackEntry.arguments!!.getInt("id"),
            navController = navAnimatedController
          )
}
}