diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Buttons.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Buttons.kt
index 9fce6ef1f..1556ccddb 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Buttons.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Buttons.kt
@@ -71,6 +71,7 @@ private fun Buttons(
name = it.name.lowercase().replaceFirstChar(Char::titlecase),
style = it,
isLoading = false,
+ contentDescription = "Custom content description",
)
CatalogButton(
@@ -86,6 +87,7 @@ private fun Buttons(
style = it,
isLoading = isLoading,
loadingText = "Loading",
+ contentDescription = "Custom content description loading",
onClickListener = {
isLoading = true
scope.launch {
@@ -100,6 +102,7 @@ private fun Buttons(
style = it,
enabled = false,
isLoading = false,
+ contentDescription = "Custom content description disabled",
)
if (it in listOf(ButtonStyle.LINK, ButtonStyle.LINK_INVERSE)) {
@@ -133,6 +136,7 @@ private fun CatalogButton(
loadingText: String = "",
onClickListener: () -> Unit = {},
@DrawableRes icon: Int? = null,
+ contentDescription: String? = null,
) {
Button(
text = name,
@@ -143,5 +147,6 @@ private fun CatalogButton(
icon = icon,
withChevron = withChevron,
onClickListener = onClickListener,
+ contentDescription = contentDescription,
)
}
diff --git a/catalog/src/main/res/layout/screen_buttons_catalog.xml b/catalog/src/main/res/layout/screen_buttons_catalog.xml
index 862a34fae..5196715ef 100644
--- a/catalog/src/main/res/layout/screen_buttons_catalog.xml
+++ b/catalog/src/main/res/layout/screen_buttons_catalog.xml
@@ -31,7 +31,8 @@
style="@style/AppTheme.Button.DefaultButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
- android:text="Primary" />
+ android:text="Primary"
+ android:contentDescription="Custom content description" />
+ android:text="Primary Progress"
+ android:contentDescription="Custom content description progress" />
Unit by mutableStateOf({})
private var invalidatePaddings: Boolean by mutableStateOf(false)
- init {
+ init {
attrs?.let {
val textTypedArray = context.obtainStyledAttributes(attrs, intArrayOf(android.R.attr.text))
val enabledTypedArray = context.obtainStyledAttributes(attrs, intArrayOf(android.R.attr.enabled))
@@ -53,6 +53,8 @@ class Button @JvmOverloads constructor(
styledAttrs.recycle()
}
}
+
+ importantForAccessibility = IMPORTANT_FOR_ACCESSIBILITY_NO
}
override fun setEnabled(enabled: Boolean) {
@@ -88,7 +90,8 @@ class Button @JvmOverloads constructor(
icon = icon,
withChevron = withChevron,
invalidatePaddings = invalidatePaddings,
- onClickListener = onClick
+ onClickListener = onClick,
+ contentDescription = contentDescription?.toString()?.ifEmpty { null }
)
}
}
diff --git a/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt b/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt
index 3a622f4d6..72dd3a089 100644
--- a/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt
+++ b/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt
@@ -39,6 +39,8 @@ import androidx.compose.ui.layout.onGloballyPositioned
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.res.dimensionResource
import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.semantics.contentDescription
+import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.tooling.preview.PreviewParameter
@@ -57,6 +59,7 @@ private const val CHEVRON_ASPECT_RATIO = 8f / 20f
fun Button(
modifier: Modifier = Modifier,
text: String,
+ contentDescription: String? = null,
loadingText: String = "",
buttonStyle: ButtonStyle = ButtonStyle.PRIMARY,
isLoading: Boolean = false,
@@ -96,7 +99,7 @@ fun Button(
) {
Box(contentAlignment = Alignment.Center) {
LoadingContent(isLoading, size, textColor, loadingText)
- ButtonContent(isLoading, icon, size, style, text, textColor, withChevron, enabled)
+ ButtonContent(isLoading, icon, size, style, text, textColor, withChevron, enabled, contentDescription)
}
}
}
@@ -148,6 +151,7 @@ private fun ButtonContent(
textColor: Color,
withChevron: Boolean,
enabled: Boolean,
+ contentDescription: String?,
) {
AnimatedVisibility(
modifier = Modifier.fillMaxHeight(),
@@ -169,7 +173,8 @@ private fun ButtonContent(
}
Text(
modifier = Modifier
- .align(Alignment.CenterVertically),
+ .align(Alignment.CenterVertically)
+ .semantics { contentDescription?.let { this.contentDescription = it } },
text = text,
color = textColor,
style = size.textStyle,