From 3fc55a8d95eeb3f8df2062d09f84d77093e06ff2 Mon Sep 17 00:00:00 2001 From: Florian Renaud Date: Wed, 8 Mar 2023 11:51:59 +0100 Subject: [PATCH] Rework create room action buttons and remove custom TextIconButton --- .../createroom/root/CreateRoomRootScreen.kt | 72 ++++++++++++---- .../components/button/TextIconButton.kt | 83 ------------------- 2 files changed, 56 insertions(+), 99 deletions(-) delete mode 100644 libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/TextIconButton.kt diff --git a/features/createroom/src/main/kotlin/io/element/android/features/createroom/root/CreateRoomRootScreen.kt b/features/createroom/src/main/kotlin/io/element/android/features/createroom/root/CreateRoomRootScreen.kt index 0e6d8253a3..d04eb22bd1 100644 --- a/features/createroom/src/main/kotlin/io/element/android/features/createroom/root/CreateRoomRootScreen.kt +++ b/features/createroom/src/main/kotlin/io/element/android/features/createroom/root/CreateRoomRootScreen.kt @@ -16,8 +16,13 @@ package io.element.android.features.createroom.root +import androidx.annotation.DrawableRes +import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.heightIn import androidx.compose.foundation.layout.padding import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Close @@ -29,20 +34,18 @@ import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.alpha import androidx.compose.ui.graphics.Color -import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.platform.LocalFocusManager import androidx.compose.ui.res.stringResource -import androidx.compose.ui.res.vectorResource import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.PreviewParameter import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import io.element.android.libraries.designsystem.components.button.BackButton -import io.element.android.libraries.designsystem.components.button.TextIconButton import io.element.android.libraries.designsystem.preview.ElementPreviewDark import io.element.android.libraries.designsystem.preview.ElementPreviewLight import io.element.android.libraries.designsystem.theme.components.CenterAlignedTopAppBar @@ -74,7 +77,8 @@ fun CreateRoomRootScreen( } ) { paddingValues -> Column( - modifier = Modifier.padding(paddingValues) + modifier = Modifier.padding(paddingValues), + verticalArrangement = Arrangement.spacedBy(8.dp), ) { CreateRoomSearchBar( modifier = Modifier.fillMaxWidth(), @@ -86,18 +90,9 @@ fun CreateRoomRootScreen( ) if (!isSearchActive) { - TextIconButton( - modifier = Modifier.padding(start = 8.dp, top = 16.dp, end = 8.dp), - imageVector = ImageVector.vectorResource(DrawableR.drawable.ic_groups), - text = stringResource(id = StringR.string.new_room), - onClick = onNewRoomClicked, - ) - - TextIconButton( - modifier = Modifier.padding(horizontal = 8.dp), - imageVector = ImageVector.vectorResource(DrawableR.drawable.ic_share), - text = stringResource(id = StringR.string.invite_people_menu), - onClick = onInvitePeopleClicked, + CreateRoomActionButtonsList( + onNewRoomClicked = onNewRoomClicked, + onInvitePeopleClicked = onInvitePeopleClicked, ) } } @@ -180,6 +175,51 @@ fun CreateRoomSearchBar( ) } +@Composable +fun CreateRoomActionButtonsList( + modifier: Modifier = Modifier, + onNewRoomClicked: () -> Unit = {}, + onInvitePeopleClicked: () -> Unit = {}, +) { + Column(modifier = modifier) { + CreateRoomActionButton( + iconRes = DrawableR.drawable.ic_groups, + text = stringResource(id = StringR.string.new_room), + onClick = onNewRoomClicked, + ) + CreateRoomActionButton( + iconRes = DrawableR.drawable.ic_share, + text = stringResource(id = StringR.string.invite_people_menu), + onClick = onInvitePeopleClicked, + ) + } +} + +@Composable +fun CreateRoomActionButton( + @DrawableRes iconRes: Int, + text: String, + modifier: Modifier = Modifier, + onClick: () -> Unit = {}, +) { + Row( + modifier = modifier + .fillMaxWidth() + .heightIn(min = 56.dp) + .clickable { onClick() } + .padding(horizontal = 16.dp), + horizontalArrangement = Arrangement.spacedBy(16.dp), + verticalAlignment = Alignment.CenterVertically, + ) { + Icon( + modifier = Modifier.alpha(0.5f), // FIXME align on Design system theme (removing alpha should be fine) + resourceId = iconRes, + contentDescription = null, + ) + Text(text = text) + } +} + @Preview @Composable fun CreateRoomRootViewLightPreview(@PreviewParameter(CreateRoomRootStateProvider::class) state: CreateRoomRootState) = diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/TextIconButton.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/TextIconButton.kt deleted file mode 100644 index 980dc39aa6..0000000000 --- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/TextIconButton.kt +++ /dev/null @@ -1,83 +0,0 @@ -/* - * Copyright (c) 2023 New Vector Ltd - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -package io.element.android.libraries.designsystem.components.button - -import androidx.compose.foundation.Image -import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.size -import androidx.compose.material3.MaterialTheme -import androidx.compose.runtime.Composable -import androidx.compose.ui.Modifier -import androidx.compose.ui.graphics.ColorFilter -import androidx.compose.ui.graphics.vector.ImageVector -import androidx.compose.ui.layout.ContentScale -import androidx.compose.ui.res.vectorResource -import androidx.compose.ui.tooling.preview.Preview -import androidx.compose.ui.unit.Dp -import androidx.compose.ui.unit.dp -import io.element.android.libraries.designsystem.R -import io.element.android.libraries.designsystem.preview.ElementPreviewDark -import io.element.android.libraries.designsystem.preview.ElementPreviewLight -import io.element.android.libraries.designsystem.theme.components.Text -import io.element.android.libraries.designsystem.theme.components.TextButton - -@Composable -fun TextIconButton( - imageVector: ImageVector, - text: String, - modifier: Modifier = Modifier, - iconSize: Dp = 24.dp, - onClick: () -> Unit = {}, -) { - TextButton( - modifier = modifier, - onClick = onClick - ) { - Image( - imageVector = imageVector, - contentDescription = "", - modifier = Modifier.size(iconSize), - contentScale = ContentScale.Inside, - colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.primary), - ) - Text( - modifier = Modifier.padding(horizontal = 8.dp), - text = text, - ) - } -} - -@Preview -@Composable -internal fun TextIconButtonPreviewLight() = ElementPreviewLight { ContentToPreview() } - -@Preview -@Composable -internal fun TextIconButtonPreviewDark() = ElementPreviewDark { ContentToPreview() } - -@Composable -private fun ContentToPreview() { - Column { - TextIconButton( - modifier = Modifier.padding(horizontal = 8.dp), - imageVector = ImageVector.vectorResource(R.drawable.ic_groups), - text = "Click me!", - onClick = {}, - ) - } -}