Skip to content

Commit f263834

Browse files
QuickEditor: Update the Avatar's menu UI (#561)
* Change the Rating item label to Rating: {current} * Add arrow to indicate submenu * Move download option to the top * Remove unused translated string resource * Rename the label to a proper name
1 parent a366224 commit f263834

File tree

21 files changed

+70
-36
lines changed

21 files changed

+70
-36
lines changed

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/AvatarMoreOptionsPickerPopup.kt

Lines changed: 24 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -25,50 +25,61 @@ internal fun AvatarMoreOptionsPickerPopup(
2525
onDismissRequest: () -> Unit,
2626
onAvatarOptionClicked: (AvatarOption) -> Unit,
2727
) {
28+
val ratingItemLabel = stringResource(
29+
R.string.gravatar_qe_selectable_avatar_more_options_rating_v2,
30+
avatarRating.firstOrNull { it.selected }?.rating?.value.orEmpty(),
31+
)
2832
PickerPopup(
2933
anchorAlignment = anchorAlignment,
3034
offset = offset,
3135
onDismissRequest = onDismissRequest,
3236
popupMenu = PickerPopupMenu(
3337
items = listOf(
38+
PickerPopupItem(
39+
text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_download_image),
40+
iconRes = R.drawable.gravatar_avatar_more_options_download,
41+
contentDescription = stringResource(
42+
R.string.gravatar_qe_selectable_avatar_more_options_download_image,
43+
),
44+
onClick = {
45+
onAvatarOptionClicked(AvatarOption.DownloadImage)
46+
},
47+
),
3448
PickerPopupItem(
3549
text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_alt_text),
3650
iconRes = R.drawable.gravatar_avatar_more_options_alt_text,
37-
contentDescription =
51+
contentDescription = stringResource(
3852
R.string.gravatar_qe_selectable_avatar_more_options_alt_text_content_description,
53+
),
3954
onClick = {
4055
onAvatarOptionClicked(AvatarOption.AltText)
4156
},
4257
),
4358
PickerPopupItem(
44-
text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_rating),
59+
text = ratingItemLabel,
4560
iconRes = R.drawable.gravatar_avatar_more_options_rating,
46-
contentDescription = R.string.gravatar_qe_selectable_avatar_more_options_rating,
61+
contentDescription = ratingItemLabel,
4762
subMenu = PickerPopupMenu(
4863
items = avatarRating.map { (rating, selected) ->
4964
PickerPopupItem(
5065
text = stringResource(rating.fullNameRes),
5166
iconRes = if (selected) R.drawable.ic_checkmark else null,
52-
contentDescription = R.string.gravatar_qe_avatar_rating_selected_content_description,
67+
contentDescription = stringResource(
68+
R.string.gravatar_qe_avatar_rating_selected_content_description,
69+
),
5370
onClick = {
5471
onAvatarOptionClicked(AvatarOption.Rating(rating))
5572
},
5673
)
5774
},
5875
),
5976
),
60-
PickerPopupItem(
61-
text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_download_image),
62-
iconRes = R.drawable.gravatar_avatar_more_options_download,
63-
contentDescription = R.string.gravatar_qe_selectable_avatar_more_options_download_image,
64-
onClick = {
65-
onAvatarOptionClicked(AvatarOption.DownloadImage)
66-
},
67-
),
6877
PickerPopupItem(
6978
text = stringResource(R.string.gravatar_qe_selectable_avatar_more_options_delete),
7079
iconRes = R.drawable.gravatar_avatar_more_options_delete,
71-
contentDescription = R.string.gravatar_qe_selectable_avatar_more_options_delete_content_description,
80+
contentDescription = stringResource(
81+
R.string.gravatar_qe_selectable_avatar_more_options_delete_content_description,
82+
),
7283
contentColor = MaterialTheme.colorScheme.error,
7384
onClick = {
7485
onAvatarOptionClicked(AvatarOption.Delete)

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/MediaPickerPopup.kt

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,13 +31,13 @@ internal fun MediaPickerPopup(
3131
PickerPopupItem(
3232
text = stringResource(R.string.gravatar_qe_avatar_picker_choose_a_photo),
3333
iconRes = R.drawable.gravatar_photo_library,
34-
contentDescription = R.string.gravatar_qe_photo_library_icon_description,
34+
contentDescription = stringResource(R.string.gravatar_qe_photo_library_icon_description),
3535
onClick = onChoosePhotoClick,
3636
),
3737
PickerPopupItem(
3838
text = stringResource(R.string.gravatar_qe_avatar_picker_take_photo),
3939
iconRes = R.drawable.gravatar_capture_photo,
40-
contentDescription = R.string.gravatar_qe_capture_photo_icon_description,
40+
contentDescription = stringResource(R.string.gravatar_qe_capture_photo_icon_description),
4141
onClick = onTakePhotoClick,
4242
),
4343
),

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/PickerPopup.kt

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,24 @@
11
package com.gravatar.quickeditor.ui.components
22

33
import androidx.annotation.DrawableRes
4-
import androidx.annotation.StringRes
54
import androidx.compose.animation.AnimatedContent
65
import androidx.compose.animation.AnimatedVisibility
76
import androidx.compose.animation.core.MutableTransitionState
87
import androidx.compose.animation.core.Spring
98
import androidx.compose.animation.core.spring
109
import androidx.compose.animation.scaleIn
10+
import androidx.compose.foundation.layout.Box
1111
import androidx.compose.foundation.layout.fillMaxWidth
12+
import androidx.compose.foundation.layout.padding
13+
import androidx.compose.foundation.layout.width
1214
import androidx.compose.foundation.lazy.LazyColumn
1315
import androidx.compose.foundation.lazy.itemsIndexed
1416
import androidx.compose.foundation.shape.RoundedCornerShape
17+
import androidx.compose.material.icons.Icons
18+
import androidx.compose.material.icons.automirrored.filled.KeyboardArrowRight
1519
import androidx.compose.material3.HorizontalDivider
20+
import androidx.compose.material3.Icon
21+
import androidx.compose.material3.MaterialTheme
1622
import androidx.compose.material3.Surface
1723
import androidx.compose.runtime.Composable
1824
import androidx.compose.runtime.Immutable
@@ -36,6 +42,7 @@ import androidx.compose.ui.unit.dp
3642
import androidx.compose.ui.window.Popup
3743
import androidx.compose.ui.window.PopupPositionProvider
3844
import androidx.compose.ui.window.PopupProperties
45+
import com.gravatar.quickeditor.R
3946

4047
@Composable
4148
internal fun PickerPopup(
@@ -96,7 +103,7 @@ private fun PickerPopup(
96103
PopupButton(
97104
text = item.text,
98105
iconRes = item.iconRes,
99-
contentDescription = stringResource(item.contentDescription),
106+
contentDescription = item.contentDescription,
100107
shape = popupButtonShape(index, popupMenu.items.size, cornerRadius),
101108
color = item.contentColor,
102109
onClick = {
@@ -106,6 +113,27 @@ private fun PickerPopup(
106113
item.onClick?.let { it() }
107114
}
108115
},
116+
startIcon = if (targetState.items.any { it.subMenu != null }) {
117+
{
118+
Box(
119+
modifier = Modifier
120+
.padding(end = 2.dp)
121+
.width(24.dp),
122+
) {
123+
if (item.subMenu != null) {
124+
Icon(
125+
imageVector = Icons.AutoMirrored.Filled.KeyboardArrowRight,
126+
contentDescription = stringResource(
127+
R.string.gravatar_qe_picker_submenu_icon_description,
128+
),
129+
tint = item.contentColor ?: MaterialTheme.colorScheme.onSurface,
130+
)
131+
}
132+
}
133+
}
134+
} else {
135+
null
136+
},
109137
)
110138
if (index < popupMenu.items.size - 1) {
111139
HorizontalDivider()
@@ -138,7 +166,7 @@ internal data class PickerPopupMenu(
138166
internal data class PickerPopupItem(
139167
val text: String,
140168
@DrawableRes val iconRes: Int?,
141-
@StringRes val contentDescription: Int,
169+
val contentDescription: String,
142170
val onClick: (() -> Unit)? = null,
143171
val contentColor: Color? = null,
144172
val subMenu: PickerPopupMenu? = null,

gravatar-quickeditor/src/main/java/com/gravatar/quickeditor/ui/components/PopupButton.kt

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,17 +32,26 @@ internal fun PopupButton(
3232
shape: Shape,
3333
color: Color? = null,
3434
modifier: Modifier = Modifier,
35+
startIcon: @Composable (() -> Unit)? = null,
3536
) {
37+
val contentPadding = if (startIcon != null) {
38+
PaddingValues(top = 12.dp, bottom = 12.dp, start = 6.dp, end = 16.dp)
39+
} else {
40+
PaddingValues(vertical = 12.dp, horizontal = 16.dp)
41+
}
3642
TextButton(
3743
onClick = onClick,
3844
modifier = modifier,
3945
shape = shape,
40-
contentPadding = PaddingValues(vertical = 12.dp, horizontal = 16.dp),
46+
contentPadding = contentPadding,
4147
) {
4248
Row(
4349
horizontalArrangement = Arrangement.SpaceBetween,
4450
verticalAlignment = Alignment.CenterVertically,
4551
) {
52+
if (startIcon != null) {
53+
startIcon()
54+
}
4655
Text(
4756
text = text,
4857
overflow = TextOverflow.Ellipsis,

gravatar-quickeditor/src/main/res/values-ar/strings.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ Language: ar
2525
<string name="gravatar_qe_avatar_rating_g">G (عام)</string>
2626
<string name="gravatar_qe_alert_banner_close_content_description">إغلاق الإنذار</string>
2727
<string name="gravatar_qe_alert_banner_no_avatar_selected">لم يتم تحديد صورة. يرجى تحديد صورة أو سيتم استخدام الصورة الافتراضية.</string>
28-
<string name="gravatar_qe_selectable_avatar_more_options_rating">تغيير التقييم</string>
2928
<string name="gravatar_qe_write_external_storage_permission_rationale_message">لحفظ الصورة في مجلد عام، يتعين عليك منح الصلاحية. يمكنك منحها ضمن إعدادات التطبيق.</string>
3029
<string name="gravatar_qe_download_manager_disabled_title">تم تعطيل DownloadManager. يرجى تمكينها لتنزيل الصور الرمزية.</string>
3130
<string name="gravatar_qe_download_manager_not_available">DownloadManager غير متوفر</string>

gravatar-quickeditor/src/main/res/values-de/strings.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ Language: de
2525
<string name="gravatar_qe_avatar_rating_g">G (Für alle)</string>
2626
<string name="gravatar_qe_alert_banner_close_content_description">Hinweis schließen</string>
2727
<string name="gravatar_qe_alert_banner_no_avatar_selected">Kein Bild ausgewählt. Bitte wähle eines aus, andernfalls wird das Standardbild verwendet.</string>
28-
<string name="gravatar_qe_selectable_avatar_more_options_rating">Bewertung ändern</string>
2928
<string name="gravatar_qe_write_external_storage_permission_rationale_message">Zum Speichern des Bilds in einem öffentlichen Ordner musst du die entsprechende Berechtigung erteilen. Die Berechtigung kannst du in den App-Einstellungen erteilen.</string>
3029
<string name="gravatar_qe_download_manager_disabled_title">Der Download Manager ist deaktiviert. Aktiviere die Funktion, um Avatare herunterladen zu können.</string>
3130
<string name="gravatar_qe_download_manager_not_available">Der Download Manager ist nicht verfügbar</string>

gravatar-quickeditor/src/main/res/values-es/strings.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ Language: es
2525
<string name="gravatar_qe_avatar_rating_g">G (General)</string>
2626
<string name="gravatar_qe_alert_banner_close_content_description">Cerrar alerta</string>
2727
<string name="gravatar_qe_alert_banner_no_avatar_selected">No se ha seleccionado ninguna imagen. Elige una o se utilizará la imagen por defecto.</string>
28-
<string name="gravatar_qe_selectable_avatar_more_options_rating">Cambiar calificación</string>
2928
<string name="gravatar_qe_write_external_storage_permission_rationale_message">Para guardar la imagen en una carpeta pública, tienes que otorgar el permiso para ello. Puedes hacerlo en los ajustes de la aplicación.</string>
3029
<string name="gravatar_qe_download_manager_disabled_title">DownloadManager se ha inhabilitado. Habilítalo para descargar avatares.</string>
3130
<string name="gravatar_qe_download_manager_not_available">DownloadManager no está disponible.</string>

gravatar-quickeditor/src/main/res/values-fr/strings.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ Language: fr
2525
<string name="gravatar_qe_avatar_rating_g">G (tous publics)</string>
2626
<string name="gravatar_qe_alert_banner_close_content_description">Fermer l’alerte</string>
2727
<string name="gravatar_qe_alert_banner_no_avatar_selected">Aucune image sélectionnée. Veuillez en sélectionner une, faute de quoi l’image par défaut sera utilisée.</string>
28-
<string name="gravatar_qe_selectable_avatar_more_options_rating">Modifier la classification</string>
2928
<string name="gravatar_qe_write_external_storage_permission_rationale_message">Pour enregistrer l\'image dans un dossier, vous devez en accorder l\'autorisation dans les paramètres de l\'application.</string>
3029
<string name="gravatar_qe_download_manager_disabled_title">DownloadManager est désactivé. Veuillez l\'activer pour pouvoir télécharger les avatars.</string>
3130
<string name="gravatar_qe_download_manager_not_available">DownloadManager n\'est pas disponible</string>

gravatar-quickeditor/src/main/res/values-in/strings.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ Language: id
2525
<string name="gravatar_qe_avatar_rating_g">G (Umum)</string>
2626
<string name="gravatar_qe_alert_banner_close_content_description">Tutup peringatan</string>
2727
<string name="gravatar_qe_alert_banner_no_avatar_selected">Tidak ada gambar dipilih. Harap pilih satu gambar atau gambar default akan digunakan.</string>
28-
<string name="gravatar_qe_selectable_avatar_more_options_rating">Ubah rating</string>
2928
<string name="gravatar_qe_write_external_storage_permission_rationale_message">Untuk menyimpan gambar di folder publik, Anda perlu memberikan izin. Anda dapat memberikan izin di pengaturan aplikasi.</string>
3029
<string name="gravatar_qe_download_manager_disabled_title">DownloadManager dinonaktifkan. Aktifkan untuk mengunduh Avatar.</string>
3130
<string name="gravatar_qe_download_manager_not_available">DownloadManager tidak tersedia</string>

gravatar-quickeditor/src/main/res/values-it/strings.xml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ Language: it
2525
<string name="gravatar_qe_avatar_rating_g">G (generale)</string>
2626
<string name="gravatar_qe_alert_banner_close_content_description">Chiudi avviso</string>
2727
<string name="gravatar_qe_alert_banner_no_avatar_selected">Nessuna immagine selezionata. Seleziona un\'immagine, altrimenti verrà usata quella predefinita.</string>
28-
<string name="gravatar_qe_selectable_avatar_more_options_rating">Modifica la valutazione</string>
2928
<string name="gravatar_qe_write_external_storage_permission_rationale_message">Per salvare l\'immagine in una cartella pubblica devi concedere l\'autorizzazione. Puoi concederla nelle impostazioni dell\'app.</string>
3029
<string name="gravatar_qe_download_manager_disabled_title">DownloadManager è disabilitato. Abilitalo per scaricare gli avatar.</string>
3130
<string name="gravatar_qe_download_manager_not_available">DownloadManager non è disponibile</string>

0 commit comments

Comments
 (0)