From ebc3a3e8814fb178c0afa5e046259b1f187523dd Mon Sep 17 00:00:00 2001
From: Tsung-Mao Fang <tmfang@google.com>
Date: Thu, 22 Oct 2020 15:56:07 +0800
Subject: [PATCH] Refine search ui and avatar based on spec

This is the first version, we will keep tweaking
the details later.

Bug: 171278055
Test: Screenshot - https://screenshot.googleplex.com/ApRgDZknkvX9PWo
Change-Id: Ie99cf9e187aa2440486cc2eae90e04287daf0a1d
---
 res/layout/search_bar.xml | 59 ++++++++++++++++++++++-----------------
 res/values/dimens.xml     | 11 ++------
 res/values/styles.xml     |  4 +--
 3 files changed, 38 insertions(+), 36 deletions(-)

diff --git a/res/layout/search_bar.xml b/res/layout/search_bar.xml
index 420c965a19b..d3e98c37ea3 100644
--- a/res/layout/search_bar.xml
+++ b/res/layout/search_bar.xml
@@ -15,36 +15,43 @@
      limitations under the License.
 -->
 
-<com.google.android.material.card.MaterialCardView
+<LinearLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
-    android:id="@+id/search_bar"
-    style="@style/SearchBarStyle"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    android:layout_margin="@dimen/search_bar_margin"
     app:layout_scrollFlags="scroll|enterAlways">
-    <Toolbar
-        android:id="@+id/search_action_bar"
-        android:layout_width="match_parent"
-        android:layout_height="@dimen/search_bar_height"
-        android:layout_marginStart="-2dp"
-        android:background="@drawable/search_bar_selected_background"
-        android:contentInsetStartWithNavigation="@dimen/search_bar_content_inset"
-        android:navigationIcon="@drawable/ic_homepage_search">
-        <TextView
-            android:id="@+id/search_action_bar_title"
-            style="@style/TextAppearance.SearchBar"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:text="@string/search_menu"/>
-    </Toolbar>
-    <ImageView
+
+    <com.google.android.material.card.MaterialCardView
+        android:id="@+id/search_bar"
+        style="@style/SearchBarStyle"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_weight="1">
+        <Toolbar
+            android:id="@+id/search_action_bar"
+            android:layout_width="match_parent"
+            android:layout_height="@dimen/search_bar_height"
+            android:layout_marginStart="-2dp"
+            android:background="@drawable/search_bar_selected_background"
+            android:contentInsetStartWithNavigation="@dimen/search_bar_content_inset"
+            android:navigationIcon="@drawable/ic_homepage_search">
+            <TextView
+                android:id="@+id/search_action_bar_title"
+                style="@style/TextAppearance.SearchBar"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_gravity="start"
+                android:text="@string/search_menu"/>
+        </Toolbar>
+    </com.google.android.material.card.MaterialCardView>
+
+   <ImageView
         android:id="@+id/account_avatar"
-        android:paddingEnd="@dimen/search_bar_avatar_end_padding"
-        android:paddingTop="@dimen/search_bar_avatar_top_bottom_padding"
-        android:paddingBottom="@dimen/search_bar_avatar_top_bottom_padding"
-        android:layout_width="@dimen/search_bar_avatar_width"
-        android:layout_height="@dimen/search_bar_height"
-        android:layout_gravity="end"
+        android:layout_width="@dimen/avatar_length"
+        android:layout_height="@dimen/avatar_length"
+        android:layout_gravity="center_vertical"
         android:contentDescription="@string/search_bar_account_avatar_content_description"/>
-</com.google.android.material.card.MaterialCardView>
+</LinearLayout>
+
diff --git a/res/values/dimens.xml b/res/values/dimens.xml
index a561df2a86c..d0d97748afc 100755
--- a/res/values/dimens.xml
+++ b/res/values/dimens.xml
@@ -123,18 +123,13 @@
     <dimen name="switchbar_subsettings_margin_start">72dp</dimen>
     <dimen name="switchbar_subsettings_margin_end">16dp</dimen>
 
-    <dimen name="search_bar_margin">16dp</dimen>
-
+    <dimen name="search_bar_margin">18dp</dimen>
     <dimen name="search_bar_height">48dp</dimen>
-    <dimen name="search_bar_corner_radius">2dp</dimen>
     <dimen name="search_bar_text_size">16dp</dimen>
     <dimen name="search_bar_card_elevation">2dp</dimen>
     <dimen name="search_bar_content_inset">64dp</dimen>
-    <dimen name="search_bar_avatar_end_padding">16dp</dimen>
-    <!-- 32dp (avatar size) + 16 dp (search_bar_avatar_end_padding) -->
-    <dimen name="search_bar_avatar_width">48dp</dimen>
-    <!-- (search_bar_height 48dp - avatar size 32dp) / 2  -->
-    <dimen name="search_bar_avatar_top_bottom_padding">8dp</dimen>
+    <dimen name="avatar_length">@dimen/search_bar_height</dimen>
+
 
     <!-- Dimensions for Wifi Assistant Card -->
     <dimen name="wifi_assistant_padding_top_bottom">16dp</dimen>
diff --git a/res/values/styles.xml b/res/values/styles.xml
index a4f6fbeaec7..ac495619b5a 100644
--- a/res/values/styles.xml
+++ b/res/values/styles.xml
@@ -474,8 +474,8 @@
     </style>
 
     <style name="SearchBarStyle">
-        <item name="android:layout_margin">@dimen/search_bar_margin</item>
-        <item name="cardCornerRadius">@*android:dimen/config_dialogCornerRadius</item>
+        <item name="android:layout_marginEnd">@dimen/search_bar_margin</item>
+        <item name="cardCornerRadius">30dp</item>
         <item name="enforceMaterialTheme">true</item>
         <item name="cardElevation">3dp</item>
         <item name="shapeAppearance">@null</item>