diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Titles.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Titles.kt index 1d745ed52..47731cbe0 100644 --- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Titles.kt +++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/compose/components/Titles.kt @@ -81,4 +81,12 @@ private fun TitlesWithStyleOverridden( text = "Some title $style that can get really long and almost fill the whole line", onLinkClicked = {} ) + Title( + modifier = Modifier.padding(bottom = 8.dp), + style = style, + linkText = "Some link", + withChevron = true, + text = "Some title $style with chevron", + onLinkClicked = {} + ) } diff --git a/catalog/src/main/res/layout/title_catalog.xml b/catalog/src/main/res/layout/title_catalog.xml index 49e3b3101..fe24f65b9 100644 --- a/catalog/src/main/res/layout/title_catalog.xml +++ b/catalog/src/main/res/layout/title_catalog.xml @@ -109,5 +109,26 @@ app:titleStyle="title2" app:title="Some title 2 that can get really long and almost fill the whole line" /> + + + + - \ No newline at end of file + + diff --git a/library/src/main/java/com/telefonica/mistica/compose/title/README.md b/library/src/main/java/com/telefonica/mistica/compose/title/README.md index b02ea9465..8480a0b8c 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/title/README.md +++ b/library/src/main/java/com/telefonica/mistica/compose/title/README.md @@ -16,5 +16,6 @@ Title( style = TitleStyle.TITLE_1, linkText = "Some link", // Nullable onLinkClicked = {} // Nullable + withChevron = true // Nullable ) -``` \ No newline at end of file +``` diff --git a/library/src/main/java/com/telefonica/mistica/compose/title/Title.kt b/library/src/main/java/com/telefonica/mistica/compose/title/Title.kt index f070bed03..54a6cb066 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/title/Title.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/title/Title.kt @@ -1,16 +1,28 @@ package com.telefonica.mistica.compose.title +import androidx.compose.foundation.Image import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.IntrinsicSize import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.aspectRatio +import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.width import androidx.compose.material.Text import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.ColorFilter +import androidx.compose.ui.res.dimensionResource +import androidx.compose.ui.res.painterResource import androidx.compose.ui.semantics.heading import androidx.compose.ui.semantics.semantics import androidx.compose.ui.text.TextStyle import androidx.compose.ui.unit.dp +import com.telefonica.mistica.R import com.telefonica.mistica.compose.theme.MisticaTheme @Composable @@ -20,6 +32,7 @@ fun Title( style: TitleStyle = MisticaTheme.values.titleStyle, text: String, linkText: String? = null, + withChevron: Boolean = false, onLinkClicked: (() -> Unit)? = null, ) { Row( @@ -46,6 +59,7 @@ fun Title( .padding(start = 16.dp) .alignByBaseline(), text = it, + withChevron = withChevron, onClick = onLinkClicked ) } @@ -68,6 +82,7 @@ private fun TitleText( textColor = MisticaTheme.colors.textSecondary isAllCaps = true } + TitleStyle.TITLE_2 -> { preset = MisticaTheme.typography.preset5 textColor = MisticaTheme.colors.textPrimary @@ -87,6 +102,7 @@ private fun TitleText( private fun Link( modifier: Modifier, text: String, + withChevron: Boolean, onClick: (() -> Unit)? = null, ) { val linkModifier = if (onClick != null) { @@ -94,13 +110,24 @@ private fun Link( } else { modifier } - - Text( + Row( modifier = linkModifier, - text = text, - style = MisticaTheme.typography.presetLink, - color = MisticaTheme.colors.textLink - ) + verticalAlignment = Alignment.CenterVertically + ) { + Text( + text = text, + style = MisticaTheme.typography.presetLink, + color = MisticaTheme.colors.textLink + ) + if (withChevron) { + Image( + painter = painterResource(id = R.drawable.icn_chevron), + contentDescription = null, + modifier = Modifier.padding(start = dimensionResource(id = R.dimen.button_chevron_padding)), + colorFilter = ColorFilter.tint(MisticaTheme.colors.textLink), + ) + } + } } enum class TitleStyle { diff --git a/library/src/main/java/com/telefonica/mistica/title/README.md b/library/src/main/java/com/telefonica/mistica/title/README.md index 584624d21..5ce15dd7f 100644 --- a/library/src/main/java/com/telefonica/mistica/title/README.md +++ b/library/src/main/java/com/telefonica/mistica/title/README.md @@ -15,3 +15,4 @@ It has these attributes: - `titleStyle`: to configure the appearance of the title text. Values supported: `title1`, `title2`. - `link`: to set the label of an optional link - `linkOnClick`: listener that will be invoked when link is clicked +- `linkWithChevron`: to show a chevron icon at the end of the link diff --git a/library/src/main/java/com/telefonica/mistica/title/TitleView.kt b/library/src/main/java/com/telefonica/mistica/title/TitleView.kt index 8f7b89ccd..3b68d1660 100644 --- a/library/src/main/java/com/telefonica/mistica/title/TitleView.kt +++ b/library/src/main/java/com/telefonica/mistica/title/TitleView.kt @@ -3,6 +3,8 @@ package com.telefonica.mistica.title import android.content.Context import android.util.AttributeSet import android.view.LayoutInflater +import android.widget.ImageView +import android.widget.LinearLayout import android.widget.TextView import androidx.annotation.AttrRes import androidx.annotation.IntDef @@ -10,6 +12,7 @@ import androidx.annotation.StyleRes import androidx.annotation.VisibleForTesting import androidx.constraintlayout.widget.ConstraintLayout import androidx.core.view.ViewCompat +import androidx.core.view.isVisible import androidx.databinding.BindingMethod import androidx.databinding.BindingMethods import com.telefonica.mistica.R @@ -58,6 +61,8 @@ class TitleView @JvmOverloads constructor( annotation class TitleStyle private var linkTextView: TextView + private var linkLayout: LinearLayout + private var linkChevron: ImageView private var titleTextView: TextView init { @@ -65,6 +70,8 @@ class TitleView @JvmOverloads constructor( titleTextView = findViewById(R.id.title_text) linkTextView = findViewById(R.id.link_text) + linkLayout = findViewById(R.id.link_layout) + linkChevron = findViewById(R.id.link_chevron) if (attrs != null) { val styledAttrs = @@ -84,8 +91,10 @@ class TitleView @JvmOverloads constructor( ) .takeIf { it } ?.let { setTitleHeading() } - - linkTextView.setTextAndVisibility(styledAttrs.getText(R.styleable.TitleView_link)) + val linkText = styledAttrs.getText(R.styleable.TitleView_link) + linkTextView.setTextAndVisibility(linkText) + linkLayout.isVisible = linkText?.isNotBlank() == true + linkChevron.isVisible = styledAttrs.getBoolean(R.styleable.TitleView_linkWithChevron, false) styledAttrs.recycle() } @@ -118,12 +127,17 @@ class TitleView @JvmOverloads constructor( fun getLink(): String = linkTextView.text.toString() - fun setLink(text: CharSequence?) { + fun setLink( + text: CharSequence?, + withChevron: Boolean = false + ) { + linkLayout.isVisible = text?.isNotBlank() == true linkTextView.setTextAndVisibility(text) + linkChevron.isVisible = withChevron } fun setOnLinkClickedListener(listener: () -> Unit) { - linkTextView.setOnClickListener { listener.invoke() } + linkLayout.setOnClickListener { listener.invoke() } } companion object { @@ -148,4 +162,4 @@ private data class TitleStyleConfig( @StyleRes val preset: Int, @AttrRes val colorAttrRes: Int, val isAllCaps: Boolean, -) \ No newline at end of file +) diff --git a/library/src/main/res/layout/title.xml b/library/src/main/res/layout/title.xml index a167b3222..34bbebbe3 100644 --- a/library/src/main/res/layout/title.xml +++ b/library/src/main/res/layout/title.xml @@ -1,37 +1,58 @@ + xmlns:tools="http://schemas.android.com/tools" + xmlns:app="http://schemas.android.com/apk/res-auto" + android:layout_width="match_parent" + android:layout_height="match_parent" + tools:parentTag="androidx.constraintlayout.widget.ConstraintLayout"> - + - - \ No newline at end of file + + + + + + + + diff --git a/library/src/main/res/values/attrs_components.xml b/library/src/main/res/values/attrs_components.xml index aedaee960..765416ef6 100755 --- a/library/src/main/res/values/attrs_components.xml +++ b/library/src/main/res/values/attrs_components.xml @@ -133,6 +133,7 @@ +