Sulkta-OSS/element-x-ada
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #1392 from vector-im/feature/bma/iterateOnIcons

Browse source 
Iterate on icons
This commit is contained in:
Benoit Marty 2023-09-20 23:20:28 +02:00 • committed by GitHub
commit e622f8d869
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
669 changed files with 3959 additions and 1595 deletions
Download patch file Download diff file Expand all files Collapse all files

56
libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt
View file

@ -38,8 +38,6 @@ import androidx.compose.foundation.layout.width
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Close
import androidx.compose.material.ripple.rememberRipple
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
@ -61,13 +59,13 @@ import androidx.compose.ui.unit.dp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.constraintlayout.compose.Dimension.Companion.fillToConstraints
import androidx.constraintlayout.compose.Visibility
import io.element.android.libraries.designsystem.VectorIcons
import io.element.android.libraries.designsystem.preview.DayNightPreviews
import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.text.applyScaleUp
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.Text
import io.element.android.libraries.designsystem.utils.CommonDrawables
import io.element.android.libraries.matrix.api.core.EventId
import io.element.android.libraries.matrix.api.core.TransactionId
import io.element.android.libraries.matrix.api.media.MediaSource
@ -136,7 +134,7 @@ fun TextComposer(
) {
Icon(
modifier = Modifier.size(30.dp.applyScaleUp()),
resourceId = VectorIcons.Plus,
resourceId = CommonDrawables.ic_plus,
contentDescription = stringResource(R.string.rich_text_editor_a11y_add_attachment),
tint = ElementTheme.colors.iconPrimary,
)
@ -306,7 +304,7 @@ private fun TextFormatting(
) {
Icon(
modifier = Modifier.size(30.dp.applyScaleUp()),
resourceId = VectorIcons.Cancel,
resourceId = CommonDrawables.ic_cancel,
contentDescription = stringResource(CommonStrings.action_close),
tint = ElementTheme.colors.iconPrimary,
)
@ -329,25 +327,25 @@ private fun TextFormatting(
FormattingOption(
state = state.actions[ComposerAction.BOLD].toButtonState(),
onClick = { state.toggleInlineFormat(InlineFormat.Bold) },
imageVector = ImageVector.vectorResource(VectorIcons.Bold),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_bold),
contentDescription = stringResource(R.string.rich_text_editor_format_bold)
)
FormattingOption(
state = state.actions[ComposerAction.ITALIC].toButtonState(),
onClick = { state.toggleInlineFormat(InlineFormat.Italic) },
imageVector = ImageVector.vectorResource(VectorIcons.Italic),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_italic),
contentDescription = stringResource(R.string.rich_text_editor_format_italic)
)
FormattingOption(
state = state.actions[ComposerAction.UNDERLINE].toButtonState(),
onClick = { state.toggleInlineFormat(InlineFormat.Underline) },
imageVector = ImageVector.vectorResource(VectorIcons.Underline),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_underline),
contentDescription = stringResource(R.string.rich_text_editor_format_underline)
)
FormattingOption(
state = state.actions[ComposerAction.STRIKE_THROUGH].toButtonState(),
onClick = { state.toggleInlineFormat(InlineFormat.StrikeThrough) },
imageVector = ImageVector.vectorResource(VectorIcons.Strikethrough),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_strikethrough),
contentDescription = stringResource(R.string.rich_text_editor_format_strikethrough)
)
@ -366,50 +364,50 @@ private fun TextFormatting(
FormattingOption(
state = state.actions[ComposerAction.LINK].toButtonState(),
onClick = { linkDialogAction = state.linkAction },
imageVector = ImageVector.vectorResource(VectorIcons.Link),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_link),
contentDescription = stringResource(R.string.rich_text_editor_link)
)
FormattingOption(
state = state.actions[ComposerAction.UNORDERED_LIST].toButtonState(),
onClick = { state.toggleList(ordered = false) },
imageVector = ImageVector.vectorResource(VectorIcons.BulletList),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_bullet_list),
contentDescription = stringResource(R.string.rich_text_editor_bullet_list)
)
FormattingOption(
state = state.actions[ComposerAction.ORDERED_LIST].toButtonState(),
onClick = { state.toggleList(ordered = true) },
imageVector = ImageVector.vectorResource(VectorIcons.NumberedList),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_numbered_list),
contentDescription = stringResource(R.string.rich_text_editor_numbered_list)
)
FormattingOption(
state = state.actions[ComposerAction.INDENT].toButtonState(),
onClick = { state.indent() },
imageVector = ImageVector.vectorResource(VectorIcons.IndentIncrease),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_indent_increase),
contentDescription = stringResource(R.string.rich_text_editor_indent)
)
FormattingOption(
state = state.actions[ComposerAction.UNINDENT].toButtonState(),
onClick = { state.unindent() },
imageVector = ImageVector.vectorResource(VectorIcons.IndentDecrease),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_indent_decrease),
contentDescription = stringResource(R.string.rich_text_editor_unindent)
)
FormattingOption(
state = state.actions[ComposerAction.INLINE_CODE].toButtonState(),
onClick = { state.toggleInlineFormat(InlineFormat.InlineCode) },
imageVector = ImageVector.vectorResource(VectorIcons.InlineCode),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_inline_code),
contentDescription = stringResource(R.string.rich_text_editor_inline_code)
)
FormattingOption(
state = state.actions[ComposerAction.CODE_BLOCK].toButtonState(),
onClick = { state.toggleCodeBlock() },
imageVector = ImageVector.vectorResource(VectorIcons.CodeBlock),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_code_block),
contentDescription = stringResource(R.string.rich_text_editor_code_block)
)
FormattingOption(
state = state.actions[ComposerAction.QUOTE].toButtonState(),
onClick = { state.toggleQuote() },
imageVector = ImageVector.vectorResource(VectorIcons.Quote),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_quote),
contentDescription = stringResource(R.string.rich_text_editor_quote)
)
}
@ -460,14 +458,14 @@ private fun EditingModeView(
modifier: Modifier = Modifier,
) {
Row(
horizontalArrangement = Arrangement.spacedBy(5.dp),
horizontalArrangement = Arrangement.spacedBy(4.dp),
verticalAlignment = Alignment.CenterVertically,
modifier = modifier
.fillMaxWidth()
.padding(start = 12.dp)
) {
Icon(
resourceId = VectorIcons.Edit,
resourceId = CommonDrawables.ic_september_edit_solid_16,
contentDescription = stringResource(CommonStrings.common_editing),
tint = ElementTheme.materialColors.secondary,
modifier = Modifier
@ -484,7 +482,7 @@ private fun EditingModeView(
.weight(1f)
)
Icon(
imageVector = Icons.Default.Close,
resourceId = CommonDrawables.ic_compound_close,
contentDescription = stringResource(CommonStrings.action_close),
tint = ElementTheme.materialColors.secondary,
modifier = Modifier
@ -547,7 +545,7 @@ private fun ReplyToModeView(
)
}
Icon(
imageVector = Icons.Default.Close,
resourceId = CommonDrawables.ic_compound_close,
contentDescription = stringResource(CommonStrings.action_close),
tint = MaterialTheme.colorScheme.secondary,
modifier = Modifier
@ -577,8 +575,17 @@ private fun SendButton(
enabled = canSendMessage,
) {
val iconId = when (composerMode) {
is MessageComposerMode.Edit -> R.drawable.ic_tick
else -> R.drawable.ic_send
is MessageComposerMode.Edit -> CommonDrawables.ic_compound_check
else -> CommonDrawables.ic_september_send
}
val iconSize = when (composerMode) {
is MessageComposerMode.Edit -> 24.dp
// CommonDrawables.ic_september_send is too big... reduce its size.
else -> 18.dp
}
val iconStartPadding = when (composerMode) {
is MessageComposerMode.Edit -> 0.dp
else -> 2.dp
}
val contentDescription = when (composerMode) {
is MessageComposerMode.Edit -> stringResource(CommonStrings.action_edit)
@ -592,7 +599,8 @@ private fun SendButton(
) {
Icon(
modifier = Modifier
.height(24.dp.applyScaleUp())
.height(iconSize.applyScaleUp())
.padding(start = iconStartPadding)
.align(Alignment.Center),
resourceId = iconId,
contentDescription = contentDescription,

8
libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/components/FormattingOption.kt
View file

@ -32,12 +32,12 @@ import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.unit.dp
import io.element.android.libraries.designsystem.VectorIcons
import io.element.android.libraries.designsystem.preview.DayNightPreviews
import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.text.applyScaleUp
import io.element.android.libraries.designsystem.theme.components.Icon
import io.element.android.libraries.designsystem.theme.iconSuccessPrimaryBackground
import io.element.android.libraries.designsystem.utils.CommonDrawables
import io.element.android.libraries.theme.ElementTheme
import io.element.android.libraries.theme.compound.generated.SemanticColors
@ -96,19 +96,19 @@ internal fun FormattingButtonPreview() = ElementPreview {
FormattingOption(
state = FormattingOptionState.Default,
onClick = { },
imageVector = ImageVector.vectorResource(VectorIcons.Bold),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_bold),
contentDescription = "",
)
FormattingOption(
state = FormattingOptionState.Selected,
onClick = { },
imageVector = ImageVector.vectorResource(VectorIcons.Italic),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_italic),
contentDescription = "",
)
FormattingOption(
state = FormattingOptionState.Disabled,
onClick = { },
imageVector = ImageVector.vectorResource(VectorIcons.Underline),
imageVector = ImageVector.vectorResource(CommonDrawables.ic_underline),
contentDescription = "",
)
}

25
libraries/textcomposer/impl/src/main/res/drawable/ic_send.xml
View file

@ -1,25 +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.
-->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:pathData="M21.829,13.085 L6.259,20.867c-1.049,0.525 -2.141,-0.601 -1.628,-1.627 0,0 1.93,-3.897 2.461,-4.918 0.531,-1.021 1.138,-1.197 6.781,-1.927 0.209,-0.027 0.38,-0.185 0.38,-0.395 0,-0.21 -0.171,-0.368 -0.38,-0.395C8.23,10.876 7.622,10.699 7.091,9.678c-0.531,-1.02 -2.461,-4.918 -2.461,-4.918 -0.513,-1.026 0.579,-2.152 1.628,-1.627L21.829,10.915c0.894,0.446 0.894,1.723 0,2.17z"
android:fillColor="#ffffff"/>
</vector>

9
libraries/textcomposer/impl/src/main/res/drawable/ic_tick.xml
View file

@ -1,9 +0,0 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:pathData="M9.55,17.575C9.417,17.575 9.292,17.555 9.175,17.513C9.058,17.471 8.95,17.4 8.85,17.3L4.55,13C4.367,12.817 4.279,12.58 4.288,12.288C4.296,11.996 4.392,11.759 4.575,11.575C4.758,11.392 4.992,11.3 5.275,11.3C5.558,11.3 5.792,11.392 5.975,11.575L9.55,15.15L18.025,6.675C18.208,6.492 18.446,6.4 18.737,6.4C19.029,6.4 19.267,6.492 19.45,6.675C19.633,6.859 19.725,7.096 19.725,7.388C19.725,7.68 19.633,7.917 19.45,8.1L10.25,17.3C10.15,17.4 10.042,17.471 9.925,17.513C9.808,17.555 9.683,17.575 9.55,17.575Z"
android:fillColor="#ffffff"/>
</vector>