Skip to content

Commit

Permalink
Merge pull request #25 from Infomaniak/bottom-sheet-items
Browse files Browse the repository at this point in the history
Add bottom sheet items component and use them in transfer upload source choice bottom sheet
  • Loading branch information
sirambd authored Aug 19, 2024
2 parents 6201d98 + 7afcd7e commit 2b71385
Show file tree
Hide file tree
Showing 18 changed files with 452 additions and 44 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
/*
* 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.annotation.StringRes
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.vector.ImageVector
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.Camera
import com.infomaniak.swisstransfer.ui.theme.CustomShapes
import com.infomaniak.swisstransfer.ui.theme.Margin
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme

private val BOTTOM_SHEET_ITEM_HEIGHT = 56.dp

@Composable
fun BottomSheetItem(imageVector: ImageVector, @StringRes titleRes: Int, onClick: () -> Unit) {
Button(
colors = ButtonDefaults.textButtonColors(contentColor = SwissTransferTheme.colors.primaryTextColor),
modifier = Modifier
.height(BOTTOM_SHEET_ITEM_HEIGHT)
.fillMaxWidth(),
shape = CustomShapes.None,
onClick = onClick,
) {
Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.Start,
verticalAlignment = Alignment.CenterVertically,
) {
Icon(
modifier = Modifier.size(Margin.Large),
imageVector = imageVector,
contentDescription = null,
tint = SwissTransferTheme.materialColors.primary
)
Spacer(modifier = Modifier.width(Margin.Large))
Text(
text = stringResource(id = titleRes),
style = SwissTransferTheme.typography.bodyRegular,
)
}
}
}

@Preview(name = "Light")
@Preview(name = "Dark", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL)
@Composable
private fun ChoiceItemPreview() {
SwissTransferTheme {
Surface {
BottomSheetItem(AppIcons.Camera, R.string.transferUploadSourceChoiceCamera) {}
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,8 @@ import com.infomaniak.swisstransfer.ui.theme.Margin
import com.infomaniak.swisstransfer.ui.theme.Shapes
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme

private val LARGE_BUTTON_HEIGHT = 56.dp

@Composable
fun LargeButton(
modifier: Modifier = Modifier,
Expand All @@ -47,7 +49,7 @@ fun LargeButton(
imageVector: ImageVector? = null,
) {
Button(
modifier = modifier.height(56.dp),
modifier = modifier.height(LARGE_BUTTON_HEIGHT),
colors = style.buttonColors(),
shape = Shapes.medium,
enabled = enabled,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -131,15 +131,15 @@ private fun BottomSheetDefaultsPreview() {
modifier = it,
titleRes = R.string.appName,
style = ButtonType.ERROR,
onClick = { /*TODO*/ },
onClick = {},
)
},
bottomButton = {
LargeButton(
modifier = it,
titleRes = R.string.appName,
style = ButtonType.TERTIARY,
onClick = { /*TODO*/ },
onClick = {},
)
},
)
Expand Down
122 changes: 122 additions & 0 deletions app/src/main/java/com/infomaniak/swisstransfer/ui/icons/app/Camera.kt
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
package com.infomaniak.swisstransfer.ui.icons.app

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.padding
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.Butt
import androidx.compose.ui.graphics.StrokeJoin.Companion.Miter
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.ImageVector.Builder
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.Camera: ImageVector
get() {
if (_camera != null) {
return _camera!!
}
_camera = Builder(
name = "Camera",
defaultWidth = 24.0.dp,
defaultHeight = 24.0.dp,
viewportWidth = 24.0f,
viewportHeight = 24.0f
).apply {
path(
fill = null,
stroke = SolidColor(Color(0xFF9f9f9f)),
strokeLineWidth = 1.469f,
strokeLineCap = Butt,
strokeLineJoin = Miter,
strokeLineMiter = 4.0f,
pathFillType = NonZero
) {
moveTo(2.698f, 7.115f)
lineToRelative(0.027f, -0.98f)
arcToRelative(0.995f, 0.995f, 0.0f, false, true, 0.952f, -0.979f)
horizontalLineTo(4.6f)
arcToRelative(1.046f, 1.046f, 0.0f, false, true, 1.034f, 0.98f)
verticalLineToRelative(0.978f)
}
path(
fill = null,
stroke = SolidColor(Color(0xFF9f9f9f)),
strokeLineWidth = 1.469f,
strokeLineCap = Butt,
strokeLineJoin = Miter,
strokeLineMiter = 4.0f,
pathFillType = NonZero
) {
moveTo(19.96f, 7.115f)
arcToRelative(0.98f, 0.98f, 0.0f, false, true, -0.886f, -0.565f)
curveToRelative(-0.531f, -1.137f, -1.101f, -2.373f, -2.178f, -2.373f)
horizontalLineTo(12.0f)
curveToRelative(-0.912f, 0.0f, -1.37f, 0.817f, -2.644f, 2.538f)
arcToRelative(0.98f, 0.98f, 0.0f, false, true, -0.783f, 0.4f)
horizontalLineTo(2.698f)
curveToRelative(-1.469f, 0.0f, -1.959f, 0.664f, -1.959f, 1.687f)
verticalLineToRelative(10.171f)
curveToRelative(0.0f, 1.022f, 0.49f, 1.85f, 2.014f, 1.85f)
horizontalLineToRelative(18.494f)
curveToRelative(1.524f, 0.0f, 2.014f, -0.828f, 2.014f, -1.85f)
verticalLineTo(8.802f)
curveToRelative(0.0f, -1.023f, -0.49f, -1.687f, -2.014f, -1.687f)
close()
}
path(
fill = null,
stroke = SolidColor(Color(0xFF9f9f9f)),
strokeLineWidth = 1.469f,
strokeLineCap = Butt,
strokeLineJoin = Miter,
strokeLineMiter = 4.0f,
pathFillType = NonZero
) {
moveTo(14.448f, 18.865f)
arcToRelative(5.386f, 5.386f, 0.0f, true, false, 0.0f, -10.771f)
arcToRelative(5.386f, 5.386f, 0.0f, false, false, 0.0f, 10.77f)
close()
}
path(
fill = null,
stroke = SolidColor(Color(0xFF9f9f9f)),
strokeLineWidth = 1.469f,
strokeLineCap = Butt,
strokeLineJoin = Miter,
strokeLineMiter = 4.0f,
pathFillType = NonZero
) {
moveTo(14.448f, 16.417f)
arcToRelative(2.937f, 2.937f, 0.0f, true, false, 0.0f, -5.875f)
arcToRelative(2.937f, 2.937f, 0.0f, false, false, 0.0f, 5.875f)
close()
moveTo(4.167f, 12.01f)
arcToRelative(1.469f, 1.469f, 0.0f, true, false, 0.0f, -2.937f)
arcToRelative(1.469f, 1.469f, 0.0f, false, false, 0.0f, 2.937f)
close()
}
}.build()
return _camera!!
}

private var _camera: ImageVector? = null

@Preview
@Composable
private fun Preview() {
Box {
Image(
imageVector = AppIcons.Camera,
contentDescription = null,
modifier = Modifier.size(AppIcons.previewSize)
)
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
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.Butt
import androidx.compose.ui.graphics.StrokeJoin.Companion.Miter
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.ImageVector.Builder
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.Folder: ImageVector
get() {
if (_folder != null) {
return _folder!!
}
_folder = Builder(
name = "Folder",
defaultWidth = 24.0.dp,
defaultHeight = 24.0.dp,
viewportWidth = 24.0f,
viewportHeight = 24.0f
).apply {
path(
fill = null,
stroke = SolidColor(Color(0xFF9f9f9f)),
strokeLineWidth = 1.5f,
strokeLineCap = Butt,
strokeLineJoin = Miter,
strokeLineMiter = 4.0f,
pathFillType = NonZero
) {
moveTo(23.25f, 6.75f)
arcToRelative(1.5f, 1.5f, 0.0f, false, false, -1.5f, -1.5f)
horizontalLineTo(10.5f)
lineToRelative(-1.8f, -2.4f)
arcToRelative(1.5f, 1.5f, 0.0f, false, false, -1.2f, -0.6f)
horizontalLineTo(2.25f)
arcToRelative(1.5f, 1.5f, 0.0f, false, false, -1.5f, 1.5f)
verticalLineToRelative(16.5f)
arcToRelative(1.5f, 1.5f, 0.0f, false, false, 1.5f, 1.5f)
horizontalLineToRelative(19.5f)
arcToRelative(1.5f, 1.5f, 0.0f, false, false, 1.5f, -1.5f)
close()
}
}.build()
return _folder!!
}

private var _folder: ImageVector? = null

@Preview
@Composable
private fun Preview() {
Box {
Image(
imageVector = AppIcons.Folder,
contentDescription = null,
modifier = Modifier.size(AppIcons.previewSize)
)
}
}
Loading

0 comments on commit 2b71385

Please sign in to comment.