Skip to content

Commit

Permalink
feat: Add a custom NavigationSuiteScaffold
Browse files Browse the repository at this point in the history
  • Loading branch information
sirambd committed Aug 14, 2024
1 parent 6c32556 commit 70d4602
Show file tree
Hide file tree
Showing 2 changed files with 129 additions and 54 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -18,26 +18,18 @@

package com.infomaniak.swisstransfer.ui.screen.main

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.material3.adaptive.WindowAdaptiveInfo
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteDefaults
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffold
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffoldDefaults
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
import androidx.compose.material3.adaptive.navigationsuite.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.navigation.NavGraph.Companion.findStartDestination
import androidx.navigation.NavHostController
import com.infomaniak.swisstransfer.ui.navigation.MainNavigation
import com.infomaniak.swisstransfer.ui.navigation.NavigationItem
import com.infomaniak.swisstransfer.ui.theme.LocalCustomTypography
import com.infomaniak.swisstransfer.ui.screen.main.components.AppNavigationSuiteScaffold
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
import com.infomaniak.swisstransfer.ui.theme.Typography
import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
import com.infomaniak.swisstransfer.ui.utils.PreviewTablet

Expand Down Expand Up @@ -65,50 +57,17 @@ private fun MainScaffold(
navigateToSelectedItem: (MainNavigation) -> Unit,
content: @Composable () -> Unit,
) {
val isNavigationBar = navType == NavigationSuiteType.NavigationBar

NavigationSuiteScaffold(
navigationSuiteItems = {
NavigationItem.entries.forEach { navigationItem ->
item(
icon = { NavigationIcon(isNavigationBar, navigationItem) },
label = { NavigationLabel(isNavigationBar, navigationItem) },
selected = currentDestination == navigationItem.destination,
onClick = { navigateToSelectedItem(navigationItem.destination) }
)
}
},
navigationSuiteColors = NavigationSuiteDefaults.colors(
navigationBarContainerColor = SwissTransferTheme.colors.navigationItemBackground,
navigationRailContainerColor = SwissTransferTheme.colors.navigationItemBackground,
navigationDrawerContainerColor = SwissTransferTheme.colors.navigationItemBackground,
),
layoutType = navType,
content = {
if (navType == NavigationSuiteType.None) {
content()
} else {
Column {
Box(modifier = Modifier.weight(1f)) {
content()
}
HorizontalDivider(color = SwissTransferTheme.colors.divider)
AppNavigationSuiteScaffold(navType, currentDestination, navigateToSelectedItem) {
if (navType == NavigationSuiteType.None) {
content()
} else {
Column {
Box(modifier = Modifier.weight(1f)) {
content()
}
HorizontalDivider(color = SwissTransferTheme.colors.divider)
}
},
)
}

@Composable
private fun NavigationIcon(isNavigationBar: Boolean, navigationItem: NavigationItem) {
val contentDescription = if (isNavigationBar) null else stringResource(navigationItem.label)
Icon(navigationItem.icon, contentDescription)
}

@Composable
private fun NavigationLabel(isNavigationBar: Boolean, navigationItem: NavigationItem) {
if (isNavigationBar) {
Text(stringResource(navigationItem.label))
}
}
}

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,116 @@
/*
* Infomaniak SwissTransfer - Android
* Copyright (C) 2024 Infomaniak Network SA
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/

package com.infomaniak.swisstransfer.ui.screen.main.components

import androidx.compose.foundation.layout.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material3.*
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffoldLayout
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import com.infomaniak.swisstransfer.ui.navigation.MainNavigation
import com.infomaniak.swisstransfer.ui.navigation.NavigationItem
import com.infomaniak.swisstransfer.ui.theme.Margin
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme

@Composable
fun AppNavigationSuiteScaffold(
navType: NavigationSuiteType,
currentDestination: MainNavigation,
navigateToSelectedItem: (MainNavigation) -> Unit,
content: @Composable () -> Unit,
) {
val isNavigationBar = navType == NavigationSuiteType.NavigationBar

Surface(color = SwissTransferTheme.materialColors.background) {
NavigationSuiteScaffoldLayout(
navigationSuite = {
if (isNavigationBar) {
AppNavigationBar(currentDestination, navigateToSelectedItem)
} else {
AppNavigationRail(currentDestination, navigateToSelectedItem)
}
},
layoutType = navType,
) {
Box(
Modifier.consumeWindowInsets(
when (navType) {
NavigationSuiteType.NavigationBar ->
NavigationBarDefaults.windowInsets.only(WindowInsetsSides.Bottom)
NavigationSuiteType.NavigationRail ->
NavigationRailDefaults.windowInsets.only(WindowInsetsSides.Start)
else -> WindowInsets(0, 0, 0, 0)
}
)
) {
content()
}
}
}
}

@Composable
private fun AppNavigationBar(currentDestination: MainNavigation, navigateToSelectedItem: (MainNavigation) -> Unit) {
NavigationBar(containerColor = SwissTransferTheme.colors.navigationItemBackground) {
com.infomaniak.swisstransfer.ui.navigation.NavigationItem.entries.forEach { navigationItem ->
NavigationBarItem(
icon = { NavigationIcon(true, navigationItem) },
label = { NavigationLabel(navigationItem) },
selected = currentDestination == navigationItem.destination,
onClick = { navigateToSelectedItem(navigationItem.destination) },
)
}
}
}

@Composable
private fun AppNavigationRail(currentDestination: MainNavigation, navigateToSelectedItem: (MainNavigation) -> Unit) {
NavigationRail(
header = {
FloatingActionButton(onClick = {}, modifier = Modifier.padding(bottom = Margin.Large)) {
Icon(Icons.Default.Add, contentDescription = null)
}
},
containerColor = SwissTransferTheme.colors.navigationItemBackground
) {
com.infomaniak.swisstransfer.ui.navigation.NavigationItem.entries.forEach { navigationItem ->
NavigationRailItem(
icon = { NavigationIcon(false, navigationItem) },
label = {},
selected = currentDestination == navigationItem.destination,
onClick = { navigateToSelectedItem(navigationItem.destination) },
)
}
}
}

@Composable
private fun NavigationIcon(isNavigationBar: Boolean, navigationItem: NavigationItem) {
val contentDescription = if (isNavigationBar) null else stringResource(navigationItem.label)
Icon(navigationItem.icon, contentDescription)
}

@Composable
private fun NavigationLabel(navigationItem: NavigationItem) {
Text(stringResource(navigationItem.label))
}

0 comments on commit 70d4602

Please sign in to comment.