Refined the Search Bar layout

Removed the background color of the search bar.
Set the background of the AppBarLayout as transparent.
Set the app bar height.

Bug: 118886724
Test: manual review
Change-Id: I7faedc693ce61d5a5237e8a72909b77b56268a4c
This commit is contained in:
Sunny Shao
2018-11-27 16:29:38 +08:00
committed by Fan Zhang
parent 154f34a35e
commit 86b1c7d0b1
6 changed files with 61 additions and 52 deletions

View File

@@ -2493,7 +2493,7 @@
errorLine2=" ^"> errorLine2=" ^">
<location <location
file="res/values/styles.xml" file="res/values/styles.xml"
line="422" line="425"
column="44"/> column="44"/>
</issue> </issue>
@@ -2509,7 +2509,7 @@
errorLine2=" ^"> errorLine2=" ^">
<location <location
file="res/values/styles.xml" file="res/values/styles.xml"
line="428" line="431"
column="44"/> column="44"/>
</issue> </issue>
@@ -2525,7 +2525,7 @@
errorLine2=" ^"> errorLine2=" ^">
<location <location
file="res/values/styles.xml" file="res/values/styles.xml"
line="429" line="432"
column="44"/> column="44"/>
</issue> </issue>
@@ -2541,7 +2541,23 @@
errorLine2=" ^"> errorLine2=" ^">
<location <location
file="res/values/styles.xml" file="res/values/styles.xml"
line="464" line="467"
column="34"/>
</issue>
<issue
id="HardCodedColor"
severity="Error"
message="Avoid using hardcoded color"
category="Correctness"
priority="4"
summary="Using hardcoded color"
explanation="Hardcoded color values are bad because theme changes cannot be uniformly applied.Instead use the theme specific colors such as `?android:attr/textColorPrimary` in attributes.&#xA;This ensures that a theme change from a light to a dark theme can be uniformlyapplied across the app."
errorLine1=" &lt;item name=&quot;strokeColor&quot;>@color/homepage_card_stroke_color&lt;/item>"
errorLine2=" ^">
<location
file="res/values/styles.xml"
line="474"
column="34"/> column="34"/>
</issue> </issue>

View File

@@ -15,42 +15,33 @@
limitations under the License. limitations under the License.
--> -->
<FrameLayout <com.google.android.material.card.MaterialCardView
xmlns:android="http://schemas.android.com/apk/res/android" xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/search_bar_container" android:id="@+id/search_bar"
style="@style/SearchBarStyle"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:background="?android:attr/colorBackground"
android:theme="@style/ThemeOverlay.Settings.SearchBar"
app:layout_scrollFlags="scroll|enterAlways"> app:layout_scrollFlags="scroll|enterAlways">
<androidx.cardview.widget.CardView <Toolbar
android:id="@+id/search_bar" android:id="@+id/search_action_bar"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="@dimen/search_bar_height"
android:layout_margin="@dimen/search_bar_margin" android:background="?android:attr/selectableItemBackground"
app:cardCornerRadius="@dimen/search_bar_corner_radius" android:contentInsetStartWithNavigation="@dimen/search_bar_content_inset"
app:cardElevation="@dimen/search_bar_card_elevation"> android:navigationIcon="@drawable/ic_search_24dp">
<Toolbar <TextView
android:id="@+id/search_action_bar" android:id="@+id/search_action_bar_title"
android:layout_width="match_parent" style="@style/TextAppearance.SearchBar"
android:layout_height="@dimen/search_bar_height" android:layout_width="wrap_content"
android:background="?android:attr/selectableItemBackground" android:layout_height="wrap_content"
android:contentInsetStartWithNavigation="@dimen/search_bar_content_inset" android:text="@string/search_menu"/>
android:navigationIcon="@drawable/ic_search_24dp"> </Toolbar>
<TextView <ImageView
android:id="@+id/search_action_bar_title" android:id="@+id/account_avatar"
style="@style/TextAppearance.SearchBar" android:layout_marginStart="@dimen/search_bar_avatar_start_margin"
android:layout_width="wrap_content" android:layout_marginEnd="@dimen/search_bar_avatar_end_margin"
android:layout_height="wrap_content" android:layout_width="@dimen/search_bar_avatar_size"
android:text="@string/search_menu"/> android:layout_height="@dimen/search_bar_avatar_size"
</Toolbar> android:layout_gravity="end|center_vertical"/>
<ImageView </com.google.android.material.card.MaterialCardView>
android:id="@+id/account_avatar"
android:layout_marginStart="@dimen/search_bar_avatar_start_margin"
android:layout_marginEnd="@dimen/search_bar_avatar_end_margin"
android:layout_width="@dimen/search_bar_avatar_size"
android:layout_height="@dimen/search_bar_avatar_size"
android:layout_gravity="end|center_vertical"/>
</androidx.cardview.widget.CardView>
</FrameLayout>

View File

@@ -23,11 +23,12 @@
<com.google.android.material.appbar.AppBarLayout <com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content"> android:layout_height="wrap_content"
android:background="@android:color/transparent"
app:elevation="0dp">
<include layout="@layout/search_bar"/> <include layout="@layout/search_bar"/>
</com.google.android.material.appbar.AppBarLayout> </com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView <androidx.core.widget.NestedScrollView
android:id="@+id/main_content_scrollable_container" android:id="@+id/main_content_scrollable_container"
android:layout_width="match_parent" android:layout_width="match_parent"

View File

@@ -95,11 +95,7 @@
<dimen name="switchbar_subsettings_margin_start">72dp</dimen> <dimen name="switchbar_subsettings_margin_start">72dp</dimen>
<dimen name="switchbar_subsettings_margin_end">16dp</dimen> <dimen name="switchbar_subsettings_margin_end">16dp</dimen>
<!-- The following two margins need to match, with the caveat that
the second should be negative. The second one ensures that the icons and text
align despite the additional padding caused by the search bar's card background. -->
<dimen name="search_bar_margin">16dp</dimen> <dimen name="search_bar_margin">16dp</dimen>
<dimen name="search_bar_negative_margin">-16dp</dimen>
<dimen name="search_bar_height">48dp</dimen> <dimen name="search_bar_height">48dp</dimen>
<dimen name="search_bar_corner_radius">2dp</dimen> <dimen name="search_bar_corner_radius">2dp</dimen>

View File

@@ -17,7 +17,7 @@
<resources> <resources>
<style name="Widget.ActionBar.Base" <style name="Widget.ActionBar.Base"
parent="@android:style/Widget.DeviceDefault.Light.ActionBar.Solid"/> parent="@android:style/Widget.DeviceDefault.Light.ActionBar.Solid"/>
<style name="Widget.ActionBar" <style name="Widget.ActionBar"
parent="Widget.ActionBar.Base"> parent="Widget.ActionBar.Base">
@@ -259,7 +259,8 @@
<style name="TextAppearance.Medium" parent="@android:style/TextAppearance.Material.Medium"/> <style name="TextAppearance.Medium" parent="@android:style/TextAppearance.Material.Medium"/>
<style name="TextAppearance.Small" parent="@android:style/TextAppearance.Material.Small"/> <style name="TextAppearance.Small" parent="@android:style/TextAppearance.Material.Small"/>
<style name="TextAppearance.Switch" parent="@android:style/TextAppearance.DeviceDefault.Widget.ActionBar.Title"> <style name="TextAppearance.Switch"
parent="@android:style/TextAppearance.DeviceDefault.Widget.ActionBar.Title">
<item name="android:textSize">16sp</item> <item name="android:textSize">16sp</item>
</style> </style>
@@ -400,9 +401,11 @@
<style name="ActionSecondaryButton" parent="android:Widget.DeviceDefault.Button"/> <style name="ActionSecondaryButton" parent="android:Widget.DeviceDefault.Button"/>
<style name="SettingsActionButton" parent="android:Widget.DeviceDefault.Button.Borderless.Colored"> <style name="SettingsActionButton"
parent="android:Widget.DeviceDefault.Button.Borderless.Colored">
<item name="android:drawablePadding">4dp</item> <item name="android:drawablePadding">4dp</item>
<item name="android:drawableTint">@*android:color/btn_colored_borderless_text_material</item> <item name="android:drawableTint">@*android:color/btn_colored_borderless_text_material
</item>
<item name="android:layout_marginEnd">8dp</item> <item name="android:layout_marginEnd">8dp</item>
<item name="android:paddingTop">20dp</item> <item name="android:paddingTop">20dp</item>
<item name="android:paddingBottom">20dp</item> <item name="android:paddingBottom">20dp</item>
@@ -465,6 +468,13 @@
<item name="strokeWidth">1dp</item> <item name="strokeWidth">1dp</item>
</style> </style>
<style name="SearchBarStyle">
<item name="android:layout_margin">@dimen/search_bar_margin</item>
<item name="cardCornerRadius">8dp</item>
<item name="strokeColor">@color/homepage_card_stroke_color</item>
<item name="strokeWidth">1dp</item>
</style>
<style name="ConditionCardBorderlessButton" <style name="ConditionCardBorderlessButton"
parent="android:Widget.DeviceDefault.Button.Borderless"> parent="android:Widget.DeviceDefault.Button.Borderless">
<item name="android:textColor">?android:attr/colorAccent</item> <item name="android:textColor">?android:attr/colorAccent</item>

View File

@@ -195,11 +195,6 @@
<item name="android:windowLightNavigationBar">true</item> <item name="android:windowLightNavigationBar">true</item>
</style> </style>
<style name="ThemeOverlay.Settings.SearchBar" parent="Theme.Settings">
<item name="android:colorBackground">?android:attr/colorPrimary</item>
<item name="cardBackgroundColor">?android:attr/colorBackground</item>
</style>
<style name="Theme.BottomDialog" parent="@*android:style/Theme.DeviceDefault.Settings.Dialog"> <style name="Theme.BottomDialog" parent="@*android:style/Theme.DeviceDefault.Settings.Dialog">
<item name="android:windowBackground">@drawable/settings_panel_background</item> <item name="android:windowBackground">@drawable/settings_panel_background</item>
</style> </style>