Skip to content

Commit

Permalink
Change compose design system to use outlined icons
Browse files Browse the repository at this point in the history
  • Loading branch information
wmontwe committed May 8, 2024
1 parent d155501 commit a5faea8
Show file tree
Hide file tree
Showing 9 changed files with 44 additions and 52 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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,
)
}
}
Expand All @@ -20,7 +20,7 @@ internal fun IconPreview() {
internal fun IconTintedPreview() {
PreviewWithThemes {
Icon(
imageVector = Icons.Filled.Error,
imageVector = Icons.Outlined.Celebration,
tint = Color.Magenta,
)
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ internal fun TextFieldOutlinedWithTrailingIconPreview() {
TextFieldOutlined(
value = "",
onValueChange = {},
trailingIcon = { Icon(imageVector = Icons.Filled.User) },
trailingIcon = { Icon(imageVector = Icons.Outlined.AccountCircle) },
isRequired = true,
)
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,83 +1,75 @@
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
get() = MaterialIcons.Filled.Cancel
}

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
get() = MaterialIcons.Outlined.ExpandMore

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
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -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 ->
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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)) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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))
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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(": ")
Expand All @@ -70,7 +70,7 @@ internal fun AutoDiscoveryServerSettingsView(
)

ServerSettingRow(
icon = Icons.Filled.Security,
icon = Icons.Outlined.Security,
text = buildAnnotatedString {
append("Security: ")
append(connectionSecurity.toAutoDiscoveryConnectionSecurityString(resources))
Expand All @@ -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)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down

0 comments on commit a5faea8

Please sign in to comment.