For #9722: Refactor onboarding buttons with text.
Add title and description to button text, remove extra Textviews.master
parent
6b8eca0700
commit
8826f99ef7
|
@ -0,0 +1,34 @@
|
|||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
package org.mozilla.fenix.ext
|
||||
|
||||
import android.content.Context
|
||||
import android.text.Spannable
|
||||
import android.text.SpannableString
|
||||
import android.text.style.AbsoluteSizeSpan
|
||||
import android.text.style.ForegroundColorSpan
|
||||
import androidx.core.content.ContextCompat
|
||||
import mozilla.components.support.ktx.android.util.dpToPx
|
||||
|
||||
fun SpannableString.setTextSize(context: Context, textSize: Int) =
|
||||
this.setSpan(
|
||||
AbsoluteSizeSpan(textSize.dpToPx(context.resources.displayMetrics)),
|
||||
0,
|
||||
this.length,
|
||||
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
|
||||
)
|
||||
|
||||
fun SpannableString.setTextColor(context: Context, colorResId: Int) =
|
||||
this.setSpan(
|
||||
ForegroundColorSpan(
|
||||
ContextCompat.getColor(
|
||||
context,
|
||||
colorResId
|
||||
)
|
||||
),
|
||||
0,
|
||||
this.length,
|
||||
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
|
||||
)
|
|
@ -37,17 +37,17 @@ class OnboardingTrackingProtectionViewHolder(view: View) : RecyclerView.ViewHold
|
|||
isChecked = view.context.settings().shouldUseTrackingProtection
|
||||
setOnCheckedChangeListener { _, isChecked ->
|
||||
updateTrackingProtectionSetting(isChecked)
|
||||
updateRadioGroupState(view, isChecked)
|
||||
updateRadioGroupState(isChecked)
|
||||
}
|
||||
}
|
||||
|
||||
setupRadioGroup(view, trackingProtectionToggle.isChecked)
|
||||
updateRadioGroupState(view, trackingProtectionToggle.isChecked)
|
||||
setupRadioGroup(trackingProtectionToggle.isChecked)
|
||||
updateRadioGroupState(trackingProtectionToggle.isChecked)
|
||||
}
|
||||
|
||||
private fun setupRadioGroup(view: View, isChecked: Boolean) {
|
||||
private fun setupRadioGroup(isChecked: Boolean) {
|
||||
|
||||
updateRadioGroupState(view, isChecked)
|
||||
updateRadioGroupState(isChecked)
|
||||
|
||||
addToRadioGroup(standardTrackingProtection, strictTrackingProtection)
|
||||
|
||||
|
@ -58,56 +58,20 @@ class OnboardingTrackingProtectionViewHolder(view: View) : RecyclerView.ViewHold
|
|||
|
||||
standardTrackingProtection.onClickListener {
|
||||
updateTrackingProtectionPolicy()
|
||||
view.context.components.analytics.metrics
|
||||
itemView.context.components.analytics.metrics
|
||||
.track(Event.OnboardingTrackingProtection(Setting.STANDARD))
|
||||
}
|
||||
|
||||
view.clickable_region_standard.apply {
|
||||
setOnClickListener {
|
||||
standardTrackingProtection.performClick()
|
||||
view.context.components.analytics.metrics
|
||||
.track(Event.OnboardingTrackingProtection(Setting.STANDARD))
|
||||
}
|
||||
val standardTitle = view.context.getString(
|
||||
R.string.onboarding_tracking_protection_standard_button_2
|
||||
)
|
||||
val standardSummary = view.context.getString(
|
||||
R.string.onboarding_tracking_protection_standard_button_description_2
|
||||
)
|
||||
contentDescription = "$standardTitle. $standardSummary"
|
||||
}
|
||||
|
||||
strictTrackingProtection.onClickListener {
|
||||
updateTrackingProtectionPolicy()
|
||||
view.context.components.analytics.metrics
|
||||
itemView.context.components.analytics.metrics
|
||||
.track(Event.OnboardingTrackingProtection(Setting.STRICT))
|
||||
}
|
||||
|
||||
view.clickable_region_strict.apply {
|
||||
setOnClickListener {
|
||||
strictTrackingProtection.performClick()
|
||||
view.context.components.analytics.metrics
|
||||
.track(Event.OnboardingTrackingProtection(Setting.STRICT))
|
||||
}
|
||||
val strictTitle =
|
||||
view.context.getString(R.string.onboarding_tracking_protection_strict_option)
|
||||
val strictSummary =
|
||||
view.context.getString(R.string.onboarding_tracking_protection_strict_button_description_2)
|
||||
contentDescription = "$strictTitle. $strictSummary"
|
||||
}
|
||||
}
|
||||
|
||||
private fun updateRadioGroupState(view: View, isChecked: Boolean) {
|
||||
private fun updateRadioGroupState(isChecked: Boolean) {
|
||||
standardTrackingProtection.isEnabled = isChecked
|
||||
strictTrackingProtection.isEnabled = isChecked
|
||||
|
||||
view.protection_standard_description.isEnabled = isChecked
|
||||
view.protection_strict_description.isEnabled = isChecked
|
||||
view.clickable_region_standard.isClickable = isChecked
|
||||
|
||||
view.protection_standard_title.isEnabled = isChecked
|
||||
view.protection_strict_title.isEnabled = isChecked
|
||||
view.clickable_region_strict.isClickable = isChecked
|
||||
}
|
||||
|
||||
private fun updateTrackingProtectionSetting(enabled: Boolean) {
|
||||
|
|
|
@ -5,12 +5,16 @@
|
|||
package org.mozilla.fenix.onboarding
|
||||
|
||||
import android.content.Context
|
||||
import android.text.SpannableString
|
||||
import android.text.SpannableStringBuilder
|
||||
import android.util.AttributeSet
|
||||
import android.widget.ImageView
|
||||
import androidx.appcompat.widget.AppCompatRadioButton
|
||||
import androidx.core.content.edit
|
||||
import androidx.core.content.withStyledAttributes
|
||||
import org.mozilla.fenix.R
|
||||
import org.mozilla.fenix.ext.setTextColor
|
||||
import org.mozilla.fenix.ext.setTextSize
|
||||
import org.mozilla.fenix.ext.settings
|
||||
import org.mozilla.fenix.utils.view.GroupableRadioButton
|
||||
import org.mozilla.fenix.utils.view.uncheckAll
|
||||
|
@ -23,6 +27,8 @@ class OnboardingRadioButton(
|
|||
private var illustration: ImageView? = null
|
||||
private var clickListener: (() -> Unit)? = null
|
||||
var key: Int = 0
|
||||
var title: Int = 0
|
||||
var description: Int = 0
|
||||
|
||||
init {
|
||||
context.withStyledAttributes(
|
||||
|
@ -31,6 +37,9 @@ class OnboardingRadioButton(
|
|||
0, 0
|
||||
) {
|
||||
key = getResourceId(R.styleable.OnboardingRadioButton_onboardingKey, 0)
|
||||
title = getResourceId(R.styleable.OnboardingRadioButton_onboardingKeyTitle, 0)
|
||||
description =
|
||||
getResourceId(R.styleable.OnboardingRadioButton_onboardingKeyDescription, 0)
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -52,6 +61,28 @@ class OnboardingRadioButton(
|
|||
toggleRadioGroups()
|
||||
clickListener?.invoke()
|
||||
}
|
||||
if (title != 0) {
|
||||
setRadioButtonText(context)
|
||||
}
|
||||
}
|
||||
|
||||
private fun setRadioButtonText(context: Context) {
|
||||
val builder = SpannableStringBuilder()
|
||||
|
||||
val spannableTitle = SpannableString(resources.getString(title))
|
||||
spannableTitle.setTextSize(context, TITLE_TEXT_SIZE)
|
||||
spannableTitle.setTextColor(context, R.color.primary_state_list_text_color)
|
||||
|
||||
builder.append(spannableTitle)
|
||||
|
||||
if (description != 0) {
|
||||
val spannableDescription = SpannableString(resources.getString(description))
|
||||
spannableDescription.setTextSize(context, DESCRIPTION_TEXT_SIZE)
|
||||
spannableDescription.setTextColor(context, R.color.secondary_state_list_text_color)
|
||||
builder.append("\n")
|
||||
builder.append(spannableDescription)
|
||||
}
|
||||
this.text = builder
|
||||
}
|
||||
|
||||
override fun updateRadioValue(isChecked: Boolean) {
|
||||
|
@ -69,4 +100,9 @@ class OnboardingRadioButton(
|
|||
radioGroups.uncheckAll()
|
||||
}
|
||||
}
|
||||
|
||||
companion object {
|
||||
private const val TITLE_TEXT_SIZE = 16
|
||||
private const val DESCRIPTION_TEXT_SIZE = 14
|
||||
}
|
||||
}
|
||||
|
|
|
@ -4,6 +4,7 @@
|
|||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||
xmlns:tools="http://schemas.android.com/tools"
|
||||
android:id="@+id/onboarding_card"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
|
@ -140,34 +141,18 @@
|
|||
android:layout_marginStart="16dp"
|
||||
android:layout_marginTop="16dp"
|
||||
android:layout_marginBottom="16dp"
|
||||
android:background="@android:color/transparent"
|
||||
android:contentDescription="@string/onboarding_theme_automatic_title"
|
||||
android:foreground="@drawable/rounded_ripple"
|
||||
android:paddingStart="0dp"
|
||||
android:paddingEnd="8dp"
|
||||
android:theme="@style/Checkable.Colored"
|
||||
app:layout_constraintBottom_toBottomOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toBottomOf="@+id/divider"
|
||||
app:onboardingKey="@string/pref_key_follow_device_theme" />
|
||||
app:onboardingKey="@string/pref_key_follow_device_theme"
|
||||
app:onboardingKeyDescription="@string/onboarding_theme_automatic_summary"
|
||||
app:onboardingKeyTitle="@string/onboarding_theme_automatic_title"
|
||||
tools:text="Automatic" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/automatic_title"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="9dp"
|
||||
android:text="@string/onboarding_theme_automatic_title"
|
||||
android:textColor="?primaryText"
|
||||
android:textSize="16sp"
|
||||
app:layout_constraintStart_toEndOf="@+id/theme_automatic_radio_button"
|
||||
app:layout_constraintTop_toBottomOf="@+id/divider" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/automatic_theme_summary"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/onboarding_theme_automatic_summary"
|
||||
android:textColor="?secondaryText"
|
||||
android:textSize="14sp"
|
||||
app:layout_constraintStart_toEndOf="@+id/theme_automatic_radio_button"
|
||||
app:layout_constraintEnd_toEndOf="@id/clickable_region_automatic"
|
||||
app:layout_constraintTop_toBottomOf="@id/automatic_title" />
|
||||
</androidx.constraintlayout.widget.ConstraintLayout>
|
||||
|
|
|
@ -7,7 +7,9 @@
|
|||
android:id="@+id/onboarding_card"
|
||||
style="@style/OnboardingCardLightWithPadding"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content">
|
||||
android:layout_height="wrap_content"
|
||||
android:clipChildren="false"
|
||||
android:clipToPadding="false">
|
||||
|
||||
<TextView
|
||||
android:id="@+id/header_text"
|
||||
|
@ -44,97 +46,48 @@
|
|||
app:layout_constraintTop_toBottomOf="@id/header_text"
|
||||
tools:text="@string/onboarding_tracking_protection_description_2" />
|
||||
|
||||
<View
|
||||
android:id="@+id/clickable_region_standard"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="0dp"
|
||||
android:foreground="@drawable/rounded_ripple"
|
||||
app:layout_constraintBottom_toBottomOf="@id/protection_standard_description"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toTopOf="@id/tracking_protection_standard_option" />
|
||||
|
||||
<org.mozilla.fenix.onboarding.OnboardingRadioButton
|
||||
android:id="@+id/tracking_protection_standard_option"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="16dp"
|
||||
android:layout_marginTop="16dp"
|
||||
android:layout_marginBottom="16dp"
|
||||
android:paddingStart="0dp"
|
||||
android:paddingEnd="8dp"
|
||||
android:background="@android:color/transparent"
|
||||
android:checked="true"
|
||||
android:foreground="@drawable/rounded_ripple"
|
||||
android:gravity="top"
|
||||
android:paddingStart="8dp"
|
||||
android:paddingEnd="8dp"
|
||||
android:theme="@style/Checkable.Colored"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toBottomOf="@id/description_text"
|
||||
app:onboardingKey="@string/pref_key_tracking_protection_standard_option" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/protection_standard_title"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/onboarding_tracking_protection_standard_button_2"
|
||||
android:textColor="@color/primary_state_list_text_color"
|
||||
android:textSize="16sp"
|
||||
app:layout_constraintStart_toEndOf="@+id/tracking_protection_standard_option"
|
||||
app:layout_constraintTop_toTopOf="@+id/tracking_protection_standard_option" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/protection_standard_description"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/onboarding_tracking_protection_standard_button_description_2"
|
||||
android:textColor="@color/secondary_state_list_text_color"
|
||||
android:textSize="14sp"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintStart_toStartOf="@+id/protection_standard_title"
|
||||
app:layout_constraintTop_toBottomOf="@id/protection_standard_title" />
|
||||
|
||||
<View
|
||||
android:id="@+id/clickable_region_strict"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="0dp"
|
||||
android:foreground="@drawable/rounded_ripple"
|
||||
app:layout_constraintBottom_toBottomOf="@id/protection_strict_description"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toTopOf="@id/tracking_protection_strict_default" />
|
||||
app:onboardingKey="@string/pref_key_tracking_protection_standard_option"
|
||||
app:onboardingKeyDescription="@string/onboarding_tracking_protection_standard_button_description_2"
|
||||
app:onboardingKeyTitle="@string/onboarding_tracking_protection_standard_button_2"
|
||||
tools:text="Standard" />
|
||||
|
||||
<org.mozilla.fenix.onboarding.OnboardingRadioButton
|
||||
android:id="@+id/tracking_protection_strict_default"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="16dp"
|
||||
android:layout_marginTop="16dp"
|
||||
android:layout_marginBottom="16dp"
|
||||
android:background="@android:color/transparent"
|
||||
android:checked="false"
|
||||
android:paddingStart="0dp"
|
||||
android:foreground="@drawable/rounded_ripple"
|
||||
android:gravity="top"
|
||||
android:paddingStart="8dp"
|
||||
android:paddingEnd="8dp"
|
||||
android:textColor="@color/primary_state_list_text_color"
|
||||
android:theme="@style/Checkable.Colored"
|
||||
app:layout_constraintBottom_toBottomOf="parent"
|
||||
app:layout_constraintStart_toStartOf="parent"
|
||||
app:layout_constraintTop_toBottomOf="@id/tracking_protection_standard_option"
|
||||
app:onboardingKey="@string/pref_key_tracking_protection_strict_default" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/protection_strict_title"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/onboarding_tracking_protection_strict_option"
|
||||
android:textColor="@color/primary_state_list_text_color"
|
||||
android:textSize="16sp"
|
||||
app:layout_constraintStart_toEndOf="@+id/tracking_protection_strict_default"
|
||||
app:layout_constraintTop_toTopOf="@+id/tracking_protection_strict_default" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/protection_strict_description"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/onboarding_tracking_protection_strict_button_description_2"
|
||||
android:textColor="@color/secondary_state_list_text_color"
|
||||
android:textSize="14sp"
|
||||
app:layout_constraintBottom_toBottomOf="parent"
|
||||
app:layout_constraintEnd_toEndOf="parent"
|
||||
app:layout_constraintStart_toStartOf="@+id/protection_strict_title"
|
||||
app:layout_constraintTop_toBottomOf="@id/protection_strict_title" />
|
||||
app:onboardingKey="@string/pref_key_tracking_protection_strict_default"
|
||||
app:onboardingKeyDescription="@string/onboarding_tracking_protection_strict_button_description_2"
|
||||
app:onboardingKeyTitle="@string/onboarding_tracking_protection_strict_option"
|
||||
tools:text="Strict" />
|
||||
</androidx.constraintlayout.widget.ConstraintLayout>
|
||||
|
|
|
@ -84,6 +84,8 @@
|
|||
|
||||
<declare-styleable name="OnboardingRadioButton">
|
||||
<attr name="onboardingKey" format="reference" />
|
||||
<attr name="onboardingKeyTitle" format="reference" />
|
||||
<attr name="onboardingKeyDescription" format="reference" />
|
||||
</declare-styleable>
|
||||
|
||||
</resources>
|
||||
|
|
Loading…
Reference in New Issue