Update Settings: Update sub-screens #5334

mikescamell · 2024-11-29T12:28:46Z

Task/Issue URL: https://app.asana.com/0/1207908166761516/1208785622935234/f

Description

Makes design changes to all the settings sub-screens, including:

Copy changes
Padding/Margin changes
Adding/Updating new header images
Rearranging items (Data clearing screen only)

Steps to test this PR

Prerequisites: newSettings flag is on

Designs:

Private Search

Designs
Open Private Search screen
Screen should default to device transition and no longer crossfade
Check new header image is visible
Check Status Indicator is visible and "Always On"
Check copy has been updated
Check against designs

UI changes

Before	After

Web Tracking Protection

Designs
Open Web Tracking Protection screen
Screen should default to device transition and no longer crossfade
Check new header image is visible
Check Status Indicator is visible and "Always On"
Check copy has been updated
Check against designs

UI changes

Before	After

Cookie Pop-Up Protection

UI changes

Before	After

App Tracking Protection

Open App Tracking Protection screen
Screen should default to device transition and no longer crossfade
No other changes made to this screen

Email Protection

Open Email Protection screen
Screen should default to device transition and no longer crossfade
No other changes made to this screen

General

Open General screen
Screen should default to device transition and no longer crossfade
No other changes made to this screen

Sync & Backup

Designs
Open Sync & Backup screen
Screen should default to device transition and no longer crossfade
Check "Single Device Setup" heading is now "Other Options"
Check against designs

UI changes

Before	After

Appearance

Designs
Open Appearance screen
Screen should default to device transition and no longer crossfade
The App Icon should now be aligned to the right of the screen

UI changes

Before	After

Passwords & Autofill

Open Passwords & Autofill screen
Screen should default to device transition and no longer crossfade
The toolbar title should be "Passwords & Autofill"

UI changes

Before	After

Accessibility

Designs
Open Accessibility screen
Screen should default to device transition and no longer crossfade
Check screen top padding has been increased

UI changes

Before	After

Permissions

Open Permissions screen
Screen should default to device transition and no longer crossfade
No other changes made to this screen

Data Clearing

Designs
Open Data Clearing screen
Screen should default to device transition and no longer crossfade
Order of items should be 1. "Fire Button Animation" 2. Divider 3. "Fireproof Sites" 4. "Automatically Clear Data..." 5. "Clear On..."
Check against designs

UI changes

Before	After

Duck Player

Open Duck Player screen
Screen should default to device transition and no longer crossfade
No other changes made to this screen

About

Designs
Open About screen
Screen should default to device transition and no longer crossfade
Title in toolbar should be "About"
Check about copy matches designs
Check against designs

UI changes

Before	After

LegacySettings Screen

Prerequisites: newSettings flag is off

Smoke test, run through each item an ensure there are no major visual changes e.g. two header images instead of 1

Demo

Screen_recording_20241129_163452.mp4

mikescamell · 2024-11-29T12:28:53Z

This stack of pull requests is managed by Graphite. Learn more about stacking.

malmstein

Added a couple comments, nothing blocking.

malmstein · 2024-12-03T08:54:47Z

app/src/main/java/com/duckduckgo/app/webtrackingprotection/WebTrackingProtectionActivity.kt

+        override fun updateDrawState(ds: TextPaint) {
+            super.updateDrawState(ds)
+            if (newSettingsFeature.self().isEnabled()) {
+                ds.color = ContextCompat.getColor(applicationContext, CommonR.color.blue50)


the blue color is wrong, use accentBlue here instead.

context.getColorFromAttr(R.attr.daxColorAccentBlue)

malmstein · 2024-12-03T08:57:51Z

common/common-ui/src/main/java/com/duckduckgo/common/ui/view/StatusIndicator.kt

@@ -20,6 +20,7 @@ import android.content.Context
 import android.util.AttributeSet
 import android.widget.LinearLayout
 import com.duckduckgo.common.ui.viewbinding.viewBinding
+import com.duckduckgo.mobile.android.R
 import com.duckduckgo.mobile.android.databinding.ViewStatusIndicatorBinding

 class StatusIndicator @JvmOverloads constructor(


Can you rename this to StatusIndicatorView instead? Just to follow other conventions.

malmstein

nice work @mikescamell !

The new "Learn More" link text does not have an underline and is our own blue color We need to ensure that "Learn More" is placed on a newline after we create the Spannable The Cookie Image is slightly different in on/off scenarios (spikey cookie ends, checkmark sizing) and I will ask about this

We have one more state "Always On" which we need for a couple of sub screens. It makes more sense now to add this as an emum and allow setting from XML We can make a function that allows us to easily set on/off which we need in most cases that calls to the new setStatus function that takes a "Status"

It seemed easiest to add new views and just hide/show based on the flag

Similar to AutoConsent and I've made a note to extract the clickable span when I come back to tidy up

I purposefully did not flag the minor margin changes for the divider, I didn't think it was worth it.

Again not flagging purposefully as it's such a minor change

not flagging this as it's a simple change

We don't need to use makeSceneTransitionAnimation as we're not doing SharedElementTransitions This looks like it became a c/p for all the screens, resulting in some weird cross-fading

I didn't realise that adding new strings would mean that anyone asking for translations would get them, i now know to add them to donottranslate during development, but adding translatable=false for now to save moving them about

This was referenced Nov 29, 2024

Update Settings design: Add feature flag & new Settings screen #5300

Merged

Update Settings design: Add new SettingsListItem #5318

Merged

mikescamell mentioned this pull request Nov 29, 2024

Update Settings: Rearrange Settings screen #5330

Merged

36 tasks

mikescamell force-pushed the feature/mike/update-settings/update_subscreens branch 2 times, most recently from 9cbd91e to a3873ed Compare November 29, 2024 16:50

mikescamell marked this pull request as ready for review November 29, 2024 16:51

mikescamell requested review from malmstein and nalcalag as code owners November 29, 2024 16:51

mikescamell force-pushed the feature/mike/update-settings/rearrange-settings-screen branch from b062abb to ac87252 Compare December 2, 2024 09:27

mikescamell force-pushed the feature/mike/update-settings/update_subscreens branch from a3873ed to f9ee2ee Compare December 2, 2024 09:27

mikescamell force-pushed the feature/mike/update-settings/rearrange-settings-screen branch from ac87252 to 600bd64 Compare December 2, 2024 13:44

mikescamell force-pushed the feature/mike/update-settings/update_subscreens branch from f9ee2ee to 8cf3693 Compare December 2, 2024 13:44

Base automatically changed from feature/mike/update-settings/rearrange-settings-screen to develop December 3, 2024 08:51

mikescamell force-pushed the feature/mike/update-settings/update_subscreens branch from 8cf3693 to f740a42 Compare December 3, 2024 08:52

malmstein approved these changes Dec 3, 2024

View reviewed changes

mikescamell force-pushed the feature/mike/update-settings/update_subscreens branch from f740a42 to b8ef962 Compare December 9, 2024 10:54

malmstein self-assigned this Dec 9, 2024

malmstein approved these changes Dec 9, 2024

View reviewed changes

mikescamell enabled auto-merge (squash) December 9, 2024 20:52

mikescamell added 10 commits December 12, 2024 10:53

update autoconsent layout with new header views

454d439

update other areas to new Status enum

e5afe69

update private search layout

61b9c08

It seemed easiest to add new views and just hide/show based on the flag

update WebTrackingProtection

76760fd

Similar to AutoConsent and I've made a note to extract the clickable span when I come back to tidy up

update sync and backup screen

747add1

I purposefully did not flag the minor margin changes for the divider, I didn't think it was worth it.

fix top padding for accessibility

17f3534

Again not flagging purposefully as it's such a minor change

update passwords toolbar title

9e73ea2

update data clearing screen

ba15b26

mikescamell added 8 commits December 12, 2024 10:53

update about screen

554828f

fix icon margin in appearance

6ac7d40

not flagging this as it's a simple change

fix navigation transition to sub-screens

df9f96f

We don't need to use makeSceneTransitionAnimation as we're not doing SharedElementTransitions This looks like it became a c/p for all the screens, resulting in some weird cross-fading

formatting

ba611b0

fix: add translatable false to new strings

db4e35e

I didn't realise that adding new strings would mean that anyone asking for translations would get them, i now know to add them to donottranslate during development, but adding translatable=false for now to save moving them about

switch to accent blue

96985e7

rename to StatusIndicatorView to follow conventions

2b6d905

formatting

203d7c1

mikescamell force-pushed the feature/mike/update-settings/update_subscreens branch from 2ceafcb to 203d7c1 Compare December 12, 2024 09:54

mikescamell merged commit 4023cbe into develop Dec 12, 2024
6 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update Settings: Update sub-screens #5334

Update Settings: Update sub-screens #5334

mikescamell commented Nov 29, 2024 •

edited by malmstein

Loading

mikescamell commented Nov 29, 2024 •

edited

Loading

malmstein left a comment

malmstein Dec 3, 2024

malmstein Dec 3, 2024

malmstein left a comment

Update Settings: Update sub-screens #5334

Update Settings: Update sub-screens #5334

Conversation

mikescamell commented Nov 29, 2024 • edited by malmstein Loading

Description

Steps to test this PR

Private Search

UI changes

Web Tracking Protection

UI changes

Cookie Pop-Up Protection

UI changes

App Tracking Protection

Email Protection

General

Sync & Backup

UI changes

Appearance

UI changes

Passwords & Autofill

UI changes

Accessibility

UI changes

Permissions

Data Clearing

UI changes

Duck Player

About

UI changes

Demo

mikescamell commented Nov 29, 2024 • edited Loading

malmstein left a comment

Choose a reason for hiding this comment

malmstein Dec 3, 2024

Choose a reason for hiding this comment

malmstein Dec 3, 2024

Choose a reason for hiding this comment

malmstein left a comment

Choose a reason for hiding this comment

mikescamell commented Nov 29, 2024 •

edited by malmstein

Loading

mikescamell commented Nov 29, 2024 •

edited

Loading