Commit 91aa61bc authored by Jinsuk Kim's avatar Jinsuk Kim Committed by Commit Bot

Android: Refine gesture navigation arrow bubble UI

Replaces gesture navigation arrow bubble drawable with a 9-patch one
that doesn't need raw color constants. And made the size a little
bigger (40dp for bubble, plus drop shadow) as suggested.

Bug: 991785, 993506
Binary-Size: Increase needed for binary resources.
Change-Id: I36da352899428291ffbbfd8797b3abec581ea9f4
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1771638
Commit-Queue: Jinsuk Kim <jinsukkim@chromium.org>
Reviewed-by: default avatarTheresa  <twellington@chromium.org>
Cr-Commit-Position: refs/heads/master@{#691051}
parent 335304f3
<?xml version="1.0" encoding="utf-8"?>
<!-- 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. -->
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/navigation_bubble_shadow">
<!-- Drop Shadow -->
<item>
<shape android:shape="rectangle">
<padding
android:bottom="@dimen/navigation_bubble_shadow_padding"
android:left="@dimen/navigation_bubble_shadow_padding"
android:right="@dimen/navigation_bubble_shadow_padding"
android:top="@dimen/navigation_bubble_shadow_padding" />
<corners android:radius="@dimen/navigation_bubble_radius" />
<solid android:color="#00CCCCCC" />
</shape>
</item>
<item>
<shape android:shape="rectangle">
<padding
android:bottom="@dimen/navigation_bubble_shadow_padding"
android:left="@dimen/navigation_bubble_shadow_padding"
android:right="@dimen/navigation_bubble_shadow_padding"
android:top="@dimen/navigation_bubble_shadow_padding" />
<corners android:radius="@dimen/navigation_bubble_radius" />
<solid android:color="#10CCCCCC" />
</shape>
</item>
<item>
<shape android:shape="rectangle">
<padding
android:bottom="@dimen/navigation_bubble_shadow_padding"
android:left="@dimen/navigation_bubble_shadow_padding"
android:right="@dimen/navigation_bubble_shadow_padding"
android:top="@dimen/navigation_bubble_shadow_padding" />
<corners android:radius="@dimen/navigation_bubble_radius" />
<solid android:color="#20CCCCCC" />
</shape>
</item>
<item>
<shape android:shape="rectangle">
<padding
android:bottom="@dimen/navigation_bubble_shadow_padding"
android:left="@dimen/navigation_bubble_shadow_padding"
android:right="@dimen/navigation_bubble_shadow_padding"
android:top="@dimen/navigation_bubble_shadow_padding" />
<corners android:radius="@dimen/navigation_bubble_radius" />
<solid android:color="#30CCCCCC" />
</shape>
</item>
<item>
<shape android:shape="rectangle">
<padding
android:bottom="@dimen/navigation_bubble_shadow_padding"
android:left="@dimen/navigation_bubble_shadow_padding"
android:right="@dimen/navigation_bubble_shadow_padding"
android:top="@dimen/navigation_bubble_shadow_padding" />
<corners android:radius="@dimen/navigation_bubble_radius" />
<solid android:color="#50CCCCCC" />
</shape>
</item>
<!-- Background Color (white) -->
<item>
<shape android:shape="rectangle">
<corners android:radius="@dimen/navigation_bubble_radius" />
<solid android:color="@color/navigation_bubble_background_color" />
</shape>
</item>
</layer-list>
......@@ -172,9 +172,6 @@
<color name="payments_section_edit_background">@color/modern_secondary_color</color>
<color name="payments_section_chevron">#B2B2B2</color>
<!-- History Navigation UI colors -->
<color name="navigation_bubble_background_color">@color/default_bg_color_elev_4</color>
<!-- Scrollbar colors -->
<color name="default_scroll_thumb">@color/modern_grey_800_alpha_38</color>
......
......@@ -648,10 +648,8 @@
<dimen name="radio_button_with_description_vertical_padding">10dp</dimen>
<!-- History Navigation UI Item -->
<dimen name="navigation_bubble_size">40dp</dimen>
<dimen name="navigation_bubble_radius">20dp</dimen>
<dimen name="navigation_bubble_shadow_padding">1dp</dimen>
<dimen name="navigation_bubble_arrow_size">28dp</dimen>
<dimen name="navigation_bubble_size">44dp</dimen>
<dimen name="navigation_bubble_arrow_size">32dp</dimen>
<dimen name="navigation_bubble_start_padding">2dp</dimen>
<dimen name="navigation_bubble_top_padding">4dp</dimen>
<dimen name="navigation_bubble_bottom_padding">4dp</dimen>
......
......@@ -32,9 +32,6 @@
<color name="photo_picker_tile_bg_color">@color/modern_grey_800</color>
<color name="photo_picker_special_tile_bg_color">@color/modern_grey_800</color>
<!-- History Navigation UI colors -->
<color name="navigation_bubble_background_color">@android:color/white</color>
<!-- Scrollbar colors -->
<color name="default_scroll_thumb">@color/white_alpha_20</color>
......
......@@ -42,8 +42,6 @@ public class SideSlideLayout extends ViewGroup {
*/
public interface OnResetListener { void onReset(); }
private static final int CIRCLE_DIAMETER_DP = 40;
// Swipe offset in dips from the border of the view before applying physical tension
// effect. The actual arrow bubble position is capped at a value three times as this
// one, which is where navigation gets triggered.
......@@ -147,8 +145,7 @@ public class SideSlideLayout extends ViewGroup {
mDecelerateInterpolator = new DecelerateInterpolator(DECELERATE_INTERPOLATION_FACTOR);
mLinearInterpolator = new LinearInterpolator();
final float density = getResources().getDisplayMetrics().density;
mCircleWidth = (int) (CIRCLE_DIAMETER_DP * density);
mCircleWidth = (int) getResources().getDimensionPixelSize(R.dimen.navigation_bubble_size);
LayoutInflater layoutInflater = LayoutInflater.from(getContext());
mArrowView = (NavigationBubble) layoutInflater.inflate(R.layout.navigation_bubble, null);
......@@ -159,7 +156,7 @@ public class SideSlideLayout extends ViewGroup {
addView(mArrowView);
// The absolute offset has to take into account that the circle starts at an offset
mTotalDragDistance = RAW_SWIPE_LIMIT_DP * density;
mTotalDragDistance = RAW_SWIPE_LIMIT_DP * getResources().getDisplayMetrics().density;
}
/**
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment