android: move navigation button to activity level

2026-01-29 06:10:52 +00:00 · 2025-10-10 20:39:54 +05:30
parent 39a64ec6f2
commit 4a135fa463
19 changed files with 213 additions and 262 deletions
--- a/android/app/src/main/java/me/kavishdevar/librepods/MainActivity.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/MainActivity.kt
@@ -38,11 +38,16 @@ import android.widget.Toast
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
+import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.core.RepeatMode
 import androidx.compose.animation.core.animateFloat
 import androidx.compose.animation.core.infiniteRepeatable
 import androidx.compose.animation.core.rememberInfiniteTransition
 import androidx.compose.animation.core.tween
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
+import androidx.compose.animation.scaleIn
+import androidx.compose.animation.scaleOut
 import androidx.compose.animation.slideInHorizontally
 import androidx.compose.animation.slideOutHorizontally
 import androidx.compose.foundation.Canvas
@@ -69,9 +74,11 @@ import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -104,8 +111,11 @@ import com.google.accompanist.permissions.ExperimentalPermissionsApi
 import com.google.accompanist.permissions.MultiplePermissionsState
 import com.google.accompanist.permissions.isGranted
 import com.google.accompanist.permissions.rememberMultiplePermissionsState
+import com.kyant.backdrop.backdrops.rememberLayerBackdrop
+import com.kyant.backdrop.backdrops.layerBackdrop
 import dev.chrisbanes.haze.materials.ExperimentalHazeMaterialsApi
 import me.kavishdevar.librepods.constants.AirPodsNotifications
+import me.kavishdevar.librepods.composables.StyledIconButton
 import me.kavishdevar.librepods.screens.AccessibilitySettingsScreen
 import me.kavishdevar.librepods.screens.AdaptiveStrengthScreen
 import me.kavishdevar.librepods.screens.AirPodsSettingsScreen
@@ -300,108 +310,128 @@ fun Main() {
        val context = LocalContext.current

        val navController = rememberNavController()
-
-        val sharedPreferences = context.getSharedPreferences("settings", MODE_PRIVATE)
-        val isAvailableChangeListener = SharedPreferences.OnSharedPreferenceChangeListener { _, key ->
-            if (key == "CrossDeviceIsAvailable") {
-                Log.d("MainActivity", "CrossDeviceIsAvailable changed")
-                isRemotelyConnected.value = sharedPreferences.getBoolean("CrossDeviceIsAvailable", false)
-            }
-        }
-        sharedPreferences.registerOnSharedPreferenceChangeListener(isAvailableChangeListener)
-        Log.d("MainActivity", "CrossDeviceIsAvailable: ${sharedPreferences.getBoolean("CrossDeviceIsAvailable", false)} | isAvailable: ${CrossDevice.isAvailable}")
-        isRemotelyConnected.value = sharedPreferences.getBoolean("CrossDeviceIsAvailable", false) || CrossDevice.isAvailable
-        Log.d("MainActivity", "isRemotelyConnected: ${isRemotelyConnected.value}")
+        
        Box (
            modifier = Modifier
-                .padding(0.dp)
                .fillMaxSize()
-                .background(if (isSystemInDarkTheme()) Color.Black else Color(0xFFF2F2F7))
-        ) {
-            NavHost(
-                navController = navController,
-                startDestination = if (hookAvailable) "settings" else "onboarding",
-                enterTransition = {
-                    slideInHorizontally(
-                        initialOffsetX = { it },
-                        animationSpec = tween(durationMillis = 300)
-                    ) // + fadeIn(animationSpec = tween(durationMillis = 300))
-                },
-                exitTransition = {
-                    slideOutHorizontally(
-                        targetOffsetX = { -it/4 },
-                        animationSpec = tween(durationMillis = 300)
-                    ) // + fadeOut(animationSpec = tween(durationMillis = 150))
-                },
-                popEnterTransition = {
-                    slideInHorizontally(
-                        initialOffsetX = { -it/4 },
-                        animationSpec = tween(durationMillis = 300)
-                    ) // + fadeIn(animationSpec = tween(durationMillis = 300))
-                },
-                popExitTransition = {
-                    slideOutHorizontally(
-                        targetOffsetX = { it },
-                        animationSpec = tween(durationMillis = 300)
-                    ) // + fadeOut(animationSpec = tween(durationMillis = 150))
-                }
+        ){
+            val backButtonBackdrop = rememberLayerBackdrop()
+            Box (
+                modifier = Modifier
+                    .fillMaxSize()
+                    .background(if (isSystemInDarkTheme()) Color.Black else Color(0xFFF2F2F7))
+                    .layerBackdrop(backButtonBackdrop)
            ) {
-                composable("settings") {
-                    if (airPodsService.value != null) {
-                        AirPodsSettingsScreen(
-                            dev = airPodsService.value?.device,
-                            service = airPodsService.value!!,
+                NavHost(
+                    navController = navController,
+                    startDestination = if (hookAvailable) "settings" else "onboarding",
+                    enterTransition = {
+                        slideInHorizontally(
+                            initialOffsetX = { it },
+                            animationSpec = tween(durationMillis = 300)
+                        ) // + fadeIn(animationSpec = tween(durationMillis = 300))
+                    },
+                    exitTransition = {
+                        slideOutHorizontally(
+                            targetOffsetX = { -it/4 },
+                            animationSpec = tween(durationMillis = 300)
+                        ) // + fadeOut(animationSpec = tween(durationMillis = 150))
+                    },
+                    popEnterTransition = {
+                        slideInHorizontally(
+                            initialOffsetX = { -it/4 },
+                            animationSpec = tween(durationMillis = 300)
+                        ) // + fadeIn(animationSpec = tween(durationMillis = 300))
+                    },
+                    popExitTransition = {
+                        slideOutHorizontally(
+                            targetOffsetX = { it },
+                            animationSpec = tween(durationMillis = 300)
+                        ) // + fadeOut(animationSpec = tween(durationMillis = 150))
+                    }
+                ) {
+                    composable("settings") {
+                        if (airPodsService.value != null) {
+                            AirPodsSettingsScreen(
+                                dev = airPodsService.value?.device,
+                                service = airPodsService.value!!,
+                                navController = navController,
+                                isConnected = isConnected.value,
+                                isRemotelyConnected = isRemotelyConnected.value
+                            )
+                        }
+                    }
+                    composable("debug") {
+                        DebugScreen(navController = navController)
+                    }
+                    composable("long_press/{bud}") { navBackStackEntry ->
+                        LongPress(
                            navController = navController,
-                            isConnected = isConnected.value,
-                            isRemotelyConnected = isRemotelyConnected.value
+                            name = navBackStackEntry.arguments?.getString("bud")!!
                        )
                    }
+                    composable("rename") {
+                        RenameScreen(navController)
+                    }
+                    composable("app_settings") {
+                        AppSettingsScreen(navController)
+                    }
+                    composable("troubleshooting") {
+                        TroubleshootingScreen(navController)
+                    }
+                    composable("head_tracking") {
+                        HeadTrackingScreen(navController)
+                    }
+                    composable("onboarding") {
+                        Onboarding(navController, context)
+                    }
+                    composable("accessibility") {
+                        AccessibilitySettingsScreen(navController)
+                    }
+                    composable("transparency_customization") {
+                        TransparencySettingsScreen(navController)
+                    }
+                    composable("hearing_aid") {
+                        HearingAidScreen(navController)
+                    }
+                    composable("hearing_aid_adjustments") {
+                        HearingAidAdjustmentsScreen(navController)
+                    }
+                    composable("adaptive_strength") {
+                        AdaptiveStrengthScreen(navController)
+                    }
+                    composable("camera_control") {
+                        CameraControlScreen(navController)
+                    }
+                    composable("open_source_licenses") {
+                        OpenSourceLicensesScreen(navController)
+                    }
                }
-                composable("debug") {
-                    DebugScreen(navController = navController)
+            }
+
+            val showBackButton = remember{ mutableStateOf(false) }
+
+            LaunchedEffect(navController) {
+                navController.addOnDestinationChangedListener { _, destination, _ ->
+                    showBackButton.value = destination.route != "settings" && destination.route != "onboarding"
+                    Log.d("MainActivity", "Navigated to ${destination.route}, showBackButton: ${showBackButton.value}")
                }
-                composable("long_press/{bud}") { navBackStackEntry ->
-                    LongPress(
-                        navController = navController,
-                        name = navBackStackEntry.arguments?.getString("bud")!!
+            }
+
+            AnimatedVisibility(
+                visible = showBackButton.value,
+                enter = fadeIn(animationSpec = tween()) + scaleIn(initialScale = 0f, animationSpec = tween()),
+                exit = fadeOut(animationSpec = tween()) + scaleOut(targetScale = 0.5f, animationSpec = tween(100)),
+                modifier = Modifier
+                    .align(Alignment.TopStart)
+                    .padding(start = 8.dp, top = (context.resources.configuration.screenHeightDp.dp * 0.05f).value.dp)
+            ) {
+                StyledIconButton(
+                        onClick = { navController.popBackStack() },
+                        icon = "􀯶",
+                        darkMode = isSystemInDarkTheme(),
+                        backdrop = backButtonBackdrop
                    )
-                }
-                composable("rename") {
-                    RenameScreen(navController)
-                }
-                composable("app_settings") {
-                    AppSettingsScreen(navController)
-                }
-                composable("troubleshooting") {
-                    TroubleshootingScreen(navController)
-                }
-                composable("head_tracking") {
-                    HeadTrackingScreen(navController)
-                }
-                composable("onboarding") {
-                    Onboarding(navController, context)
-                }
-                composable("accessibility") {
-                    AccessibilitySettingsScreen(navController)
-                }
-                composable("transparency_customization") {
-                    TransparencySettingsScreen(navController)
-                }
-                composable("hearing_aid") {
-                    HearingAidScreen(navController)
-                }
-                composable("hearing_aid_adjustments") {
-                    HearingAidAdjustmentsScreen(navController)
-                }
-                composable("adaptive_strength") {
-                    AdaptiveStrengthScreen(navController)
-                }
-                composable("camera_control") {
-                    CameraControlScreen(navController)
-                }
-                composable("open_source_licenses") {
-                    OpenSourceLicensesScreen(navController)
-                }
            }
        }

--- a/android/app/src/main/java/me/kavishdevar/librepods/composables/StyledIconButton.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/composables/StyledIconButton.kt
@@ -127,8 +127,8 @@ half4 main(float2 coord) {
                highlight = { Highlight.Ambient.copy(alpha = if (isDarkTheme) 1f else 0f) },
                shadow = {
                    Shadow(
-                        radius = 48f.dp,
-                        color = Color.Black.copy(if (isDarkTheme) 0.08f else 0.4f)
+                        radius = 12f.dp,
+                        color = Color.Black.copy(if (isDarkTheme) 0.08f else 0.2f)
                    )
                },
                layerBlock = {
@@ -136,8 +136,7 @@ half4 main(float2 coord) {
                    val height = size.height

                    val progress = progressAnimation.value
-                    val maxScale = 0.1f
-                    val scale = lerp(1f, 1f + maxScale, progress)
+                    val scale = lerp(1f, 1.5f, progress)

                    val maxOffset = size.minDimension
                    val initialDerivative = 0.05f
@@ -220,7 +219,7 @@ half4 main(float2 coord) {
                },
                effects = {
                    refractionWithDispersion(6f.dp.toPx(), size.height / 2f)
-                    blur(24f, TileMode.Decal)
+                    // blur(24f, TileMode.Decal)
                },
            )
            .pointerInput(animationScope) {
--- a/android/app/src/main/java/me/kavishdevar/librepods/composables/StyledScaffold.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/composables/StyledScaffold.kt
@@ -37,6 +37,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.text.TextStyle
@@ -48,6 +49,10 @@ import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.compose.ui.zIndex
+import androidx.navigation.NavController
+import com.kyant.backdrop.backdrops.LayerBackdrop
+import com.kyant.backdrop.backdrops.layerBackdrop
+import com.kyant.backdrop.backdrops.rememberLayerBackdrop
 import dev.chrisbanes.haze.HazeProgressive
 import dev.chrisbanes.haze.HazeState
 import dev.chrisbanes.haze.HazeTint
@@ -60,8 +65,7 @@ import me.kavishdevar.librepods.R
@Composable
 fun StyledScaffold(
    title: String,
-    navigationButton: @Composable () -> Unit = {},
-    actionButtons: List<@Composable () -> Unit> = emptyList(),
+    actionButtons: List<@Composable (backdrop: LayerBackdrop) -> Unit> = emptyList(),
    snackbarHostState: SnackbarHostState = remember { SnackbarHostState() },
    content: @Composable (spacerValue: Dp, hazeState: HazeState) -> Unit
 ) {
@@ -72,6 +76,7 @@ fun StyledScaffold(
        containerColor = if (isDarkTheme) Color(0xFF000000) else Color(0xFFF2F2F7),
        snackbarHost = { SnackbarHost(snackbarHostState) },
        modifier = Modifier
+            .then(if (!isDarkTheme) Modifier.shadow(elevation = 36.dp, shape = RoundedCornerShape(52.dp), ambientColor = Color.Black, spotColor = Color.Black) else Modifier)
            .clip(RoundedCornerShape(52.dp))
    ) { paddingValues ->
        val topPadding = paddingValues.calculateTopPadding()
@@ -84,23 +89,21 @@ fun StyledScaffold(
                .fillMaxSize()
                .padding(start = startPadding, end = endPadding, bottom = bottomPadding)
        ) {
+            val backdrop = rememberLayerBackdrop()
            Box(
                modifier = Modifier
                    .zIndex(2f)
                    .height(64.dp + topPadding)
                    .fillMaxWidth()
+                    .layerBackdrop(backdrop)
                    .hazeEffect(state = hazeState) {
                        tints = listOf(HazeTint(color = if (isDarkTheme) Color.Black else Color.White))
                        progressive = HazeProgressive.verticalGradient(startIntensity = 1f, endIntensity = 0f)
                    }
            ) {
                Column(modifier = Modifier.fillMaxSize()) {
-                    Spacer(modifier = Modifier.height(topPadding))
-                    Box(
-                        modifier = Modifier.fillMaxWidth()
-                    ) {
-                        navigationButton()
-                        Text(
+                    Spacer(modifier = Modifier.height(topPadding + 12.dp))
+                    Text(
                            text = title,
                            style = TextStyle(
                                fontSize = 20.sp,
@@ -108,15 +111,19 @@ fun StyledScaffold(
                                color = if (isDarkTheme) Color.White else Color.Black,
                                fontFamily = FontFamily(Font(R.font.sf_pro))
                            ),
-                            modifier = Modifier.align(Alignment.Center),
+                            modifier = Modifier.fillMaxWidth(),
                            textAlign = TextAlign.Center
                        )
-                        Row(
-                            modifier = Modifier.align(Alignment.CenterEnd)
-                        ) {
-                            actionButtons.forEach { it() }
-                        }
-                    }
+                }
+            }
+            Row(
+                modifier = Modifier
+                    .zIndex(3f)
+                    .padding(top = topPadding, end = 8.dp)
+                    .align(Alignment.TopEnd)
+            ) {
+                actionButtons.forEach { actionButton ->
+                    actionButton(backdrop)
                }
            }

@@ -130,16 +137,14 @@ fun StyledScaffold(
@Composable
 fun StyledScaffold(
    title: String,
-    navigationButton: @Composable () -> Unit = {},
-    actionButtons: List<@Composable () -> Unit> = emptyList(),
+    actionButtons: List<@Composable (backdrop: LayerBackdrop) -> Unit> = emptyList(),
    snackbarHostState: SnackbarHostState = remember { SnackbarHostState() },
    content: @Composable () -> Unit
 ) {
    StyledScaffold(
        title = title,
-        navigationButton = navigationButton,
        actionButtons = actionButtons,
-        snackbarHostState = snackbarHostState
+        snackbarHostState = snackbarHostState,
    ) { _, _ ->
        content()
    }
@@ -149,16 +154,14 @@ fun StyledScaffold(
@Composable
 fun StyledScaffold(
    title: String,
-    navigationButton: @Composable () -> Unit = {},
-    actionButtons: List<@Composable () -> Unit> = emptyList(),
+    actionButtons: List<@Composable (backdrop: LayerBackdrop) -> Unit> = emptyList(),
    snackbarHostState: SnackbarHostState = remember { SnackbarHostState() },
    content: @Composable (spacerValue: Dp) -> Unit
 ) {
    StyledScaffold(
        title = title,
-        navigationButton = navigationButton,
        actionButtons = actionButtons,
-        snackbarHostState = snackbarHostState
+        snackbarHostState = snackbarHostState,
    ) { spacerValue, _ ->
        content(spacerValue)
    }
--- a/android/app/src/main/java/me/kavishdevar/librepods/composables/StyledSwitch.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/composables/StyledSwitch.kt
@@ -106,17 +106,27 @@ fun StyledSwitch(
        compositingStrategy = CompositingStrategy.Offscreen
    }
    val animatedTrackColor = remember { Animatable(if (checked) onColor else offColor) }
+    val totalDrag = remember { mutableFloatStateOf(0f) }
+    val tapThreshold = 10f
+    val isFirstComposition = remember { mutableStateOf(true) }
    LaunchedEffect(checked) {
-        coroutineScope {
-            launch {
-                val targetColor = if (checked) onColor else offColor
-                animatedTrackColor.animateTo(targetColor, colorAnimationSpec)
-            }
-            launch {
-                val targetFrac = if (checked) 1f else 0f
-                animatedFraction.animateTo(targetFrac, progressAnimationSpec)
+        if (!isFirstComposition.value) {
+            coroutineScope {
+                launch {
+                    val targetColor = if (checked) onColor else offColor
+                    animatedTrackColor.animateTo(targetColor, colorAnimationSpec)
+                }
+                launch {
+                    val targetFrac = if (checked) 1f else 0f
+                    animatedFraction.animateTo(targetFrac, progressAnimationSpec)
+                }
+                launch {
+                    progressAnimation.animateTo(1f, tween(100, easing = FastOutSlowInEasing))
+                    progressAnimation.animateTo(0f, tween(100, easing = FastOutSlowInEasing))
+                }
            }
        }
+        isFirstComposition.value = false
    }

    Box(
@@ -147,6 +157,7 @@ fun StyledSwitch(
                            animationScope.launch {
                                animatedFraction.snapTo(newFraction)
                            }
+                            totalDrag.floatValue += kotlin.math.abs(delta)
                            val newChecked = newFraction >= 0.5f
                            if (newChecked != checked) {
                                onCheckedChange(newChecked)
@@ -156,17 +167,28 @@ fun StyledSwitch(
                    Orientation.Horizontal,
                    startDragImmediately = true,
                    onDragStarted = {
+                        totalDrag.floatValue = 0f
                        animationScope.launch {
                            progressAnimation.animateTo(1f, progressAnimationSpec)
                        }
                    },
                    onDragStopped = {
                        animationScope.launch {
-                            val snappedFraction = if (animatedFraction.value >= 0.5f) 1f else 0f
-                            onCheckedChange(snappedFraction >= 0.5f)
-                            coroutineScope {
-                                launch { progressAnimation.animateTo(0f, progressAnimationSpec) }
-                                launch { animatedFraction.animateTo(snappedFraction, progressAnimationSpec) }
+                            if (totalDrag.floatValue < tapThreshold) {
+                                val newChecked = !checked
+                                onCheckedChange(newChecked)
+                                val snappedFraction = if (newChecked) 1f else 0f
+                                coroutineScope {
+                                    launch { progressAnimation.animateTo(0f, progressAnimationSpec) }
+                                    launch { animatedFraction.animateTo(snappedFraction, progressAnimationSpec) }
+                                }
+                            } else {
+                                val snappedFraction = if (animatedFraction.value >= 0.5f) 1f else 0f
+                                onCheckedChange(snappedFraction >= 0.5f)
+                                coroutineScope {
+                                    launch { progressAnimation.animateTo(0f, progressAnimationSpec) }
+                                    launch { animatedFraction.animateTo(snappedFraction, progressAnimationSpec) }
+                                }
                            }
                        }
                    }
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/AccessibilitySettingsScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/AccessibilitySettingsScreen.kt
@@ -150,15 +150,7 @@ fun AccessibilitySettingsScreen(navController: NavController) {
    val backdrop = rememberLayerBackdrop()

    StyledScaffold(
-        title = stringResource(R.string.accessibility),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        },
+        title = stringResource(R.string.accessibility)
    ) { spacerHeight, hazeState ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/AdaptiveStrengthScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/AdaptiveStrengthScreen.kt
@@ -99,15 +99,7 @@ fun AdaptiveStrengthScreen(navController: NavController) {
    val backdrop = rememberLayerBackdrop()

    StyledScaffold(
-        title = stringResource(R.string.customize_adaptive_audio),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        }
+        title = stringResource(R.string.customize_adaptive_audio)
    ) { spacerHeight ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/AirPodsSettingsScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/AirPodsSettingsScreen.kt
@@ -200,14 +200,16 @@ fun AirPodsSettingsScreen(dev: BluetoothDevice?, service: AirPodsService,
    val backdrop = rememberLayerBackdrop()
    StyledScaffold(
        title = deviceName.text,
-        actionButtons = listOf {
-            StyledIconButton(
-                onClick = { navController.navigate("app_settings") },
-                icon = "􀍟",
-                darkMode = darkMode,
-                backdrop = backdrop
-            )
-        },
+        actionButtons = listOf(
+            {scaffoldBackdrop ->
+                StyledIconButton(
+                    onClick = { navController.navigate("app_settings") },
+                    icon = "􀍟",
+                    darkMode = darkMode,
+                    backdrop = scaffoldBackdrop
+                )
+            }
+        ),
        snackbarHostState = snackbarHostState
    ) { spacerHeight, hazeState ->
        if (isLocallyConnected || isRemotelyConnected) {
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/AppSettingsScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/AppSettingsScreen.kt
@@ -193,15 +193,7 @@ fun AppSettingsScreen(navController: NavController) {
    val backdrop = rememberLayerBackdrop()

    StyledScaffold(
-        title = stringResource(R.string.app_settings),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        }
+        title = stringResource(R.string.app_settings)
    ) { spacerHeight, hazeState ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/CameraControlScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/CameraControlScreen.kt
@@ -130,15 +130,7 @@ fun CameraControlScreen(navController: NavController) {
    val backdrop = rememberLayerBackdrop()

    StyledScaffold(
-        title = stringResource(R.string.camera_control),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        }
+        title = stringResource(R.string.camera_control)
    ) { spacerHeight ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/DebugScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/DebugScreen.kt
@@ -327,16 +327,8 @@ fun DebugScreen(navController: NavController) {
    val backdrop = rememberLayerBackdrop()
    StyledScaffold(
        title = "Debug",
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        },
        actionButtons = listOf(
-            {
+            {scaffoldBackdrop ->
                StyledIconButton(
                    onClick = {
                        airPodsService?.clearLogs()
@@ -344,7 +336,7 @@ fun DebugScreen(navController: NavController) {
                    },
                    icon = "􀈑",
                    darkMode = isDarkTheme,
-                    backdrop = backdrop
+                    backdrop = scaffoldBackdrop
                )
            }
        ),
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/HeadTrackingScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/HeadTrackingScreen.kt
@@ -121,18 +121,10 @@ fun HeadTrackingScreen(navController: NavController) {

    val scrollState = rememberScrollState()
    val backdrop = rememberLayerBackdrop()
-    StyledScaffold (
+    StyledScaffold(
        title = stringResource(R.string.head_tracking),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        },
        actionButtons = listOf(
-            {
+            { scaffoldBackdrop ->
               var isActive by remember { mutableStateOf(ServiceManager.getService()?.isHeadTrackingActive == true) }
                StyledIconButton(
                    onClick = {
@@ -146,7 +138,7 @@ fun HeadTrackingScreen(navController: NavController) {
                    },
                    icon = if (isActive) "􀊅" else "􀊃",
                    darkMode = isDarkTheme,
-                    backdrop = backdrop
+                    backdrop = scaffoldBackdrop
                )
            }
        ),
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/HearingAidAdjustmentsScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/HearingAidAdjustmentsScreen.kt
@@ -81,15 +81,7 @@ fun HearingAidAdjustmentsScreen(@Suppress("unused") navController: NavController
    val aacpManager = remember { ServiceManager.getService()?.aacpManager }
    val backdrop = rememberLayerBackdrop()
    StyledScaffold(
-        title = stringResource(R.string.adjustments),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        }
+        title = stringResource(R.string.adjustments)
    ) { spacerHeight ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/HearingAidScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/HearingAidScreen.kt
@@ -101,15 +101,6 @@ fun HearingAidScreen(navController: NavController) {

    StyledScaffold(
        title = stringResource(R.string.hearing_aid),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        },
-        actionButtons = emptyList(),
        snackbarHostState = snackbarHostState,
    ) { spacerHeight ->
        Column(
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/Onboarding.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/Onboarding.kt
@@ -157,14 +157,14 @@ fun Onboarding(navController: NavController, activityContext: Context) {
    StyledScaffold(
        title = "Setting Up",
        actionButtons = listOf(
-            {
+            {scaffoldBackdrop ->
                StyledIconButton(
                    onClick = {
                        showSkipDialog = true
                    },
                    icon = "􀊋",
                    darkMode = isDarkTheme,
-                    backdrop = backdrop
+                    backdrop = scaffoldBackdrop
                )
            }
        )
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/OpenSourceLicensesScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/OpenSourceLicensesScreen.kt
@@ -66,15 +66,7 @@ fun OpenSourceLicensesScreen(navController: NavController) {
    val backdrop = rememberLayerBackdrop()

    StyledScaffold(
-        title = stringResource(R.string.open_source_licenses),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        }
+        title = stringResource(R.string.open_source_licenses)
    ) { spacerHeight ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/PressAndHoldSettingsScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/PressAndHoldSettingsScreen.kt
@@ -122,15 +122,7 @@ fun LongPress(navController: NavController, name: String) {
    var longPressAction by remember { mutableStateOf(StemAction.valueOf(longPressActionPref ?: StemAction.CYCLE_NOISE_CONTROL_MODES.name)) }
    val backdrop = rememberLayerBackdrop()
    StyledScaffold(
-        title = name,
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        }
+        title = name
    ) { spacerHeight ->
        val backgroundColor = if (isDarkTheme) Color(0xFF1C1C1E) else Color(0xFFFFFFFF)
        Column (
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/RenameScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/RenameScreen.kt
@@ -87,14 +87,6 @@ fun RenameScreen(navController: NavController) {

    StyledScaffold(
        title = stringResource(R.string.name),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        },
    ) { spacerHeight ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/TransparencySettingsScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/TransparencySettingsScreen.kt
@@ -100,15 +100,7 @@ fun TransparencySettingsScreen(navController: NavController) {
    val backdrop = rememberLayerBackdrop()

    StyledScaffold(
-        title = stringResource(R.string.customize_transparency_mode),
-        navigationButton = {
-            StyledIconButton(
-                onClick = { navController.popBackStack() },
-                icon = "􀯶",
-                darkMode = isDarkTheme,
-                backdrop = backdrop
-            )
-        }
+        title = stringResource(R.string.customize_transparency_mode)
    ){ spacerHeight, hazeState ->
        Column(
            modifier = Modifier
--- a/android/app/src/main/java/me/kavishdevar/librepods/screens/TroubleshootingScreen.kt
+++ b/android/app/src/main/java/me/kavishdevar/librepods/screens/TroubleshootingScreen.kt
@@ -216,15 +216,7 @@ fun TroubleshootingScreen(navController: NavController) {
        modifier = Modifier.fillMaxSize()
    ) {
        StyledScaffold(
-            title = stringResource(R.string.troubleshooting),
-            navigationButton = {
-                StyledIconButton(
-                    onClick = { navController.popBackStack() },
-                    icon = "􀯶",
-                    darkMode = isDarkTheme,
-                    backdrop = backdrop
-                )
-            }
+            title = stringResource(R.string.troubleshooting)
        ){ spacerHeight, hazeState ->
            Column(
                modifier = Modifier