Fix button styles

This commit is contained in:
Andrew 2024-06-14 14:57:38 +09:30
parent 4e4ffc02ec
commit 962d4e9a28
18 changed files with 241 additions and 197 deletions

View File

@ -7,7 +7,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
@ -23,7 +22,7 @@ import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.NoOpCallbacks
import org.thoughtcrime.securesms.ui.OptionsCard
import org.thoughtcrime.securesms.ui.RadioOption
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.SlimOutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.extraSmall
import org.thoughtcrime.securesms.ui.fadingEdges
@ -62,7 +61,7 @@ fun DisappearingMessages(
}
}
if (state.showSetButton) SessionOutlinedButton(
if (state.showSetButton) SlimOutlineButton(
stringResource(R.string.disappearing_messages_set_button_title),
modifier = Modifier
.contentDescription(R.string.AccessibilityId_set_button)

View File

@ -14,6 +14,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.pager.HorizontalPager
import androidx.compose.foundation.pager.rememberPagerState
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
@ -42,19 +43,17 @@ import org.thoughtcrime.securesms.conversation.v2.ConversationActivityV2
import org.thoughtcrime.securesms.dependencies.DatabaseComponent
import org.thoughtcrime.securesms.showOpenUrlDialog
import org.thoughtcrime.securesms.ui.LoadingArcOr
import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.Palette
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.components.AppBar
import org.thoughtcrime.securesms.ui.components.BorderlessButtonWithIcon
import org.thoughtcrime.securesms.ui.components.MaybeScanQrCode
import org.thoughtcrime.securesms.ui.components.MediumButtonSize
import org.thoughtcrime.securesms.ui.components.SessionButtonText
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField
import org.thoughtcrime.securesms.ui.components.SessionTabRow
import org.thoughtcrime.securesms.ui.components.SlimOutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.onCreateView
@ -171,18 +170,17 @@ fun EnterAccountId(
) { onHelp() }
}
SessionOutlinedButton(
SlimOutlineButton(
modifier = Modifier
.align(Alignment.CenterHorizontally)
.padding(horizontal = LocalDimensions.current.marginLarge)
.fillMaxWidth()
.contentDescription(R.string.next),
size = MediumButtonSize,
enabled = state.isNextButtonEnabled,
onClick = { callbacks.onContinue() }
) {
LoadingArcOr(state.loading) {
SessionButtonText(stringResource(R.string.next), enabled = state.isNextButtonEnabled)
Text(stringResource(R.string.next))
}
}
}

View File

@ -33,10 +33,8 @@ import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.AppBar
import org.thoughtcrime.securesms.ui.components.MediumButtonSize
import org.thoughtcrime.securesms.ui.components.SessionOutlinedCopyButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.SmallButtonSize
import org.thoughtcrime.securesms.ui.components.SlimOutlineButton
import org.thoughtcrime.securesms.ui.components.SlimOutlineCopyButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.onCreateView
import org.thoughtcrime.securesms.ui.small
@ -110,19 +108,16 @@ private fun InviteFriend(
modifier = Modifier.padding(horizontal = 8.dp)
)
Row(horizontalArrangement = spacedBy(20.dp)) {
SessionOutlinedButton(
SlimOutlineButton(
stringResource(R.string.share),
modifier = Modifier
.weight(1f)
.contentDescription("Share button"),
size = MediumButtonSize,
color = LocalPalette.current.text,
onClick = sendInvitation
)
SessionOutlinedCopyButton(
SlimOutlineCopyButton(
modifier = Modifier.weight(1f),
size = MediumButtonSize,
color = LocalPalette.current.text,
onClick = copyPublicKey
)

View File

@ -73,7 +73,6 @@ import org.thoughtcrime.securesms.ui.TitledText
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.baseMonospace
import org.thoughtcrime.securesms.ui.blackAlpha40
import org.thoughtcrime.securesms.ui.components.SessionButtonText
import org.thoughtcrime.securesms.ui.destructiveButtonColors
import org.thoughtcrime.securesms.ui.setComposeContent
import javax.inject.Inject
@ -393,7 +392,7 @@ fun TitledText(
@Composable
fun TitledView(title: GetString, modifier: Modifier = Modifier, content: @Composable () -> Unit) {
Column(modifier = modifier, verticalArrangement = Arrangement.spacedBy(4.dp)) {
SessionButtonText(text = title.string())
Text(title.string())
content()
}
}

View File

@ -16,13 +16,10 @@ import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.requiredWidth
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
@ -96,14 +93,14 @@ import org.thoughtcrime.securesms.preferences.SettingsActivity
import org.thoughtcrime.securesms.showMuteDialog
import org.thoughtcrime.securesms.showSessionDialog
import org.thoughtcrime.securesms.ui.Divider
import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.Palette
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.SessionShieldIcon
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.SlimOutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h4
import org.thoughtcrime.securesms.ui.h8
@ -407,7 +404,7 @@ class HomeActivity : PassphraseRequiredActionBarActivity(),
)
}
Spacer(Modifier.width(LocalDimensions.current.marginExtraExtraSmall))
SessionOutlinedButton(
SlimOutlineButton(
text = stringResource(R.string.continue_2),
modifier = Modifier
.align(Alignment.CenterVertically)

View File

@ -21,7 +21,6 @@ import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Card
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
@ -46,14 +45,14 @@ import org.thoughtcrime.securesms.crypto.IdentityKeyUtil
import org.thoughtcrime.securesms.onboarding.pickname.startPickDisplayNameActivity
import org.thoughtcrime.securesms.service.KeyCachingService
import org.thoughtcrime.securesms.showOpenUrlDialog
import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.Palette
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.components.BorderlessHtmlButton
import org.thoughtcrime.securesms.ui.components.FilledButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.PrimaryFillButton
import org.thoughtcrime.securesms.ui.components.PrimaryOutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h4
import org.thoughtcrime.securesms.ui.large
@ -153,7 +152,7 @@ class LandingActivity : BaseActionBarActivity() {
}
Column(modifier = Modifier.padding(horizontal = LocalDimensions.current.marginLarge)) {
FilledButton(
PrimaryFillButton(
text = stringResource(R.string.onboardingAccountCreate),
modifier = Modifier
.fillMaxWidth()
@ -161,13 +160,13 @@ class LandingActivity : BaseActionBarActivity() {
.contentDescription(R.string.AccessibilityId_create_account_button),
onClick = ::startPickDisplayNameActivity
)
Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingSmall))
SessionOutlinedButton(
text = stringResource(R.string.onboardingAccountExists),
Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingExtraSmall))
PrimaryOutlineButton(
stringResource(R.string.onboardingAccountExists),
modifier = Modifier
.fillMaxWidth()
.align(Alignment.CenterHorizontally)
.contentDescription(R.string.AccessibilityId_restore_account_button)
.contentDescription(R.string.AccessibilityId_restore_account_button),
) { start<LinkDeviceActivity>() }
BorderlessHtmlButton(
textId = R.string.onboardingTosPrivacy,

View File

@ -14,14 +14,12 @@ import androidx.compose.foundation.layout.width
import androidx.compose.foundation.pager.HorizontalPager
import androidx.compose.foundation.pager.rememberPagerState
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
@ -35,17 +33,14 @@ import org.thoughtcrime.securesms.BaseActionBarActivity
import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.baseBold
import org.thoughtcrime.securesms.ui.components.MaybeScanQrCode
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField
import org.thoughtcrime.securesms.ui.components.SessionTabRow
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h4
import org.thoughtcrime.securesms.ui.setComposeContent
import org.thoughtcrime.securesms.util.start
import javax.inject.Inject
private const val TAG = "LinkDeviceActivity"
@ -152,7 +147,7 @@ fun RecoveryPassword(state: LinkDeviceState, onChange: (String) -> Unit = {}, on
error = state.error
)
Spacer(Modifier.weight(2f))
SessionOutlinedButton(
OutlineButton(
stringResource(R.string.continue_2),
modifier = Modifier
.align(Alignment.CenterHorizontally)

View File

@ -32,7 +32,7 @@ import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.NotificationRadioButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h4
import org.thoughtcrime.securesms.ui.setComposeContent
@ -112,7 +112,7 @@ fun MessageNotificationsScreen(
)
}
Spacer(Modifier.weight(1f))
SessionOutlinedButton(
OutlineButton(
stringResource(R.string.continue_2),
modifier = Modifier
.padding(horizontal = LocalDimensions.current.marginLarge)

View File

@ -10,13 +10,11 @@ import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
@ -28,9 +26,8 @@ import org.thoughtcrime.securesms.ApplicationContext
import org.thoughtcrime.securesms.BaseActionBarActivity
import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h4
@ -106,7 +103,7 @@ class PickDisplayNameActivity : BaseActionBarActivity() {
Spacer(modifier = Modifier.weight(2f))
SessionOutlinedButton(
OutlineButton(
stringResource(R.string.continue_2),
modifier = Modifier
.contentDescription(R.string.AccessibilityId_continue)

View File

@ -31,6 +31,7 @@ import androidx.compose.ui.unit.dp
import network.loki.messenger.R
import org.thoughtcrime.securesms.BaseActionBarActivity
import org.thoughtcrime.securesms.showSessionDialog
import org.thoughtcrime.securesms.ui.Cell
import org.thoughtcrime.securesms.ui.CellWithPaddingAndMargin
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.LocalPalette
@ -39,10 +40,9 @@ import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.SessionShieldIcon
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.SessionOutlinedCopyButton
import org.thoughtcrime.securesms.ui.components.QrImage
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.SmallButtonSize
import org.thoughtcrime.securesms.ui.components.SlimOutlineButton
import org.thoughtcrime.securesms.ui.components.SlimOutlineCopyButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.extraSmallMonospace
import org.thoughtcrime.securesms.ui.h8
@ -160,26 +160,21 @@ fun RecoveryPasswordCell(seed: String, copySeed:() -> Unit = {}) {
AnimatedVisibility(!showQr) {
Row(horizontalArrangement = Arrangement.spacedBy(LocalDimensions.current.marginMedium)) {
SessionOutlinedCopyButton(
SlimOutlineCopyButton(
Modifier.weight(1f),
color = LocalPalette.current.text,
size = SmallButtonSize,
onClick = copySeed
)
SessionOutlinedButton(
text = stringResource(R.string.qrView),
SlimOutlineButton(
stringResource(R.string.qrView),
modifier = Modifier.weight(1f),
color = LocalPalette.current.text,
size = SmallButtonSize,
onClick = { showQr = !showQr }
)
}
}
AnimatedVisibility(showQr, modifier = Modifier.align(Alignment.CenterHorizontally)) {
SessionOutlinedButton(
text = stringResource(R.string.recoveryPasswordView),
color = LocalPalette.current.text,
SlimOutlineButton(
stringResource(R.string.recoveryPasswordView),
onClick = { showQr = !showQr }
)
}
@ -223,7 +218,7 @@ private fun HideRecoveryPasswordCell(onHide: () -> Unit = {}) {
)
}
Spacer(modifier = Modifier.width(LocalDimensions.current.marginExtraExtraSmall))
SessionOutlinedButton(
SlimOutlineButton(
text = stringResource(R.string.hide),
modifier = Modifier
.wrapContentWidth()

View File

@ -78,8 +78,8 @@ import org.thoughtcrime.securesms.ui.Divider
import org.thoughtcrime.securesms.ui.ItemButton
import org.thoughtcrime.securesms.ui.ItemButtonWithDrawable
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.components.SessionOutlinedCopyButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedButton
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.components.OutlineCopyButton
import org.thoughtcrime.securesms.ui.destructiveButtonColors
import org.thoughtcrime.securesms.ui.setContentWithTheme
import org.thoughtcrime.securesms.util.BitmapDecodingException
@ -390,13 +390,13 @@ class SettingsActivity : PassphraseRequiredActionBarActivity() {
.padding(top = LocalDimensions.current.marginTiny),
horizontalArrangement = Arrangement.spacedBy(LocalDimensions.current.itemSpacingSmall),
) {
SessionOutlinedButton(
OutlineButton(
stringResource(R.string.share),
modifier = Modifier.weight(1f),
onClick = { sendInvitationToUseSession() }
)
SessionOutlinedCopyButton(
OutlineCopyButton(
modifier = Modifier.weight(1f),
onClick = ::copyPublicKey,
)

View File

@ -193,8 +193,12 @@ fun ItemButton(
}
@Composable
fun Cell(content: @Composable () -> Unit) {
CellWithPaddingAndMargin(padding = 0.dp) { content() }
fun Cell(
padding: Dp = 0.dp,
margin: Dp = 32.dp,
content: @Composable () -> Unit
) {
CellWithPaddingAndMargin(padding, margin) { content() }
}
@Composable
fun CellNoMargin(content: @Composable () -> Unit) {

View File

@ -71,20 +71,6 @@ val blackAlpha40 = Color.Black.copy(alpha = 0.4f)
val LocalPalette = staticCompositionLocalOf<Palette> { ClassicDark() }
interface Palette {
@Composable
fun outlinedButtonColors(color: Color) = ButtonDefaults.outlinedButtonColors(
contentColor = color,
backgroundColor = Color.Unspecified,
disabledContentColor = disabled
)
@Composable
fun filledButtonColors() = ButtonDefaults.outlinedButtonColors(
contentColor = background,
backgroundColor = primary,
disabledContentColor = disabled
)
val isLight: Boolean
val primary: Color
val danger: Color

View File

@ -8,7 +8,10 @@ import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.selection.LocalTextSelectionColors
import androidx.compose.foundation.text.selection.TextSelectionColors
import androidx.compose.material.Colors
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.LocalContentColor
import androidx.compose.material.LocalMinimumInteractiveComponentEnforcement
import androidx.compose.material.LocalTextStyle
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Shapes
import androidx.compose.runtime.Composable
@ -33,6 +36,7 @@ fun SessionMaterialTheme(
/**
* Apply a given [Palette], and our typography and shapes as a Material 2 Compose Theme.
**/
@OptIn(ExperimentalMaterialApi::class)
@Composable
fun SessionMaterialTheme(
palette: Palette,
@ -51,7 +55,7 @@ fun SessionMaterialTheme(
CompositionLocalProvider(
LocalPalette provides palette,
LocalContentColor provides palette.text,
LocalTextSelectionColors provides textSelectionColors
LocalTextSelectionColors provides textSelectionColors,
) {
content()
}
@ -92,6 +96,7 @@ fun PreviewTheme(
SessionMaterialTheme(palette) {
Box(modifier = Modifier.background(color = LocalPalette.current.background)) {
content()
LocalTextStyle
}
}
}

View File

@ -11,8 +11,7 @@ import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.ButtonDefaults
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedButton
import androidx.compose.material.LocalTextStyle
import androidx.compose.material.RadioButton
import androidx.compose.material.Text
import androidx.compose.material.TextButton
@ -28,7 +27,6 @@ import androidx.compose.ui.unit.dp
import kotlinx.coroutines.flow.filter
import org.thoughtcrime.securesms.ui.GetString
import org.thoughtcrime.securesms.ui.LocalPalette
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.baseBold
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.extraSmall
@ -37,45 +35,6 @@ import org.thoughtcrime.securesms.ui.h9
import org.thoughtcrime.securesms.ui.radioButtonColors
import org.thoughtcrime.securesms.ui.small
val LocalButtonTextStyle = staticCompositionLocalOf { baseBold }
/**
* Text to be used in buttons.
*
* This text gets its style from [LocalButtonTextStyle] which may vary if button size is changed
* by passing in a [ButtonSize] to some Session Button.
*/
@Composable
fun SessionButtonText(
text: String,
modifier: Modifier = Modifier,
style: TextStyle = LocalButtonTextStyle.current,
color: Color = LocalPalette.current.buttonOutline,
enabled: Boolean = true
) {
Text(
modifier = modifier,
text = text,
style = style,
color = if (enabled) color else LocalPalette.current.disabled
)
}
@Composable
fun FilledButton(
text: String,
modifier: Modifier = Modifier,
onClick: () -> Unit
) {
OutlinedButton(
modifier = modifier,
onClick = onClick,
colors = LocalPalette.current.filledButtonColors()
) {
SessionButtonText(text, color = LocalPalette.current.background)
}
}
@Composable
fun BorderlessButton(
modifier: Modifier = Modifier,
@ -171,11 +130,12 @@ fun NotificationRadioButton(
onClick: () -> Unit = {}
) {
Row {
SessionOutlinedButton(
Button(
onClick = onClick,
modifier = Modifier
.weight(1f)
.contentDescription(contentDescription),
type = ButtonType.Outline,
color = LocalPalette.current.text,
border = BorderStroke(
width = ButtonDefaults.OutlinedBorderSize,

View File

@ -1,6 +1,9 @@
package org.thoughtcrime.securesms.ui.components
import android.annotation.SuppressLint
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.LocalMinimumInteractiveComponentEnforcement
import androidx.compose.material.LocalTextStyle
import androidx.compose.material.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
@ -13,9 +16,13 @@ import org.thoughtcrime.securesms.ui.extraSmallBold
import org.thoughtcrime.securesms.ui.smallBold
interface ButtonSize {
@OptIn(ExperimentalMaterialApi::class)
@SuppressLint("ComposableNaming")
@Composable fun applyTextStyle(content: @Composable () -> Unit) {
CompositionLocalProvider(LocalButtonTextStyle provides textStyle) {
@Composable fun applyConstraints(content: @Composable () -> Unit) {
CompositionLocalProvider(
LocalMinimumInteractiveComponentEnforcement provides false,
LocalTextStyle provides textStyle,
) {
content()
}
}
@ -34,7 +41,7 @@ object MediumButtonSize: ButtonSize {
override val minHeight = 34.dp
}
object SmallButtonSize: ButtonSize {
object SlimButtonSize: ButtonSize {
override val textStyle @Composable get() = extraSmallBold
override val minHeight = 29.dp
}

View File

@ -21,7 +21,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Scaffold
import androidx.compose.material.Snackbar
import androidx.compose.material.SnackbarHost
@ -97,7 +96,7 @@ fun MaybeScanQrCode(
textAlign = TextAlign.Center
)
Spacer(modifier = Modifier.size(20.dp))
SessionOutlinedButton(
OutlineButton(
stringResource(R.string.sessionSettings),
modifier = Modifier.align(Alignment.CenterHorizontally),
onClick = onClickSettings
@ -105,7 +104,7 @@ fun MaybeScanQrCode(
}
} else {
Box(modifier = Modifier.fillMaxSize().padding(LocalDimensions.current.marginLarge)) {
SessionOutlinedButton(
SlimOutlineButton(
stringResource(R.string.cameraGrantAccess),
modifier = Modifier
.align(Alignment.Center)

View File

@ -1,17 +1,18 @@
package org.thoughtcrime.securesms.ui.components
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.Crossfade
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.RowScope
import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.wrapContentWidth
import androidx.compose.material.ButtonColors
import androidx.compose.material.ButtonDefaults
import androidx.compose.material.ButtonElevation
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedButton
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
@ -32,56 +33,66 @@ import org.thoughtcrime.securesms.ui.contentDescription
import kotlin.time.Duration
import kotlin.time.Duration.Companion.seconds
//@Composable
//fun OutlineButton(
// text: String,
// modifier: Modifier = Modifier,
// size: ButtonSize = LargeButtonSize,
// color: Color = LocalPalette.current.buttonOutline,
// onClick: () -> Unit
//) {
// OutlineButton(
// modifier = modifier,
// size = size,
// color = color,
// onClick = onClick
// ) {
// SessionButtonText(text = text, style = size.textStyle, color = color)
// }
//}
//
///**
// * Base implementation of [SessionOutlinedButton]
// */
//@Composable
//fun OutlineButton(
// modifier: Modifier = Modifier,
// size: ButtonSize = LargeButtonSize,
// enabled: Boolean = true,
// interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
// color: Color = LocalPalette.current.buttonOutline,
// border: BorderStroke = BorderStroke(1.dp, if (enabled) color else LocalPalette.current.disabled),
// shape: Shape = MaterialTheme.shapes.small,
// onClick: () -> Unit,
// content: @Composable () -> Unit = {}
//) {
// Button(
// modifier = modifier.heightIn(min = size.minHeight),
// enabled = enabled,
// interactionSource = interactionSource,
// onClick = onClick,
// border = border,
// shape = shape,
// type = ButtonType.Outline,
// color = color
// ) {
// size.applyTextStyle {
// content()
// }
// }
//}
@Composable
fun SessionOutlinedButton(
text: String,
fun SlimOutlineCopyButton(
modifier: Modifier = Modifier,
size: ButtonSize = LargeButtonSize,
color: Color = LocalPalette.current.buttonOutline,
onClick: () -> Unit
) {
SessionOutlinedButton(
modifier = modifier,
size = size,
color = color,
onClick = onClick
) {
SessionButtonText(text = text, style = size.textStyle, color = color)
}
}
/**
* Base implementation of [SessionOutlinedButton]
*/
@Composable
fun SessionOutlinedButton(
modifier: Modifier = Modifier,
size: ButtonSize = LargeButtonSize,
enabled: Boolean = true,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
color: Color = LocalPalette.current.buttonOutline,
border: BorderStroke = BorderStroke(1.dp, if (enabled) color else LocalPalette.current.disabled),
shape: Shape = MaterialTheme.shapes.small,
onClick: () -> Unit,
content: @Composable () -> Unit = {}
) {
OutlinedButton(
modifier = modifier.heightIn(min = size.minHeight),
enabled = enabled,
interactionSource = interactionSource,
onClick = onClick,
border = border,
shape = shape,
colors = LocalPalette.current.outlinedButtonColors(color)
) {
size.applyTextStyle {
content()
}
}
OutlineCopyButton(modifier, SlimButtonSize, color, onClick)
}
@Composable
fun SessionOutlinedCopyButton(
fun OutlineCopyButton(
modifier: Modifier = Modifier,
size: ButtonSize = LargeButtonSize,
color: Color = LocalPalette.current.buttonOutline,
@ -89,27 +100,18 @@ fun SessionOutlinedCopyButton(
) {
val interactionSource = remember { MutableInteractionSource() }
SessionOutlinedButton(
Button(
modifier = modifier.contentDescription(R.string.AccessibilityId_copy_button),
size = size,
interactionSource = interactionSource,
size = size,
type = ButtonType.Outline,
color = color,
onClick = onClick
) {
TemporaryClickedContent(
interactionSource = interactionSource,
content = {
SessionButtonText(
text = stringResource(R.string.copy),
color = color
)
},
temporaryContent = {
SessionButtonText(
text = stringResource(R.string.copied),
color = color
)
}
content = { Text(stringResource(R.string.copy)) },
temporaryContent = { Text(stringResource(R.string.copied)) }
)
}
}
@ -143,3 +145,110 @@ fun TemporaryClickedContent(
}
}
}
interface ButtonType {
@Composable fun border(color: Color, enabled: Boolean): BorderStroke?
@Composable fun buttonColors(color: Color): ButtonColors
val elevation: ButtonElevation? @Composable get
object Outline: ButtonType {
@Composable override fun border(color: Color, enabled: Boolean) = BorderStroke(1.dp, if (enabled) color else LocalPalette.current.disabled)
@Composable override fun buttonColors(color: Color) = ButtonDefaults.buttonColors(
contentColor = color,
backgroundColor = Color.Unspecified,
disabledContentColor = LocalPalette.current.disabled,
disabledBackgroundColor = Color.Unspecified
)
override val elevation: ButtonElevation? @Composable get() = null
}
object Fill: ButtonType {
@Composable override fun border(color: Color, enabled: Boolean) = null
@Composable override fun buttonColors(color: Color) = ButtonDefaults.buttonColors(
contentColor = LocalPalette.current.background,
backgroundColor = color,
disabledContentColor = LocalPalette.current.disabled,
disabledBackgroundColor = Color.Unspecified
)
override val elevation: ButtonElevation? @Composable get() = ButtonDefaults.elevation()
}
}
/**
* Base [Button] implementation
*/
@Composable
fun Button(
onClick: () -> Unit,
color: Color,
type: ButtonType,
modifier: Modifier = Modifier,
enabled: Boolean = true,
size: ButtonSize = LargeButtonSize,
elevation: ButtonElevation? = type.elevation,
shape: Shape = MaterialTheme.shapes.small,
border: BorderStroke? = type.border(color, enabled),
colors: ButtonColors = type.buttonColors(color),
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
content: @Composable RowScope.() -> Unit
) {
size.applyConstraints {
androidx.compose.material.Button(
onClick,
modifier.heightIn(min = size.minHeight),
enabled,
interactionSource,
elevation,
shape,
border,
colors,
content = content
)
}
}
/**
* Courtesy [Button] implementation
*/
@Composable
fun Button(
text: String,
onClick: () -> Unit,
color: Color,
type: ButtonType,
modifier: Modifier = Modifier,
enabled: Boolean = true,
size: ButtonSize = LargeButtonSize,
elevation: ButtonElevation? = type.elevation,
shape: Shape = MaterialTheme.shapes.small,
border: BorderStroke? = type.border(color, enabled),
colors: ButtonColors = type.buttonColors(color),
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
) {
Button(onClick, color, type, modifier, enabled, size, elevation, shape, border, colors, interactionSource) {
Text(text)
}
}
@Composable fun FillButton(text: String, modifier: Modifier = Modifier, enabled: Boolean = true, onClick: () -> Unit) {
Button(text, onClick, LocalPalette.current.buttonOutline, ButtonType.Fill, modifier, enabled)
}
@Composable fun PrimaryFillButton(text: String, modifier: Modifier = Modifier, enabled: Boolean = true, onClick: () -> Unit) {
Button(text, onClick, LocalPalette.current.primary, ButtonType.Fill, modifier, enabled)
}
@Composable fun OutlineButton(text: String, modifier: Modifier = Modifier, color: Color = LocalPalette.current.buttonOutline, enabled: Boolean = true, onClick: () -> Unit) {
Button(text, onClick, color, ButtonType.Outline, modifier, enabled)
}
@Composable fun PrimaryOutlineButton(text: String, modifier: Modifier = Modifier, enabled: Boolean = true, onClick: () -> Unit) {
Button(text, onClick, LocalPalette.current.primary, ButtonType.Outline, modifier, enabled)
}
@Composable fun SlimOutlineButton(text: String, modifier: Modifier = Modifier, color: Color = LocalPalette.current.buttonOutline, enabled: Boolean = true, onClick: () -> Unit) {
Button(text, onClick, color, ButtonType.Outline, modifier, enabled, SlimButtonSize)
}
@Composable fun SlimOutlineButton(onClick: () -> Unit, modifier: Modifier = Modifier, color: Color = LocalPalette.current.buttonOutline, enabled: Boolean = true, content: @Composable () -> Unit) {
Button(onClick, color, ButtonType.Outline, modifier, enabled, SlimButtonSize) { content() }
}