From e198e930904cbd05bb6111b72fc8e5e9392988d5 Mon Sep 17 00:00:00 2001 From: Maxime NATUREL <46314705+mnaturel@users.noreply.github.com> Date: Tue, 7 Mar 2023 14:44:13 +0100 Subject: [PATCH] TextIconButton component --- .../createroom/root/CreateRoomRootScreen.kt | 38 +-------- .../components/button/TextIconButton.kt | 83 +++++++++++++++++++ 2 files changed, 87 insertions(+), 34 deletions(-) create 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 46d06df9db..970bd985f8 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,13 +16,10 @@ package io.element.android.features.createroom.root -import androidx.compose.foundation.Image import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.size import androidx.compose.material3.ExperimentalMaterial3Api -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.SearchBarDefaults import androidx.compose.runtime.Composable import androidx.compose.runtime.MutableState @@ -33,9 +30,7 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.draw.alpha import androidx.compose.ui.graphics.Color -import androidx.compose.ui.graphics.ColorFilter import androidx.compose.ui.graphics.vector.ImageVector -import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.platform.LocalFocusManager import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.vectorResource @@ -44,16 +39,16 @@ 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.components.button.BackButton import io.element.android.libraries.designsystem.theme.components.CenterAlignedTopAppBar import io.element.android.libraries.designsystem.theme.components.DockedSearchBar import io.element.android.libraries.designsystem.theme.components.Icon import io.element.android.libraries.designsystem.theme.components.IconButton import io.element.android.libraries.designsystem.theme.components.Scaffold import io.element.android.libraries.designsystem.theme.components.Text -import io.element.android.libraries.designsystem.theme.components.TextButton import io.element.android.libraries.designsystem.R as DrawableR import io.element.android.libraries.ui.strings.R as StringR @@ -85,14 +80,14 @@ fun CreateRoomRootScreen( ) if (!isSearchActive.value) { - CreateRoomButton( + TextIconButton( modifier = Modifier.padding(horizontal = 8.dp), imageVector = ImageVector.vectorResource(DrawableR.drawable.ic_group), text = stringResource(id = StringR.string.new_room), onClick = onNewRoomClicked, ) - CreateRoomButton( + TextIconButton( modifier = Modifier.padding(horizontal = 8.dp), imageVector = ImageVector.vectorResource(DrawableR.drawable.ic_share), text = stringResource(id = StringR.string.invite_people_menu), @@ -182,31 +177,6 @@ fun CreateRoomSearchBar( ) } -@Composable -fun CreateRoomButton( - imageVector: ImageVector, - text: String, - modifier: Modifier = Modifier, - onClick: () -> Unit = {}, -) { - TextButton( - modifier = modifier, - onClick = onClick - ) { - Image( - imageVector = imageVector, - contentDescription = "", - modifier = Modifier.size(24.dp), - contentScale = ContentScale.Inside, - colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.primary) - ) - Text( - modifier = Modifier.padding(horizontal = 8.dp), - 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 new file mode 100644 index 0000000000..3fd8d1c348 --- /dev/null +++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/TextIconButton.kt @@ -0,0 +1,83 @@ +/* + * 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_group), + text = "Click me!", + onClick = {}, + ) + } +}