Skip to content

Commit

Permalink
Merge pull request #16 from Infomaniak/fab
Browse files Browse the repository at this point in the history
Add fab to the sent main screens
  • Loading branch information
sirambd authored Aug 15, 2024
2 parents d16272d + b84f03c commit 7f521b3
Show file tree
Hide file tree
Showing 14 changed files with 440 additions and 10 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
/*
* 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.components

import androidx.compose.material3.FloatingActionButtonDefaults
import androidx.compose.material3.FloatingActionButtonElevation
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import com.infomaniak.swisstransfer.ui.NewTransferActivity
import com.infomaniak.swisstransfer.ui.utils.launchActivity

@Composable
fun NewTransferFab(
modifier: Modifier = Modifier,
newTransferFabType: NewTransferFabType
) {
val context = LocalContext.current
SwissTransferFab(
modifier = modifier,
fabType = newTransferFabType.fabType,
elevation = newTransferFabType.elevation(),
onClick = { context.launchActivity(NewTransferActivity::class) },
)
}

enum class NewTransferFabType(val fabType: FabType, private val defaultElevation: Dp?) {
BOTTOM_BAR(FabType.NORMAL, null),
EMPTY_STATE(FabType.BIG, null),
NAVIGATION_RAIL(FabType.NORMAL, 0.dp);

@Composable
fun elevation(): FloatingActionButtonElevation {
return if (defaultElevation != null) {
FloatingActionButtonDefaults.elevation(defaultElevation)
} else {
FloatingActionButtonDefaults.elevation()
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
/*
* 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.components

import android.content.res.Configuration
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CornerBasedShape
import androidx.compose.material3.FloatingActionButton
import androidx.compose.material3.FloatingActionButtonDefaults
import androidx.compose.material3.FloatingActionButtonElevation
import androidx.compose.material3.Icon
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.infomaniak.swisstransfer.R
import com.infomaniak.swisstransfer.ui.icons.AppIcons
import com.infomaniak.swisstransfer.ui.icons.app.Add
import com.infomaniak.swisstransfer.ui.theme.Shapes
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme

@Composable
fun SwissTransferFab(
modifier: Modifier = Modifier,
fabType: FabType = FabType.NORMAL,
elevation: FloatingActionButtonElevation = FloatingActionButtonDefaults.elevation(),
onClick: () -> Unit,
) {
FloatingActionButton(
modifier = modifier.let { if (fabType == FabType.BIG) it.size(80.dp) else it },
onClick = onClick,
containerColor = SwissTransferTheme.materialColors.primary,
shape = fabType.shape,
elevation = elevation,
) {
Icon(
imageVector = AppIcons.Add,
contentDescription = stringResource(id = R.string.contentDescriptionCreateNewTransferButton),
)
}
}

enum class FabType(val shape: CornerBasedShape) {
NORMAL(Shapes.medium),
BIG(Shapes.large),
}


@Preview
@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL)
@Composable
private fun SwissTransferFabPreview() {
SwissTransferTheme {
SwissTransferFab(onClick = {})
}
}

@Preview
@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL)
@Composable
private fun SwissTransferFabBigPreview() {
SwissTransferTheme {
SwissTransferFab(fabType = FabType.BIG, onClick = {})
}
}
65 changes: 65 additions & 0 deletions app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/Add.kt
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
package com.infomaniak.swisstransfer.ui.icons.app

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.PathFillType.Companion.NonZero
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.StrokeCap.Companion.Round
import androidx.compose.ui.graphics.StrokeJoin
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.ImageVector.Builder
import androidx.compose.ui.graphics.vector.group
import androidx.compose.ui.graphics.vector.path
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.infomaniak.swisstransfer.ui.icons.AppIcons

val AppIcons.Add: ImageVector
get() {
if (_add != null) {
return _add!!
}
_add = Builder(
name = "Add",
defaultWidth = 24.0.dp,
defaultHeight = 24.0.dp,
viewportWidth = 24.0f,
viewportHeight = 24.0f
).apply {
group {
path(
fill = null,
stroke = SolidColor(Color(0xFF9f9f9f)),
strokeLineWidth = 2.0f,
strokeLineCap = Round,
strokeLineJoin = StrokeJoin.Round,
strokeLineMiter = 4.0f,
pathFillType = NonZero
) {
moveTo(1.5f, 12.0f)
horizontalLineToRelative(21.0f)
moveTo(12.0f, 1.5f)
verticalLineToRelative(21.0f)
}
}
}.build()
return _add!!
}

private var _add: ImageVector? = null

@Preview
@Composable
private fun Preview() {
Box {
Image(
imageVector = AppIcons.Add,
contentDescription = null,
modifier = Modifier.size(250.dp)
)
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,6 @@
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.NavigationSuite
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffold
Expand All @@ -29,6 +27,8 @@ 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.components.NewTransferFab
import com.infomaniak.swisstransfer.ui.components.NewTransferFabType
import com.infomaniak.swisstransfer.ui.navigation.MainNavigation
import com.infomaniak.swisstransfer.ui.navigation.NavigationItem
import com.infomaniak.swisstransfer.ui.theme.Margin
Expand Down Expand Up @@ -120,9 +120,10 @@ private fun AppNavigationRail(
) {
NavigationRail(
header = {
FloatingActionButton(onClick = {}, modifier = Modifier.padding(bottom = Margin.Large)) {
Icon(Icons.Default.Add, contentDescription = null)
}
NewTransferFab(
modifier = Modifier.padding(vertical = Margin.Medium),
newTransferFabType = NewTransferFabType.NAVIGATION_RAIL,
)
},
containerColor = SwissTransferTheme.colors.navigationItemBackground
) {
Expand All @@ -146,4 +147,4 @@ private fun NavigationIcon(isNavigationBar: Boolean, navigationItem: NavigationI
@Composable
private fun NavigationLabel(navigationItem: NavigationItem) {
Text(stringResource(navigationItem.label))
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,55 @@

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

import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import com.infomaniak.swisstransfer.ui.components.NewTransferFab
import com.infomaniak.swisstransfer.ui.components.NewTransferFabType
import com.infomaniak.swisstransfer.ui.screen.main.LocalNavType
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
import com.infomaniak.swisstransfer.ui.utils.PreviewTablet

@Composable
fun ReceivedScreen(navigateToDetails: (transferId: Int) -> Unit) {
Text("Received screen")
ReceivedScreen(navType = LocalNavType.current)
}

@Composable
private fun ReceivedScreen(navType: NavigationSuiteType) {
Scaffold(
floatingActionButton = {
if (navType == NavigationSuiteType.NavigationBar) NewTransferFab(newTransferFabType = NewTransferFabType.BOTTOM_BAR)
}
) { contentPadding ->
Text(
text = "Received screen",
modifier = Modifier.padding(contentPadding),
)
}
}

@PreviewMobile
@Composable
private fun ReceivedScreenMobilePreview() {
SwissTransferTheme {
Surface {
ReceivedScreen(navType = NavigationSuiteType.NavigationBar)
}
}
}

@PreviewTablet
@Composable
private fun ReceivedScreenTabletPreview() {
SwissTransferTheme {
Surface {
ReceivedScreen(navType = NavigationSuiteType.NavigationRail)
}
}
}
Loading

0 comments on commit 7f521b3

Please sign in to comment.