Merge pull request #7821 from thunderbird/change-compose-icons-for-material3

Change Compose design system to use outlined icons
This commit is contained in:
Wolf-Martell Montwé 2024-05-08 14:17:35 +00:00 committed by GitHub
commit 4e639c7f81
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 44 additions and 52 deletions

View file

@ -160,7 +160,7 @@ private fun LazyGridScope.textFieldOutlinedItems() {
onValueChange = { state.value = state.value.copy(input = it) },
trailingIcon = {
if (state.value.showTrailingIcon) {
Icon(imageVector = Icons.Filled.User)
Icon(imageVector = Icons.Outlined.AccountCircle)
}
},
isEnabled = !state.value.isDisabled,

View file

@ -10,7 +10,7 @@ import app.k9mail.core.ui.compose.designsystem.PreviewWithThemes
internal fun IconPreview() {
PreviewWithThemes {
Icon(
imageVector = Icons.Filled.Error,
imageVector = Icons.Outlined.Celebration,
)
}
}
@ -20,7 +20,7 @@ internal fun IconPreview() {
internal fun IconTintedPreview() {
PreviewWithThemes {
Icon(
imageVector = Icons.Filled.Error,
imageVector = Icons.Outlined.Celebration,
tint = Color.Magenta,
)
}

View file

@ -73,7 +73,7 @@ internal fun TextFieldOutlinedWithTrailingIconPreview() {
TextFieldOutlined(
value = "",
onValueChange = {},
trailingIcon = { Icon(imageVector = Icons.Filled.User) },
trailingIcon = { Icon(imageVector = Icons.Outlined.AccountCircle) },
isRequired = true,
)
}

View file

@ -1,51 +1,28 @@
package app.k9mail.core.ui.compose.designsystem.atom.icon
import androidx.compose.material.icons.automirrored.outlined.ArrowBack
import androidx.compose.material.icons.filled.AccountCircle
import androidx.compose.material.icons.filled.Cancel
import androidx.compose.material.icons.filled.CheckCircle
import androidx.compose.material.icons.filled.Error
import androidx.compose.material.icons.filled.MoveToInbox
import androidx.compose.material.icons.filled.Outbox
import androidx.compose.material.icons.filled.Security
import androidx.compose.material.icons.filled.Visibility
import androidx.compose.material.icons.filled.VisibilityOff
import androidx.compose.material.icons.outlined.ArrowDropDown
import androidx.compose.material.icons.outlined.AccountCircle
import androidx.compose.material.icons.outlined.Celebration
import androidx.compose.material.icons.outlined.Check
import androidx.compose.material.icons.outlined.ErrorOutline
import androidx.compose.material.icons.outlined.ExpandLess
import androidx.compose.material.icons.outlined.ExpandMore
import androidx.compose.material.icons.outlined.Inbox
import androidx.compose.material.icons.outlined.Info
import androidx.compose.material.icons.outlined.Menu
import androidx.compose.material.icons.outlined.Security
import androidx.compose.material.icons.outlined.Visibility
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.material.icons.Icons as MaterialIcons
// We're using getters so not all icons are loaded into memory as soon as one of the nested objects is accessed.
object Icons {
object Filled {
val Error: ImageVector
get() = MaterialIcons.Filled.Error
val Inbox: ImageVector
get() = MaterialIcons.Filled.MoveToInbox
val Outbox: ImageVector
get() = MaterialIcons.Filled.Outbox
val Security: ImageVector
get() = MaterialIcons.Filled.Security
val PasswordVisibility: ImageVector
get() = MaterialIcons.Filled.Visibility
val PasswordVisibilityOff: ImageVector
get() = MaterialIcons.Filled.VisibilityOff
val User: ImageVector
get() = MaterialIcons.Filled.AccountCircle
val Check: ImageVector
val CheckCircle: ImageVector
get() = MaterialIcons.Filled.CheckCircle
val Cancel: ImageVector
@ -53,25 +30,19 @@ object Icons {
}
object Outlined {
val AccountCircle: ImageVector
get() = MaterialIcons.Outlined.AccountCircle
val ArrowBack: ImageVector
get() = MaterialIcons.AutoMirrored.Outlined.ArrowBack
val ArrowDropDown: ImageVector
get() = MaterialIcons.Outlined.ArrowDropDown
val Celebration: ImageVector
get() = MaterialIcons.Outlined.Celebration
val Menu: ImageVector
get() = MaterialIcons.Outlined.Menu
val Check: ImageVector
get() = MaterialIcons.Outlined.Check
val Info: ImageVector
get() = MaterialIcons.Outlined.Info
val Celebration: ImageVector
get() = MaterialIcons.Outlined.Celebration
val Error: ImageVector
val ErrorOutline: ImageVector
get() = MaterialIcons.Outlined.ErrorOutline
val ExpandMore: ImageVector
@ -79,5 +50,26 @@ object Icons {
val ExpandLess: ImageVector
get() = MaterialIcons.Outlined.ExpandLess
val Inbox: ImageVector
get() = MaterialIcons.Outlined.Inbox
val Info: ImageVector
get() = MaterialIcons.Outlined.Info
val Menu: ImageVector
get() = MaterialIcons.Outlined.Menu
val Outbox: ImageVector
get() = MaterialIcons.Filled.Outbox
val Security: ImageVector
get() = MaterialIcons.Outlined.Security
val Visibility: ImageVector
get() = MaterialIcons.Outlined.Visibility
val VisibilityOff: ImageVector
get() = MaterialIcons.Filled.VisibilityOff
}
}

View file

@ -27,7 +27,7 @@ fun TextFieldOutlinedFakeSelect(
.then(modifier),
readOnly = true,
label = optionalLabel(label),
trailingIcon = { Icon(Icons.Outlined.ArrowDropDown) },
trailingIcon = { Icon(Icons.Outlined.ExpandMore) },
singleLine = true,
interactionSource = remember { MutableInteractionSource() }
.also { interactionSource ->

View file

@ -97,9 +97,9 @@ private fun selectTrailingIcon(
return if (hasTrailingIcon) {
{
val image = if (isShowPasswordAllowed(isEnabled, isPasswordVisible)) {
Icons.Filled.PasswordVisibility
Icons.Outlined.Visibility
} else {
Icons.Filled.PasswordVisibilityOff
Icons.Outlined.VisibilityOff
}
val description = if (isShowPasswordAllowed(isEnabled, isPasswordVisible)) {

View file

@ -45,7 +45,7 @@ fun ErrorView(
horizontalAlignment = Alignment.CenterHorizontally,
) {
Icon(
imageVector = Icons.Filled.Error,
imageVector = Icons.Outlined.ErrorOutline,
tint = MainTheme.colors.error,
)
Spacer(modifier = Modifier.height(MainTheme.spacings.double))

View file

@ -53,7 +53,7 @@ internal fun AutoDiscoveryServerSettingsView(
)
ServerSettingRow(
icon = if (isIncoming) Icons.Filled.Inbox else Icons.Filled.Outbox,
icon = if (isIncoming) Icons.Outlined.Inbox else Icons.Outlined.Outbox,
text = buildAnnotatedString {
append("Server")
append(": ")
@ -70,7 +70,7 @@ internal fun AutoDiscoveryServerSettingsView(
)
ServerSettingRow(
icon = Icons.Filled.Security,
icon = Icons.Outlined.Security,
text = buildAnnotatedString {
append("Security: ")
append(connectionSecurity.toAutoDiscoveryConnectionSecurityString(resources))
@ -79,7 +79,7 @@ internal fun AutoDiscoveryServerSettingsView(
if (username.isNotEmpty()) {
ServerSettingRow(
icon = Icons.Filled.User,
icon = Icons.Outlined.AccountCircle,
text = buildAnnotatedString {
append("Username: ")
append(username)

View file

@ -101,7 +101,7 @@ private fun IconWithPermissionStateOverlay(
UiPermissionState.Unknown -> Unit
UiPermissionState.Granted -> {
Icon(
imageVector = Icons.Filled.Check,
imageVector = Icons.Filled.CheckCircle,
tint = MainTheme.colors.success,
modifier = Modifier
.size(overlayIconSize)