[Autofill Assistant] Change details background.

Screenshot: https://screenshot.googleplex.com/eq53CdQQLEv.png

(that will be in a DFM for M75).

Change-Id: I6374d259c6a18b8973896ef20c313beeaea19f35
Binary-Size: Adding background images for the Autofill Assistant feature
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1556842
Commit-Queue: Jordan Demeulenaere <jdemeulenaere@chromium.org>
Reviewed-by: Mathias Carlen <mcarlen@chromium.org>
Cr-Commit-Position: refs/heads/master@{#649085}

chrome/android/features/autofill_assistant/java/res/drawable/autofill_assistant_details_bg.xml → chrome/android/features/autofill_assistant/java/res/drawable/autofill_assistant_shadow_bg.xml

 <?xml version="1.0" encoding="utf-8"?>
-<!-- Copyright 2018 The Chromium Authors. All rights reserved.
+<!-- Copyright 2019 The Chromium Authors. All rights reserved.
      Use of this source code is governed by a BSD-style license that can be
      found in the LICENSE file. -->
-<shape
+<inset
     xmlns:android="http://schemas.android.com/apk/res/android"
-    android:shape="rectangle">
-    <corners
-        android:radius="8dp" />
-    <solid android:color="@color/modern_secondary_color"/>
-</shape>
+    android:drawable="@drawable/autofill_assistant_shadow_bg_image"
+    android:insetTop="-60dp"
+    android:insetBottom="-68dp"
+    android:insetLeft="-40dp"
+    android:insetRight="-40dp"/>
\ No newline at end of file

chrome/android/features/autofill_assistant/java/res/layout/autofill_assistant_button_filled.xml

@@ -11,4 +11,4 @@
     android:gravity="center_vertical|center_horizontal"
     android:minHeight="36dp"
     android:singleLine="true"
-    style="@style/FilledButton" />
+    style="@style/FilledButton.Flat" />

chrome/android/features/autofill_assistant/java/res/layout/autofill_assistant_details.xml

@@ -7,61 +7,55 @@
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    android:background="@drawable/autofill_assistant_details_bg"
-    android:padding="8dp"
+    android:background="@drawable/autofill_assistant_shadow_bg"
+    android:padding="16dp"
     android:visibility="gone"
     android:orientation="vertical">
     <LinearLayout android:layout_width="match_parent"
                   android:layout_height="wrap_content"
-                  android:orientation="horizontal">
+                  android:orientation="horizontal"
+                  android:gravity="center">
 
-        <org.chromium.ui.widget.ChromeImageView
-            android:id="@+id/details_image"
-            android:layout_width="@dimen/autofill_assistant_details_image_size"
-            android:layout_height="@dimen/autofill_assistant_details_image_size"
-            android:layout_marginEnd="8dp"
-            android:layout_gravity="top"
-            android:scaleType="centerCrop"/>
-
-        <LinearLayout android:layout_width="match_parent"
+        <LinearLayout android:layout_width="0dp"
                       android:layout_height="wrap_content"
-                      android:orientation="vertical"
-                      android:layout_gravity="top">
+                      android:layout_weight="1"
+                      android:orientation="vertical">
             <TextView
-                android:id="@+id/details_title"
+                android:id="@+id/details_line2"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:textAppearance="@style/TextAppearance.DetailsTitle"
                 android:singleLine="true"
                 android:requiresFadingEdge="horizontal"
                 android:fadingEdgeLength="20dp"
-                android:ellipsize="none"
-                android:layout_marginBottom="0dp"/>
+                android:ellipsize="none" />
 
             <TextView
-                android:id="@+id/details_line1"
+                android:id="@+id/details_title"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:textAppearance="@style/TextAppearance.AssistantGreyCaption"
                 android:singleLine="true"
                 android:requiresFadingEdge="horizontal"
                 android:fadingEdgeLength="20dp"
                 android:ellipsize="none"
-                android:layout_marginTop="0dp"
                 android:layout_marginBottom="0dp"/>
 
             <TextView
-                android:id="@+id/details_line2"
+                android:id="@+id/details_line1"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:textAppearance="@style/TextAppearance.AssistantGreyCaption"
+                android:layout_marginTop="2dp"
                 android:singleLine="true"
                 android:requiresFadingEdge="horizontal"
                 android:fadingEdgeLength="20dp"
-                android:ellipsize="none"
-                android:layout_marginTop="0dp"
-                android:layout_marginBottom="0dp"/>
+                android:ellipsize="none"/>
         </LinearLayout>
+
+        <org.chromium.ui.widget.ChromeImageView
+            android:id="@+id/details_image"
+            android:layout_width="@dimen/autofill_assistant_details_image_size"
+            android:layout_height="@dimen/autofill_assistant_details_image_size"
+            android:layout_marginStart="8dp"
+            android:scaleType="centerCrop"/>
     </LinearLayout>
 
     <LinearLayout android:id="@+id/details_price"
@@ -71,7 +65,7 @@
 
         <View style="@style/HorizontalDivider"
               android:layout_width="match_parent"
-              android:layout_height="2dp"
+              android:layout_height="1dp"
               android:layout_marginTop="8dp"
               android:layout_marginBottom="8dp"/>
 
@@ -82,7 +76,6 @@
                 android:id="@+id/details_total_price_label"
                 android:layout_width="wrap_content"
                 android:layout_height="match_parent"
-                android:textAppearance="@style/TextAppearance.DetailsTitle"
                 android:singleLine="true"/>
 
             <Space
@@ -94,7 +87,6 @@
                 android:id="@+id/details_total_price"
                 android:layout_width="wrap_content"
                 android:layout_height="match_parent"
-                android:textAppearance="@style/TextAppearance.DetailsTitle"
                 android:singleLine="true"/>
         </LinearLayout>
     </LinearLayout>

chrome/android/features/autofill_assistant/java/res/layout/autofill_assistant_sheet.xml

@@ -43,6 +43,8 @@
                 android:id="@+id/autofill_assistant_bottombar_container"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
+                android:clipChildren="false"
+                android:clipToPadding="false"
                 android:paddingBottom="@dimen/autofill_assistant_bottombar_vertical_spacing"
                 android:orientation="vertical"
                 android:gravity="center"

chrome/android/features/autofill_assistant/java/res/values-v17/colors.xml

@@ -9,7 +9,6 @@
 
     Please see src/ui/android/java/res/values/colors.xml for the shared common colors.
     -->
-    <color name="autofill_assistant_caption_grey">@color/modern_grey_800</color>
     <color name="autofill_assistant_light_grey">@color/modern_grey_300</color>
     <color name="autofill_assistant_light_blue">#E9F0FD</color>
 </resources>

chrome/android/features/autofill_assistant/java/res/values-v17/dimens.xml

@@ -5,7 +5,7 @@
 <resources>
     <dimen name="autofill_assistant_bottombar_horizontal_spacing">24dp</dimen>
     <dimen name="autofill_assistant_bottombar_vertical_spacing">20dp</dimen>
-    <dimen name="autofill_assistant_details_image_size">48dp</dimen>
+    <dimen name="autofill_assistant_details_image_size">56dp</dimen>
     <dimen name="autofill_assistant_poodle_size">24dp</dimen>
     <dimen name="autofill_assistant_info_box_spacing">16dp</dimen>
     <dimen name="autofill_assistant_poodle_view_size">34dp</dimen>

chrome/android/features/autofill_assistant/java/res/values-v17/styles.xml

@@ -5,7 +5,11 @@
 
 <resources>
     <!-- TODO(crbuc.com/806868): Use a Chrome approved text appearance and remove this. -->
-    <style name="TextAppearance.DetailsTitle" parent="TextAppearance.AccentMediumStyle">
+    <style name="TextAppearance.AssistantDetailsTitle" parent="TextAppearance.AccentMediumStyle">
+        <item name="android:textColor">@color/default_text_color_list</item>
+        <item name="android:textSize">@dimen/text_size_large</item>
+    </style>
+    <style name="TextAppearance.AssistantDetailsPrice" parent="TextAppearance.AccentMediumStyle">
         <item name="android:textColor">@color/default_text_color_list</item>
         <item name="android:textSize">@dimen/text_size_small</item>
     </style>
@@ -16,10 +20,6 @@
     <style name="TextAppearance.AssistantBlackCaption" parent="TextAppearance.BlackCaption">
         <item name="android:fontFamily">@font/accent_font</item>
     </style>
-    <style name="TextAppearance.AssistantGreyCaption" parent="TextAppearance.BlackCaption">
-        <item name="android:textColor">@color/autofill_assistant_caption_grey</item>
-        <item name="android:fontFamily">@font/accent_font</item>
-    </style>
     <style name="TextAppearance.AssistantBlackBody" parent="TextAppearance.BlackBody">
         <item name="android:fontFamily">@font/accent_font</item>
     </style>

chrome/android/features/autofill_assistant/java/src/org/chromium/chrome/browser/autofill_assistant/details/AssistantDetailsViewBinder.java

@@ -17,6 +17,7 @@ import android.graphics.drawable.Drawable;
 import android.graphics.drawable.GradientDrawable;
 import android.media.ThumbnailUtils;
 import android.os.Build;
+import android.support.annotation.StyleRes;
 import android.support.v4.graphics.drawable.RoundedBitmapDrawable;
 import android.support.v4.graphics.drawable.RoundedBitmapDrawableFactory;
 import android.text.TextUtils;
@@ -56,7 +57,7 @@ import java.util.Locale;
 class AssistantDetailsViewBinder
         implements PropertyModelChangeProcessor.ViewBinder<AssistantDetailsModel,
                 AssistantDetailsViewBinder.ViewHolder, PropertyKey> {
-    private static final int IMAGE_BORDER_RADIUS = 4;
+    private static final int IMAGE_BORDER_RADIUS = 8;
     private static final int PULSING_DURATION_MS = 1_000;
     private static final String DETAILS_TIME_FORMAT = "H:mma";
     private static final String DETAILS_DATE_FORMAT = "EEE, MMM d";
@@ -228,11 +229,16 @@ class AssistantDetailsViewBinder
     }
 
     private void setTextStyles(AssistantDetails details, ViewHolder viewHolder) {
-        setTitleStyle(details.getUserApprovalRequired(), details.getHighlightTitle(), viewHolder);
-        setSubtextStyle(viewHolder.mDescriptionLine1View, details.getUserApprovalRequired(),
-                details.getHighlightLine1(), viewHolder);
-        setSubtextStyle(viewHolder.mDescriptionLine2View, details.getUserApprovalRequired(),
-                details.getHighlightLine2(), viewHolder);
+        setTextStyle(viewHolder.mTitleView, details.getUserApprovalRequired(),
+                details.getHighlightTitle(), R.style.TextAppearance_AssistantDetailsTitle);
+        setTextStyle(viewHolder.mDescriptionLine1View, details.getUserApprovalRequired(),
+                details.getHighlightLine1(), R.style.TextAppearance_BlackCaption);
+        setTextStyle(viewHolder.mDescriptionLine2View, details.getUserApprovalRequired(),
+                details.getHighlightLine2(), R.style.TextAppearance_BlackHint2);
+        setTextStyle(viewHolder.mTotalPriceLabelView, details.getUserApprovalRequired(),
+                /* highlight= */ false, R.style.TextAppearance_AssistantDetailsPrice);
+        setTextStyle(viewHolder.mTotalPriceView, details.getUserApprovalRequired(),
+                /* highlight= */ false, R.style.TextAppearance_AssistantDetailsPrice);
 
         if (shouldStartOrContinuePlaceholderAnimation(details, viewHolder)) {
             startOrContinuePlaceholderAnimations(viewHolder);
@@ -250,35 +256,17 @@ class AssistantDetailsViewBinder
         return details.getAnimatePlaceholders() && isAtLeastOneFieldEmpty;
     }
 
-    private void setTitleStyle(boolean approvalRequired, boolean highlight, ViewHolder viewHolder) {
-        TextView titleView = viewHolder.mTitleView;
-        if (approvalRequired && !highlight) {
-            // De-emphasize title if user needs to accept details but the title should not be
-            // highlighted.
-            titleView.setTextColor(ApiCompatibilityUtils.getColor(
-                    mContext.getResources(), R.color.modern_grey_300));
-        } else {
-            // Normal style: bold black text.
-            ApiCompatibilityUtils.setTextAppearance(
-                    titleView, R.style.TextAppearance_BlackCaptionDefault);
-            if (highlight) {
-                titleView.setTypeface(titleView.getTypeface(), Typeface.BOLD);
-            }
-        }
-    }
+    private void setTextStyle(
+            TextView view, boolean approvalRequired, boolean highlight, @StyleRes int normalStyle) {
+        ApiCompatibilityUtils.setTextAppearance(view, normalStyle);
 
-    private void setSubtextStyle(
-            TextView view, boolean approvalRequired, boolean highlight, ViewHolder viewHolder) {
-        // Emphasized style.
         if (approvalRequired && highlight) {
+            // Emphasized style.
             view.setTypeface(view.getTypeface(), Typeface.BOLD_ITALIC);
         } else if (approvalRequired) {
             // De-emphasized style.
             view.setTextColor(ApiCompatibilityUtils.getColor(
                     mContext.getResources(), R.color.modern_grey_300));
-        } else {
-            // getUserApprovalRequired == false, normal style.
-            ApiCompatibilityUtils.setTextAppearance(view, R.style.TextAppearance_BlackCaption);
         }
     }