Skip to content

GitLab

T
tangled
Commit bb804c69 authored by Mei Liang's avatar Mei Liang Committed by Commit Bot
Browse files
Options

[svelte] Polish the new tab switcher part 1 

This CL does the following:
  * Updates tab to use the standard list item, modern_list_item_view
  * Adds a grey circular background for favicon

Change-Id: Ia7222a434c4d0bf585e59bdeebd6ed2184c5a567
Bug: 1042890
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2107795
Commit-Queue: Mei Liang <meiliang@chromium.org>
Reviewed-by: default avatarWei-Yin Chen (陳威尹) <wychen@chromium.org>
Cr-Commit-Position: refs/heads/master@{#755265}
parent 0a9a9652
Hide whitespace changes
Inline Side-by-side
Showing with 82 additions and 74 deletions
chrome/android/features/tab_ui/java/res/layout/selectable_tab_list_card_item.xml
View file @ bb804c69
......@@ -2,13 +2,23 @@
<!-- Copyright 2020 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. -->
<!-- TODO(crbug.com/1023557): Rename SelectableTabGridView to SelectableTabView. -->
<org.chromium.chrome.browser.tasks.tab_management.SelectableTabGridView
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/selectable_tab_list_card_item"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="@layout/tab_list_card_item"/>
<org.chromium.ui.widget.ChromeImageView
android:id="@+id/selected_view_below_lollipop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/selected_tab_background"
android:visibility="gone"/>
</org.chromium.chrome.browser.tasks.tab_management.SelectableTabGridView>
\ No newline at end of file
<!-- TODO(crbug.com/1023557): Rename SelectableTabGridView to SelectableTabView. -->
<org.chromium.chrome.browser.tasks.tab_management.SelectableTabGridView
android:id="@+id/content_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/popup_bg_tinted" />
</FrameLayout>
\ No newline at end of file
chrome/android/features/tab_ui/java/res/layout/tab_list_card_item.xml
View file @ bb804c69
......@@ -16,43 +16,9 @@
android:layout_height="match_parent"
android:orientation="horizontal"
android:background="@drawable/popup_bg_tinted">
<org.chromium.ui.widget.ChromeImageView
android:id="@+id/icon_view"
style="@style/ListItemStartIcon"
android:layout_marginEnd="0dp" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical"
android:layout_gravity="center_vertical"
android:paddingTop="16dp"
android:paddingBottom="16dp">
<include layout="@layout/modern_list_item_view" />
<TextView
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:maxLines="1"
android:ellipsize="end"
android:textAppearance="@style/TextAppearance.TextMediumThick.Primary" />
<TextView
android:id="@+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:maxLines="1"
android:ellipsize="end"
android:textAppearance="@style/TextAppearance.TextMedium.Secondary" />
</LinearLayout>
<org.chromium.ui.widget.ChromeImageView
android:id="@+id/action_button"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_gravity="center_vertical|end"
android:scaleType="center"
android:tint="@color/default_icon_color" />
</LinearLayout>
</merge>
chrome/android/features/tab_ui/java/res/values/dimens.xml
View file @ bb804c69
......@@ -30,6 +30,8 @@
<dimen name="tab_group_toolbar_topic_margin">8dp</dimen>
<dimen name="swipe_to_dismiss_threshold">144dp</dimen>
<dimen name="selection_tab_grid_toggle_button_inset">14dp</dimen>
<dimen name="selection_tab_list_toggle_button_lateral_inset">18dp</dimen>
<dimen name="selection_tab_list_toggle_button_vertical_inset">22dp</dimen>
<dimen name="tab_carousel_height">192dp</dimen>
<dimen name="tab_carousel_card_width">168dp</dimen>
<dimen name="tab_carousel_start_margin">-3dp</dimen>
......
chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/SelectableTabGridView.java
View file @ bb804c69
......@@ -8,6 +8,7 @@ import android.content.Context;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.InsetDrawable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ImageView;
import androidx.core.content.res.ResourcesCompat;
......@@ -31,21 +32,41 @@ public class SelectableTabGridView extends SelectableItemView<Integer> {
Drawable selectionListIcon = ResourcesCompat.getDrawable(
getResources(), R.drawable.tab_grid_selection_list_icon, getContext().getTheme());
InsetDrawable drawable = new InsetDrawable(selectionListIcon,
(int) getResources().getDimension(R.dimen.selection_tab_grid_toggle_button_inset));
ImageView actionButton = (ImageView) fastFindViewById(R.id.action_button);
actionButton.setBackground(drawable);
if (actionButton != null) {
InsetDrawable drawable = new InsetDrawable(selectionListIcon,
(int) getResources().getDimension(
R.dimen.selection_tab_grid_toggle_button_inset));
actionButton.setBackground(drawable);
// Remove the original content from SelectableItemView since we are not using them.
removeView(mContentView);
} else {
actionButton = mEndButtonView;
actionButton.setVisibility(View.VISIBLE);
InsetDrawable drawable = new InsetDrawable(selectionListIcon,
(int) getResources().getDimension(
R.dimen.selection_tab_list_toggle_button_lateral_inset),
(int) getResources().getDimension(
R.dimen.selection_tab_list_toggle_button_vertical_inset),
(int) getResources().getDimension(
R.dimen.selection_tab_list_toggle_button_lateral_inset),
(int) getResources().getDimension(
R.dimen.selection_tab_list_toggle_button_vertical_inset));
actionButton.setBackground(drawable);
mStartIconView.setBackground(null);
}
actionButton.getBackground().setLevel(
getResources().getInteger(R.integer.list_item_level_default));
actionButton.setImageDrawable(AnimatedVectorDrawableCompat.create(
getContext(), R.drawable.ic_check_googblue_20dp_animated));
// Remove the original content from SelectableItemView since we are not using them.
removeView(mContentView);
}
@Override
protected void onClick() {
super.onClick(this);
}
@Override
protected void updateView(boolean animate) {}
}
chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabListCoordinator.java
View file @ bb804c69
......@@ -169,11 +169,13 @@ public class TabListCoordinator implements Destroyable {
}, TabStripViewBinder::bind);
} else if (mMode == TabListMode.LIST) {
mAdapter.registerType(UiType.CLOSABLE, parent -> {
ViewGroup group = (ViewGroup) LayoutInflater.from(context).inflate(
R.layout.closable_tab_list_card_item, parentView, false);
ViewLookupCachingFrameLayout group =
(ViewLookupCachingFrameLayout) LayoutInflater.from(context).inflate(
R.layout.closable_tab_list_card_item, parentView, false);
group.setClickable(true);
ImageView actionButton = (ImageView) group.findViewById(R.id.action_button);
ImageView actionButton = (ImageView) group.fastFindViewById(R.id.end_button);
actionButton.setVisibility(View.VISIBLE);
Resources resources = group.getResources();
int closeButtonSize =
(int) resources.getDimension(R.dimen.tab_grid_close_button_size);
......@@ -188,6 +190,7 @@ public class TabListCoordinator implements Destroyable {
ViewGroup group = (ViewGroup) LayoutInflater.from(context).inflate(
R.layout.selectable_tab_list_card_item, parentView, false);
group.setClickable(true);
return group;
}, TabListViewBinder::bindSelectableListTab);
} else {
......
chrome/android/features/tab_ui/java/src/org/chromium/chrome/browser/tasks/tab_management/TabListViewBinder.java
View file @ bb804c69
......@@ -37,14 +37,11 @@ class TabListViewBinder {
((TextView) fastView.findViewById(R.id.title)).setText(title);
} else if (TabProperties.FAVICON == propertyKey) {
Drawable favicon = model.get(TabProperties.FAVICON);
ImageView faviconView = (ImageView) fastView.findViewById(R.id.icon_view);
ImageView faviconView = (ImageView) fastView.findViewById(R.id.start_icon);
faviconView.setBackgroundResource(R.drawable.list_item_icon_modern_bg);
faviconView.setImageDrawable(favicon);
int padding = favicon == null
? 0
: (int) view.getResources().getDimension(R.dimen.tab_list_card_padding);
faviconView.setPadding(padding, padding, padding, padding);
} else if (TabProperties.TAB_CLOSED_LISTENER == propertyKey) {
fastView.findViewById(R.id.action_button).setOnClickListener(v -> {
fastView.findViewById(R.id.end_button).setOnClickListener(v -> {
int tabId = model.get(TabProperties.TAB_ID);
model.get(TabProperties.TAB_CLOSED_LISTENER).run(tabId);
});
......@@ -94,25 +91,31 @@ class TabListViewBinder {
final int defaultLevel = view.getResources().getInteger(R.integer.list_item_level_default);
final int selectedLevel =
view.getResources().getInteger(R.integer.list_item_level_selected);
SelectableTabGridView selectableTabListView = view.findViewById(R.id.content_view);
if (TabProperties.SELECTABLE_TAB_CLICKED_LISTENER == propertyKey) {
view.setOnClickListener(v -> {
View.OnClickListener onClickListener = v -> {
model.get(TabProperties.SELECTABLE_TAB_CLICKED_LISTENER).run(tabId);
((SelectableTabGridView) view).onClick();
});
view.setOnLongClickListener(v -> {
selectableTabListView.onClick();
};
View.OnLongClickListener onLongClickListener = v -> {
model.get(TabProperties.SELECTABLE_TAB_CLICKED_LISTENER).run(tabId);
return ((SelectableTabGridView) view).onLongClick(view);
});
return selectableTabListView.onLongClick(selectableTabListView);
};
selectableTabListView.setOnClickListener(onClickListener);
selectableTabListView.setOnLongClickListener(onLongClickListener);
ImageView endButton = selectableTabListView.findViewById(R.id.end_button);
endButton.setOnClickListener(onClickListener);
endButton.setOnLongClickListener(onLongClickListener);
} else if (TabProperties.TAB_SELECTION_DELEGATE == propertyKey) {
assert model.get(TabProperties.TAB_SELECTION_DELEGATE) != null;
((SelectableTabGridView) view)
.setSelectionDelegate(model.get(TabProperties.TAB_SELECTION_DELEGATE));
((SelectableTabGridView) view).setItem(tabId);
selectableTabListView.setSelectionDelegate(
model.get(TabProperties.TAB_SELECTION_DELEGATE));
selectableTabListView.setItem(tabId);
} else if (TabProperties.IS_SELECTED == propertyKey) {
boolean isSelected = model.get(TabProperties.IS_SELECTED);
ImageView actionButton = (ImageView) view.findViewById(R.id.action_button);
ImageView actionButton = (ImageView) view.findViewById(R.id.end_button);
actionButton.getBackground().setLevel(isSelected ? selectedLevel : defaultLevel);
DrawableCompat.setTintList(actionButton.getBackground().mutate(),
isSelected ? model.get(
......
chrome/android/features/tab_ui/javatests/src/org/chromium/chrome/browser/tasks/tab_management/TabListViewHolderTest.java
View file @ bb804c69
......@@ -234,14 +234,14 @@ public class TabListViewHolderTest extends DummyUiActivityTestCase {
testGridSelected(mSelectableTabListView, mSelectableModel);
mSelectableModel.set(TabProperties.IS_SELECTED, true);
ImageView actionButtonList = mSelectableTabListView.findViewById(R.id.action_button);
Assert.assertEquals(1, actionButtonList.getBackground().getLevel());
Assert.assertNotNull(actionButtonList.getDrawable());
ImageView endButton = mSelectableTabListView.findViewById(R.id.end_button);
Assert.assertEquals(1, endButton.getBackground().getLevel());
Assert.assertNotNull(endButton.getDrawable());
Assert.assertEquals(255, actionButton.getDrawable().getAlpha());
mSelectableModel.set(TabProperties.IS_SELECTED, false);
Assert.assertEquals(0, actionButtonList.getBackground().getLevel());
Assert.assertEquals(0, actionButtonList.getDrawable().getAlpha());
Assert.assertEquals(0, endButton.getBackground().getLevel());
Assert.assertEquals(0, endButton.getDrawable().getAlpha());
}
@Test
......@@ -450,8 +450,11 @@ public class TabListViewHolderTest extends DummyUiActivityTestCase {
testSelectableTabClickToSelect(mSelectableTabGridView, mSelectableModel, false);
testSelectableTabClickToSelect(mSelectableTabGridView, mSelectableModel, true);
testSelectableTabClickToSelect(mSelectableTabListView, mSelectableModel, false);
testSelectableTabClickToSelect(mSelectableTabListView, mSelectableModel, true);
// For the List version, we need to trigger the click from the view that has id
// content_view, because of the xml hierarchy.
ViewGroup selectableTabListContent = mSelectableTabListView.findViewById(R.id.content_view);
testSelectableTabClickToSelect(selectableTabListContent, mSelectableModel, false);
testSelectableTabClickToSelect(selectableTabListContent, mSelectableModel, true);
}
@Test
......
chrome/test/data/android/render_tests/TabSelectionEditorTest.list_view.Nexus_5X-23.png.sha1
View file @ bb804c69
a2e26fec861b69f81465ca88b210412fd2d00e3d
\ No newline at end of file
38f569cf5796ddd4cbd4cb17920b05faaaeca4bd
\ No newline at end of file
chrome/test/data/android/render_tests/TabSelectionEditorTest.list_view_one_selected_tab.Nexus_5X-23.png.sha1
View file @ bb804c69
6bad444cdf13cbd1bf73c717092350c410fd885d
\ No newline at end of file
d2a3d54324a4998c56d8b9d6e8025dd69027a22b
\ No newline at end of file
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