[Autofill Assistant] Improve onboarding screen.

Before:
 * https://screenshot.googleplex.com/BpQHiNsZkrK.png

After:
 * https://screenshot.googleplex.com/9m7YwMN9L03.png
 * https://screenshot.googleplex.com/udJvgvVyR5k.png

Binary-Size: Adding image resources for the Autofill Assistant feature that will be in a DFM before M75.
Change-Id: I0e0506dc235a3b06f712e47ddb0d01ebd3ede337
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1560155
Commit-Queue: Jordan Demeulenaere <jdemeulenaere@chromium.org>
Reviewed-by: Clemens Arbesser <arbesser@google.com>
Cr-Commit-Position: refs/heads/master@{#649838}

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

@@ -16,6 +16,7 @@
     android:clipToPadding="false"
     android:orientation="vertical">
     <LinearLayout
+        android:id="@+id/header"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:minHeight="56dp"

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

@@ -25,45 +25,63 @@
             android:paddingStart="24dp"
             android:paddingEnd="24dp">
 
+            <Space android:layout_width="0dp" android:layout_height="12dp"/>
+
             <!-- Image background -->
             <ImageView
+                android:id="@+id/onboarding_image"
                 tools:ignore="contentDescription"
                 android:layout_width="250dp"
-                android:layout_height="141dp"
+                android:layout_height="wrap_content"
                 android:scaleType="centerCrop"
-                android:src="@drawable/onboarding_background"
-                android:paddingBottom="15dp"/>
+                android:src="@drawable/autofill_assistant_onboarding_bg"
+                android:layout_marginTop="12dp" />
 
-            <!-- Title (e.g., 'Fast Checkout')-->
-            <TextView
+            <!-- "Try Google Assistant in Chrome" -->
+            <ImageView
+                android:id="@+id/onboarding_try_assistant"
+                tools:ignore="contentDescription"
+                android:layout_width="185dp"
                 android:layout_height="wrap_content"
-                android:layout_width="wrap_content"
-                android:textAppearance="@style/TextAppearance.AssistantBlackTitle"
-                android:gravity="center_horizontal"
-                android:text="@string/autofill_assistant_onboarding_title" />
+                android:layout_marginTop="16dp"
+                android:src="@drawable/autofill_assistant_onboarding_try" />
 
             <!-- Subtitle (e.g., 'Google Assistant saves you time...')-->
-            <Space android:layout_width="0dp" android:layout_height="16dp"/>
-            <TextView
-                android:layout_height="wrap_content"
-                android:layout_width="wrap_content"
-                android:textAppearance="@style/TextAppearance.AssistantBlackBody"
-                android:paddingStart="12dp"
-                android:paddingEnd="12dp"
-                android:gravity="center_horizontal"
-                android:text="@string/autofill_assistant_init_message" />
+            <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content">
+                <Space
+                    android:layout_width="0dp"
+                    android:layout_height="1dp"
+                    android:layout_weight="1"/>
+                <!-- The subtitle takes 4/6 of the screen width. -->
+                <TextView
+                    android:id="@+id/onboarding_subtitle"
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:layout_weight="4"
+                    android:layout_marginTop="24dp"
+                    android:textAppearance="@style/TextAppearance.AssistantBlackBody"
+                    android:gravity="center_horizontal"
+                    android:text="@string/autofill_assistant_init_message" />
+                <Space
+                    android:layout_width="0dp"
+                    android:layout_height="1dp"
+                    android:layout_weight="1"/>
+            </LinearLayout>
 
             <!-- Separator -->
-            <Space android:layout_width="0dp" android:layout_height="24dp"/>
             <LinearLayout
+                android:id="@+id/onboarding_separator"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
+                android:layout_marginTop="24dp"
                 android:gravity="center_horizontal"
                 android:orientation="horizontal"
                 android:weightSum="1.0">
                 <View style="@style/HorizontalDivider"
                     android:layout_width="0dp"
-                    android:layout_height="2dp"
+                    android:layout_height="1dp"
                     android:layout_weight="0.33"/>
             </LinearLayout>
             <Space android:layout_width="0dp" android:layout_height="24dp"/>
@@ -72,10 +90,7 @@
             <LinearLayout
                 android:layout_height="wrap_content"
                 android:layout_width="match_parent"
-                android:paddingStart="12dp"
-                android:paddingEnd="12dp"
                 android:paddingBottom="9dp">
-
                 <TextView
                     android:id="@+id/google_terms_message"
                     android:layout_width="wrap_content"

chrome/android/features/autofill_assistant/java/src/org/chromium/chrome/browser/autofill_assistant/AssistantBottomBarCoordinator.java

@@ -134,7 +134,7 @@ class AssistantBottomBarCoordinator {
      * proceed, false otherwise.
      */
     public void showOnboarding(Callback<Boolean> callback) {
-        mModel.getHeaderModel().set(AssistantHeaderModel.FEEDBACK_VISIBLE, false);
+        mModel.getHeaderModel().set(AssistantHeaderModel.VISIBLE, false);
 
         // Show overlay to prevent user from interacting with the page during onboarding.
         mModel.getOverlayModel().set(AssistantOverlayModel.STATE, AssistantOverlayState.FULL);
@@ -147,7 +147,7 @@ class AssistantBottomBarCoordinator {
                         return;
                     }
 
-                    mModel.getHeaderModel().set(AssistantHeaderModel.FEEDBACK_VISIBLE, true);
+                    mModel.getHeaderModel().set(AssistantHeaderModel.VISIBLE, true);
 
                     // Hide overlay.
                     mModel.getOverlayModel().set(

chrome/android/features/autofill_assistant/java/src/org/chromium/chrome/browser/autofill_assistant/AssistantOnboardingCoordinator.java

@@ -23,6 +23,9 @@ import org.chromium.ui.text.SpanApplier;
  * Assistant for the first time.
  */
 class AssistantOnboardingCoordinator {
+    // TODO(crbug.com/806868): Wire this with A/B experiment.
+    private static final boolean SHOW_SMALL_ONBOARDING = false;
+
     /**
      * Shows the onboarding screen and returns whether we should proceed.
      */
@@ -55,9 +58,20 @@ class AssistantOnboardingCoordinator {
         initView.announceForAccessibility(
                 context.getString(R.string.autofill_assistant_first_run_accessibility));
 
+        // Hide views that should not be displayed when showing the small onboarding.
+        if (SHOW_SMALL_ONBOARDING) {
+            hide(initView, R.id.onboarding_image);
+            hide(initView, R.id.onboarding_subtitle);
+            hide(initView, R.id.onboarding_separator);
+        }
+
         return initView;
     }
 
+    private static void hide(View root, int resId) {
+        root.findViewById(resId).setVisibility(View.GONE);
+    }
+
     private static void onClicked(
             boolean accept, ViewGroup root, View initView, Callback<Boolean> callback) {
         AutofillAssistantPreferencesUtil.setInitialPreferences(accept);

chrome/android/features/autofill_assistant/java/src/org/chromium/chrome/browser/autofill_assistant/header/AssistantHeaderCoordinator.java

@@ -15,7 +15,8 @@ import org.chromium.ui.modelutil.PropertyModelChangeProcessor;
  * Coordinator for the header of the Autofill Assistant.
  */
 public class AssistantHeaderCoordinator {
-    public AssistantHeaderCoordinator(Context context, ViewGroup root, AssistantHeaderModel model) {
+    public AssistantHeaderCoordinator(
+            Context context, ViewGroup bottomBarView, AssistantHeaderModel model) {
         // Create the poodle and insert it before the status message. We have to create a view
         // bigger than the desired poodle size (24dp) because the actual downstream implementation
         // needs extra space for the animation.
@@ -24,13 +25,16 @@ public class AssistantHeaderCoordinator {
                         R.dimen.autofill_assistant_poodle_view_size),
                 context.getResources().getDimensionPixelSize(
                         R.dimen.autofill_assistant_poodle_size));
-        addPoodle(root, poodle.getView());
+        addPoodle(bottomBarView, poodle.getView());
 
         // Bind view and mediator through the model.
         AssistantHeaderViewBinder.ViewHolder viewHolder =
-                new AssistantHeaderViewBinder.ViewHolder(root, poodle);
+                new AssistantHeaderViewBinder.ViewHolder(bottomBarView, poodle);
         AssistantHeaderViewBinder viewBinder = new AssistantHeaderViewBinder();
         PropertyModelChangeProcessor.create(model, viewHolder, viewBinder);
+
+        model.set(AssistantHeaderModel.VISIBLE, true);
+        model.set(AssistantHeaderModel.PROGRESS_VISIBLE, true);
     }
 
     private void addPoodle(ViewGroup root, View poodleView) {

chrome/android/features/autofill_assistant/java/src/org/chromium/chrome/browser/autofill_assistant/header/AssistantHeaderModel.java

@@ -14,15 +14,12 @@ import org.chromium.ui.modelutil.PropertyModel;
  */
 @JNINamespace("autofill_assistant")
 public class AssistantHeaderModel extends PropertyModel {
+    public static final WritableBooleanPropertyKey VISIBLE = new WritableBooleanPropertyKey();
+
     @VisibleForTesting
     public static final WritableObjectPropertyKey<String> STATUS_MESSAGE =
             new WritableObjectPropertyKey<>();
 
-    // TODO(crbug.com/806868): Change visibility to package-private once this is only set through
-    // native calls.
-    public static final WritableBooleanPropertyKey FEEDBACK_VISIBLE =
-            new WritableBooleanPropertyKey();
-
     static final WritableIntPropertyKey PROGRESS = new WritableIntPropertyKey();
 
     @VisibleForTesting
@@ -35,7 +32,7 @@ public class AssistantHeaderModel extends PropertyModel {
             new WritableObjectPropertyKey<>();
 
     public AssistantHeaderModel() {
-        super(STATUS_MESSAGE, FEEDBACK_VISIBLE, PROGRESS, PROGRESS_VISIBLE, SPIN_POODLE,
+        super(VISIBLE, STATUS_MESSAGE, PROGRESS, PROGRESS_VISIBLE, SPIN_POODLE,
                 FEEDBACK_BUTTON_CALLBACK);
     }
 

chrome/android/features/autofill_assistant/java/src/org/chromium/chrome/browser/autofill_assistant/header/AssistantHeaderViewBinder.java

@@ -24,35 +24,34 @@ class AssistantHeaderViewBinder
      */
     static class ViewHolder {
         final AnimatedPoodle mPoodle;
+        final View mHeader;
         final TextView mStatusMessage;
         final AnimatedProgressBar mProgressBar;
         final View mFeedbackButton;
 
-        public ViewHolder(View headerView, AnimatedPoodle poodle) {
+        public ViewHolder(View bottomBarView, AnimatedPoodle poodle) {
             mPoodle = poodle;
-            mStatusMessage = headerView.findViewById(R.id.status_message);
-            mProgressBar = new AnimatedProgressBar(headerView.findViewById(R.id.progress_bar));
-            mFeedbackButton = headerView.findViewById(R.id.feedback_button);
+            mHeader = bottomBarView.findViewById(R.id.header);
+            mStatusMessage = bottomBarView.findViewById(R.id.status_message);
+            mProgressBar = new AnimatedProgressBar(bottomBarView.findViewById(R.id.progress_bar));
+            mFeedbackButton = bottomBarView.findViewById(R.id.feedback_button);
         }
     }
 
     @Override
     public void bind(AssistantHeaderModel model, ViewHolder view, PropertyKey propertyKey) {
-        if (AssistantHeaderModel.STATUS_MESSAGE == propertyKey) {
+        if (AssistantHeaderModel.VISIBLE == propertyKey) {
+            view.mHeader.setVisibility(
+                    model.get(AssistantHeaderModel.VISIBLE) ? View.VISIBLE : View.GONE);
+            setProgressBarVisibility(view, model);
+        } else if (AssistantHeaderModel.STATUS_MESSAGE == propertyKey) {
             String message = model.get(AssistantHeaderModel.STATUS_MESSAGE);
             view.mStatusMessage.setText(message);
             view.mStatusMessage.announceForAccessibility(message);
-        } else if (AssistantHeaderModel.FEEDBACK_VISIBLE == propertyKey) {
-            view.mFeedbackButton.setVisibility(
-                    model.get(AssistantHeaderModel.FEEDBACK_VISIBLE) ? View.VISIBLE : View.GONE);
         } else if (AssistantHeaderModel.PROGRESS == propertyKey) {
             view.mProgressBar.setProgress(model.get(AssistantHeaderModel.PROGRESS));
         } else if (AssistantHeaderModel.PROGRESS_VISIBLE == propertyKey) {
-            if (model.get(AssistantHeaderModel.PROGRESS_VISIBLE)) {
-                view.mProgressBar.show();
-            } else {
-                view.mProgressBar.hide();
-            }
+            setProgressBarVisibility(view, model);
         } else if (AssistantHeaderModel.SPIN_POODLE == propertyKey) {
             view.mPoodle.setSpinEnabled(model.get(AssistantHeaderModel.SPIN_POODLE));
         } else if (AssistantHeaderModel.FEEDBACK_BUTTON_CALLBACK == propertyKey) {
@@ -62,4 +61,13 @@ class AssistantHeaderViewBinder
             assert false : "Unhandled property detected in AssistantHeaderViewBinder!";
         }
     }
+
+    private void setProgressBarVisibility(ViewHolder view, AssistantHeaderModel model) {
+        if (model.get(AssistantHeaderModel.VISIBLE)
+                && model.get(AssistantHeaderModel.PROGRESS_VISIBLE)) {
+            view.mProgressBar.show();
+        } else {
+            view.mProgressBar.hide();
+        }
+    }
 }

chrome/android/features/autofill_assistant/java/strings/android_chrome_autofill_assistant_strings.grd

@@ -112,9 +112,6 @@
   </translations>
   <release allow_pseudo="false" seq="1">
     <messages fallback_to_english="true">
-      <message name="IDS_AUTOFILL_ASSISTANT_ONBOARDING_TITLE" desc="Onboarding title for the autofill assistant.">
-        Google Assistant\nin Chrome
-      </message>
       <message name="IDS_INIT_OK" desc="Init screen confirmation text.">
         I accept
       </message>