Merge pull request #17317 from wordpress-mobile/issue/17313-voice-assistant-jp-android-landing-screen

[Revamp Landing Screen] Jetpack App - Ignore background and animated text by screen readers

Author: antonis

WordPress/src/jetpack/java/org/wordpress/android/ui/accounts/login/components/ColumnWithFrostedGlassBackground.kt

@@ -17,7 +17,6 @@ import androidx.compose.ui.geometry.Rect
 import androidx.compose.ui.geometry.Size
 import androidx.compose.ui.graphics.Outline.Rectangle
 import androidx.compose.ui.graphics.Shape
-import androidx.compose.ui.graphics.SolidColor
 import androidx.compose.ui.layout.SubcomposeLayout
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.unit.Density
@@ -41,7 +40,7 @@ private fun ColumnWithTopGlassBorder(
     content: @Composable ColumnScope.() -> Unit
 ) {
     Column(
-            modifier = Modifier.background(SolidColor(colorResource(R.color.bg_jetpack_login_splash_bottom_panel)))
+            modifier = Modifier.background(colorResource(R.color.bg_jetpack_login_splash_bottom_panel))
     ) {
         Divider(
                 thickness = 1.dp,

WordPress/src/jetpack/java/org/wordpress/android/ui/accounts/login/components/LoopingTextWithBackground.kt

@@ -1,18 +1,18 @@
 package org.wordpress.android.ui.accounts.login.components
 
 import android.content.res.Configuration
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.paint
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.semantics.clearAndSetSemantics
 import androidx.compose.ui.tooling.preview.Devices
 import androidx.compose.ui.tooling.preview.Preview
 import org.wordpress.android.R
@@ -23,15 +23,18 @@ fun LoopingTextWithBackground(
     modifier: Modifier = Modifier,
     textModifier: Modifier = Modifier,
 ) {
-    Box(modifier.background(colorResource(R.color.bg_jetpack_login_splash))) {
-        Image(
-                painter = painterResource(R.drawable.bg_jetpack_login_splash),
-                contentDescription = stringResource(R.string.login_prologue_revamped_content_description_bg),
-                contentScale = ContentScale.FillBounds,
-                modifier = Modifier.matchParentSize(),
-        )
+    Box(
+            modifier
+                    .background(colorResource(R.color.bg_jetpack_login_splash))
+                    .paint(
+                            painter = painterResource(R.drawable.bg_jetpack_login_splash),
+                            sizeToIntrinsics = true,
+                            contentScale = ContentScale.FillBounds,
+                    )
+    ) {
         LoopingText(
                 modifier = Modifier
+                        .clearAndSetSemantics {}
                         .fillMaxSize()
                         .padding(horizontal = dimensionResource(R.dimen.login_prologue_revamped_prompts_padding))
                         .then(textModifier)

WordPress/src/jetpack/java/org/wordpress/android/ui/accounts/login/components/TopLinearGradient.kt

@@ -8,18 +8,16 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Devices
 import androidx.compose.ui.tooling.preview.Preview
 import org.wordpress.android.R.drawable
-import org.wordpress.android.R.string
 import org.wordpress.android.ui.compose.theme.AppTheme
 
 @Composable
 fun TopLinearGradient(modifier: Modifier = Modifier) {
     Image(
             painter = painterResource(drawable.bg_jetpack_login_splash_top_gradient),
-            contentDescription = stringResource(string.login_prologue_revamped_content_description_top_bg),
+            contentDescription = null,
             contentScale = ContentScale.FillBounds,
             modifier = modifier
                     .fillMaxWidth()

WordPress/src/jetpack/res/values/strings.xml

@@ -13,8 +13,6 @@
     <string name="app_tagline">Site security and performance from your pocket</string>
     <string name="continue_with_wpcom_no_signup">Continue with WordPress.com</string>
     <string name="login_prologue_revamped_content_description_jetpack_logo">Jetpack logo</string>
-    <string name="login_prologue_revamped_content_description_bg">Jetpack background</string>
-    <string name="login_prologue_revamped_content_description_top_bg">Jetpack top background fade</string>
 
     <string name="login_prologue_revamped_jetpack_feature_text_1">Update a plugin</string>
     <string name="login_prologue_revamped_jetpack_feature_text_2">Build a site</string>