androidkotlinandroid-fragmentstoolbarshared-element-transition

Toolbar blinks when transitioning from fragment to fragment


I have a toolbar in my parent Activity. There are two children-fragments. When I press the FAB button to transition between fragments, the toolbar blinks. What can I do to fix it? Thank you!

screenshot

Main Activity

XML:

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/ToolbarTheme"
    app:popupTheme="@style/ToolbarTheme"/>
  

Kotlin:

navController = findNavController(R.id.myNavHostFragment)
    setSupportActionBar(findViewById(R.id.toolbar))
    setupActionBarWithNavController(navController)

Fragment A

XML:

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/floatingActionButton"
        android:transitionName="shared_element_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="24dp"
        android:clickable="true"
        android:focusable="true"
        app:elevation="8dp"
        />

Kotlin:

override fun onCreateView(
    inflater: LayoutInflater, container: ViewGroup?,
    savedInstanceState: Bundle?
): View? {
     postponeEnterTransition()
    binding = FragmentListBinding.inflate(inflater, container, false)
    binding.root.doOnPreDraw {
        startPostponedEnterTransition()
    }
    return binding.root

Fragment B

XML:

<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:transitionName="shared_element_container">

Kotlin:

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    sharedElementEnterTransition = MaterialContainerTransform()
    sharedElementReturnTransition = MaterialContainerTransform()
}

Solved: What worked for me is that I deleted my toolbar from main activity and changed the app theme from '(name of theme)'.NoActionBar to '(name of theme)'.DarkActionBar. So I put toolbar in the theme and it solved the problem


Solution

  • What worked for me is that I deleted my toolbar from main activity and changed the app theme from '(name of theme)'.NoActionBar to '(name of theme)'.DarkActionBar. So I put toolbar in the theme and it solved the problem