Add bottom nav bar

Sorry for poor code. This mvp will stay, until we implement adaptive navsuite. And get a hang on nav controller / deep linking etc. FWIW, it works 🤷
nain-F49FF806 · Oct 5, 2024 · fbd89c5 · fbd89c5
1 parent 977318d
commit fbd89c5
Show file tree

Hide file tree

Showing 2 changed files with 90 additions and 9 deletions.
diff --git a/android/app/src/main/java/alt/nainapps/sharepaste/launcher/MainActivity.kt b/android/app/src/main/java/alt/nainapps/sharepaste/launcher/MainActivity.kt
@@ -2,41 +2,120 @@ package alt.nainapps.sharepaste.launcher
 
 import alt.nainapps.sharepaste.common.EncryptAndShareUI
 import alt.nainapps.sharepaste.launcher.ui.theme.SharePasteO2Theme
+import alt.nainapps.sharepaste.settings.SettingsUI
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Create
+import androidx.compose.material.icons.filled.Settings
+import androidx.compose.material.icons.outlined.Create
+import androidx.compose.material.icons.outlined.Settings
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.NavigationBar
+import androidx.compose.material3.NavigationBarItem
+import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarDefaults.topAppBarColors
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableIntStateOf
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.preference.PreferenceManager
 
 class MainActivity : ComponentActivity() {
+    @OptIn(ExperimentalMaterial3Api::class)
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         val customPrivatebinHost = PreferenceManager.getDefaultSharedPreferences(
             this
         ).getString("privatebin_host_url", null)
 
+        val bottomNavBarItems = listOf(
+            BottomNavBarItem(
+                title = "Share",
+                selectedIcon = Icons.Filled.Create,
+                unselectedIcon = Icons.Outlined.Create
+            ),
+            BottomNavBarItem(
+                title = "Settings",
+                selectedIcon = Icons.Filled.Settings,
+                unselectedIcon = Icons.Outlined.Settings
+            ),
+
+        )
         setContent {
             SharePasteO2Theme {
-                // A surface container using the 'background' color from the theme
-                Surface(
-                    modifier = Modifier.fillMaxSize(),
-                    color = MaterialTheme.colorScheme.background
-                ) {
-                    EncryptAndShareUI(
-                        customPrivatebinHost = customPrivatebinHost
-                    )
-                }
+                var selectedNavItemIndex by rememberSaveable { mutableIntStateOf(0) }
+                    Scaffold (
+                        topBar = {
+                            if (selectedNavItemIndex == 1) {
+                                TopAppBar(
+                                    colors = topAppBarColors(
+                                        containerColor = MaterialTheme.colorScheme.primaryContainer,
+                                        titleContentColor = MaterialTheme.colorScheme.primary
+                                    ),
+                                    title = {
+                                        Text("SharePasteO₂ Settings")
+                                    }
+                                )
+                            }
+                        },
+                        bottomBar = {
+                            NavigationBar {
+                                bottomNavBarItems.forEachIndexed { index, item ->
+                                    NavigationBarItem(
+                                        selected = (selectedNavItemIndex == index),
+                                        onClick = {selectedNavItemIndex = index},
+                                        icon = {
+                                            Icon(
+                                                imageVector = if (selectedNavItemIndex == index) item.selectedIcon else item.unselectedIcon,
+                                                contentDescription = item.title
+                                            )
+                                        },
+                                        label = { Text(item.title) }
+                                    )
+                                }
+                            }
+                        }
+                    ) { paddingValues ->
+                        // A surface container using the 'background' color from the theme
+                        Surface(
+                            modifier = Modifier.padding(paddingValues).fillMaxSize(),
+                            color = MaterialTheme.colorScheme.background
+                        ) {
+                            if (selectedNavItemIndex == 0) {
+                                EncryptAndShareUI(
+                                    customPrivatebinHost = customPrivatebinHost,
+                                )
+                            } else if (selectedNavItemIndex == 1) {
+                                SettingsUI()
+                            }
+                        }
+                    }
+
+
             }
         }
     }
 }
 
+data class BottomNavBarItem (
+    val title: String,
+    val selectedIcon: ImageVector,
+    val unselectedIcon: ImageVector,
+)
+
 @Composable
 fun Greeting2(name: String, modifier: Modifier = Modifier) {
     Text(

diff --git a/android/gradle/libs.versions.toml b/android/gradle/libs.versions.toml
@@ -15,6 +15,7 @@ rustCargoNdk = "0.3.4"
 composePrefs = "1.1.1"
 preferenceKtx = "1.2.1"
 materialIconsExtended = "1.7.3"
+navigationCompose = "2.8.2"
 
 [libraries]
 androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
@@ -38,6 +39,7 @@ material = { group = "com.google.android.material", name = "material", version.r
 composePrefs = { group = "me.zhanghai.compose.preference", name = "library", version.ref = "composePrefs" }
 androidx-preference-ktx = { group = "androidx.preference", name = "preference-ktx", version.ref = "preferenceKtx" }
 androidx-material-icons-extended = { group = "androidx.compose.material", name = "material-icons-extended", version.ref = "materialIconsExtended" }
+androidx-navigation-compose = { group = "androidx.navigation", name = "navigation-compose", version.ref = "navigationCompose" }
 [plugins]
 androidApplication = { id = "com.android.application", version.ref = "agp" }
 jetbrainsKotlinAndroid = { id = "org.jetbrains.kotlin.android", version.ref = "kotlin" }