Add Transition Demo

samples/android/src/main/AndroidManifest.xml

@@ -22,6 +22,7 @@
         <activity android:name=".basicNavigation.BasicNavigationActivity"/>
         <activity android:name=".tabNavigation.TabNavigationActivity"/>
         <activity android:name=".nestedNavigation.NestedNavigationActivity"/>
+        <activity android:name=".transition.TransitionActivity"/>
         <activity android:name=".parcelableScreen.ParcelableActivity"/>
         <activity android:name=".screenModel.ScreenModelActivity"/>
         <activity android:name=".androidViewModel.AndroidViewModelActivity"/>

samples/android/src/main/java/cafe/adriel/voyager/sample/SampleActivity.kt

@@ -32,6 +32,7 @@ import cafe.adriel.voyager.sample.rxJavaIntegration.RxJavaIntegrationActivity
 import cafe.adriel.voyager.sample.screenModel.ScreenModelActivity
 import cafe.adriel.voyager.sample.stateStack.StateStackActivity
 import cafe.adriel.voyager.sample.tabNavigation.TabNavigationActivity
+import cafe.adriel.voyager.sample.transition.TransitionActivity
 
 class SampleActivity : ComponentActivity() {
 
@@ -58,6 +59,7 @@ class SampleActivity : ComponentActivity() {
                 StartSampleButton<TabNavigationActivity>("Tab Navigation")
                 StartSampleButton<BottomSheetNavigationActivity>("BottomSheet Navigation")
                 StartSampleButton<NestedNavigationActivity>("Nested Navigation")
+                StartSampleButton<TransitionActivity>("Transition")
                 StartSampleButton<AndroidViewModelActivity>("Android ViewModel")
                 StartSampleButton<ScreenModelActivity>("ScreenModel")
                 StartSampleButton<KoinIntegrationActivity>("Koin Integration")

samples/android/src/main/java/cafe/adriel/voyager/sample/tabNavigation/TabNavigationActivity.kt

@@ -26,49 +26,53 @@ class TabNavigationActivity : ComponentActivity() {
         super.onCreate(savedInstanceState)
 
         setContent {
-            Content()
-        }
-    }
-
-    @Composable
-    fun Content() {
-        TabNavigator(
-            HomeTab,
-            tabDisposable = {
-                TabDisposable(
-                    navigator = it,
-                    tabs = listOf(HomeTab, FavoritesTab, ProfileTab)
-                )
+            TabNavigationContent {
+                CurrentTab()
             }
-        ) { tabNavigator ->
-            Scaffold(
-                topBar = {
-                    TopAppBar(
-                        title = { Text(text = tabNavigator.current.options.title) }
-                    )
-                },
-                content = {
-                    CurrentTab()
-                },
-                bottomBar = {
-                    BottomNavigation {
-                        TabNavigationItem(HomeTab)
-                        TabNavigationItem(FavoritesTab)
-                        TabNavigationItem(ProfileTab)
-                    }
-                }
-            )
         }
     }
+}
 
-    @Composable
-    private fun RowScope.TabNavigationItem(tab: Tab) {
-        val tabNavigator = LocalTabNavigator.current
+@Composable
+private fun RowScope.TabNavigationItem(tab: Tab) {
+    val tabNavigator = LocalTabNavigator.current
 
-        BottomNavigationItem(
-            selected = tabNavigator.current.key == tab.key,
-            onClick = { tabNavigator.current = tab },
-            icon = { Icon(painter = tab.options.icon!!, contentDescription = tab.options.title) }
+    BottomNavigationItem(
+        selected = tabNavigator.current.key == tab.key,
+        onClick = { tabNavigator.current = tab },
+        icon = { Icon(painter = tab.options.icon!!, contentDescription = tab.options.title) }
+    )
+}
+
+@Composable
+fun TabNavigationContent(
+    scaffoldContent: @Composable (TabNavigator) -> Unit
+) {
+    TabNavigator(
+        tab = HomeTab,
+        tabDisposable = {
+            TabDisposable(
+                navigator = it,
+                tabs = listOf(HomeTab, FavoritesTab, ProfileTab)
+            )
+        }
+    ) { tabNavigator ->
+        Scaffold(
+            topBar = {
+                TopAppBar(
+                    title = { Text(text = tabNavigator.current.options.title) }
+                )
+            },
+            content = {
+                scaffoldContent(tabNavigator)
+            },
+            bottomBar = {
+                BottomNavigation {
+                    TabNavigationItem(HomeTab)
+                    TabNavigationItem(FavoritesTab)
+                    TabNavigationItem(ProfileTab)
+                }
+            }
         )
     }
 }

samples/android/src/main/java/cafe/adriel/voyager/sample/tabNavigation/tabs/TabContent.kt

@@ -1,7 +1,6 @@
 package cafe.adriel.voyager.sample.tabNavigation.tabs
 
 import android.util.Log
-import androidx.compose.animation.ExperimentalAnimationApi
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
@@ -19,7 +18,6 @@ import cafe.adriel.voyager.navigator.tab.Tab
 import cafe.adriel.voyager.sample.basicNavigation.BasicNavigationScreen
 import cafe.adriel.voyager.transitions.SlideTransition
 
-@OptIn(ExperimentalAnimationApi::class)
 @Composable
 fun Tab.TabContent() {
     val tabTitle = options.title

samples/android/src/main/java/cafe/adriel/voyager/sample/transition/FadeScreen.kt

@@ -0,0 +1,28 @@
+package cafe.adriel.voyager.sample.transition
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.sp
+import cafe.adriel.voyager.core.screen.Screen
+import cafe.adriel.voyager.core.screen.uniqueScreenKey
+
+data object FadeScreen : Screen {
+    override val key = uniqueScreenKey
+
+    @Composable
+    override fun Content() {
+        Box(modifier = Modifier.fillMaxSize()) {
+            Text(
+                text = "Fade Screen",
+                modifier = Modifier.align(alignment = Alignment.Center),
+                color = Color.Red,
+                fontSize = 30.sp
+            )
+        }
+    }
+}

samples/android/src/main/java/cafe/adriel/voyager/sample/transition/ScaleScreen.kt

@@ -0,0 +1,28 @@
+package cafe.adriel.voyager.sample.transition
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.sp
+import cafe.adriel.voyager.core.screen.Screen
+import cafe.adriel.voyager.core.screen.uniqueScreenKey
+
+data object ScaleScreen : Screen {
+    override val key = uniqueScreenKey
+
+    @Composable
+    override fun Content() {
+        Box(modifier = Modifier.fillMaxSize()) {
+            Text(
+                text = "Scale Screen",
+                modifier = Modifier.align(alignment = Alignment.Center),
+                color = Color.Red,
+                fontSize = 30.sp
+            )
+        }
+    }
+}

samples/android/src/main/java/cafe/adriel/voyager/sample/transition/ShrinkScreen.kt

@@ -0,0 +1,28 @@
+package cafe.adriel.voyager.sample.transition
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.sp
+import cafe.adriel.voyager.core.screen.Screen
+import cafe.adriel.voyager.core.screen.uniqueScreenKey
+
+data object ShrinkScreen : Screen {
+    override val key = uniqueScreenKey
+
+    @Composable
+    override fun Content() {
+        Box(modifier = Modifier.fillMaxSize()) {
+            Text(
+                text = "Shrink Screen",
+                modifier = Modifier.align(alignment = Alignment.Center),
+                color = Color.Red,
+                fontSize = 30.sp
+            )
+        }
+    }
+}

samples/android/src/main/java/cafe/adriel/voyager/sample/transition/TabNavigationScreen.kt

@@ -0,0 +1,17 @@
+package cafe.adriel.voyager.sample.transition
+
+import androidx.compose.runtime.Composable
+import cafe.adriel.voyager.core.screen.Screen
+import cafe.adriel.voyager.core.screen.uniqueScreenKey
+import cafe.adriel.voyager.sample.tabNavigation.TabNavigationContent
+
+data object TabNavigationScreen : Screen {
+    override val key = uniqueScreenKey
+
+    @Composable
+    override fun Content() {
+        TabNavigationContent {
+            TransitionTab(it.navigator)
+        }
+    }
+}