From ca55d46b98d3c17abdf4951fe8c42e3f927e9c92 Mon Sep 17 00:00:00 2001 From: petemill Date: Fri, 7 Sep 2018 11:34:01 -0700 Subject: [PATCH 1/3] Remove bottom border radius from Tabs Fix https://github.com/brave/brave-browser/issues/962 Brave design spec shows no bottom border radius on tabs. This patching method, although not great, is simple compared to the amount of code which would need to be copied over and only slightly modified. --- .../chrome-browser-ui-views-tabs-tab.cc.patch | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 patches/chrome-browser-ui-views-tabs-tab.cc.patch diff --git a/patches/chrome-browser-ui-views-tabs-tab.cc.patch b/patches/chrome-browser-ui-views-tabs-tab.cc.patch new file mode 100644 index 000000000000..4a0027c146d0 --- /dev/null +++ b/patches/chrome-browser-ui-views-tabs-tab.cc.patch @@ -0,0 +1,24 @@ +diff --git a/chrome/browser/ui/views/tabs/tab.cc b/chrome/browser/ui/views/tabs/tab.cc +index ed257b73ca005b0f90d64927c3edc7862efb00f6..b1714709756a1e7e15b1a053bf2335ec017b8ae8 100644 +--- a/chrome/browser/ui/views/tabs/tab.cc ++++ b/chrome/browser/ui/views/tabs/tab.cc +@@ -230,7 +230,7 @@ gfx::Path GetRefreshInteriorPath(float scale, + bottom_offset *= scale; + + const float radius = GetTopCornerRadiusForWidth(bounds.width()) * scale; +- const float bottom_radius = radius - bottom_offset; ++ const float bottom_radius = 0; // was: radius - bottom_offset; + const float top_radius = std::max(radius - stroke_thickness, 0.f); + + // Compute |extension| as the width outside the separators. This is a fixed +@@ -362,8 +362,8 @@ gfx::Path GetRefreshBorderPath(const gfx::Rect& bounds, + bottom_offset *= scale; + + const float top_radius = GetTopCornerRadiusForWidth(bounds.width()) * scale; +- const float bottom_radius = +- std::max(top_radius - stroke_thickness, 0.f) - bottom_offset; ++ const float bottom_radius = 0; ++ // was: std::max(top_radius - stroke_thickness, 0.f) - bottom_offset; + + // See comments in GetRefreshInteriorPath(). + const float extension = Tab::GetCornerRadius() * scale; From 7738addea3486a2cee259f5f46971999861e2c35 Mon Sep 17 00:00:00 2001 From: petemill Date: Mon, 10 Sep 2018 11:29:47 -0700 Subject: [PATCH 2/3] Remove patch for obsolete TabStrip UI code --- patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch | 8 -------- 1 file changed, 8 deletions(-) diff --git a/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch b/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch index 4fabb4212d48..fda3ffa14b3b 100644 --- a/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch +++ b/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch @@ -2,12 +2,4 @@ diff --git a/chrome/browser/ui/views/tabs/tab_strip.cc b/chrome/browser/ui/views index 1f7870f9ec645bd5eb15fc7b0e688bc9e60cb6eb..cbe8b005d8e11fbb00a2515127fcad34a128a3ab 100644 --- a/chrome/browser/ui/views/tabs/tab_strip.cc +++ b/chrome/browser/ui/views/tabs/tab_strip.cc -@@ -1632,7 +1632,7 @@ int TabStrip::TabToFollowingNewTabButtonSpacing() const { - // Pre-refresh, there are a variety of hardcoded values. - const int mode = MD::GetMode(); - DCHECK_LE(mode, 2); -- constexpr int kNewTabButtonSpacing[] = {-5, -6, 6}; -+ constexpr int kNewTabButtonSpacing[] = {6, 7, 7}; - return kNewTabButtonSpacing[mode]; - } From de337bc6ea3dba057f3b57e9c7bc754b135a557a Mon Sep 17 00:00:00 2001 From: petemill Date: Mon, 10 Sep 2018 11:36:51 -0700 Subject: [PATCH 3/3] Brave tab separator UI Address https://github.com/brave/brave-browser/issues/962 --- browser/ui/BUILD.gn | 2 + browser/ui/views/tabs/brave_tab.cc | 57 +++++++++++++++++++ browser/ui/views/tabs/brave_tab.h | 29 ++++++++++ .../chrome/browser/ui/views/tabs/tab_strip.cc | 3 + .../chrome-browser-ui-views-tabs-tab.cc.patch | 30 +++++++++- .../chrome-browser-ui-views-tabs-tab.h.patch | 30 ++++++++++ ...e-browser-ui-views-tabs-tab_strip.cc.patch | 10 +++- 7 files changed, 158 insertions(+), 3 deletions(-) create mode 100644 browser/ui/views/tabs/brave_tab.cc create mode 100644 browser/ui/views/tabs/brave_tab.h create mode 100644 patches/chrome-browser-ui-views-tabs-tab.h.patch diff --git a/browser/ui/BUILD.gn b/browser/ui/BUILD.gn index 3f883756a0aa..38a6e2b0b7b8 100644 --- a/browser/ui/BUILD.gn +++ b/browser/ui/BUILD.gn @@ -44,6 +44,8 @@ source_set("ui") { "views/location_bar/brave_location_bar_view.h", "views/tabs/brave_new_tab_button.cc", "views/tabs/brave_new_tab_button.h", + "views/tabs/brave_tab.cc", + "views/tabs/brave_tab.h", "views/toolbar/bookmark_button.cc", "views/toolbar/bookmark_button.h", "views/toolbar/brave_toolbar_view.cc", diff --git a/browser/ui/views/tabs/brave_tab.cc b/browser/ui/views/tabs/brave_tab.cc new file mode 100644 index 000000000000..c4c2407069e9 --- /dev/null +++ b/browser/ui/views/tabs/brave_tab.cc @@ -0,0 +1,57 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +#include "brave/browser/ui/views/tabs/brave_tab.h" + +#include "chrome/browser/ui/views/tabs/tab_controller.h" +#include "ui/gfx/canvas.h" +#include "ui/gfx/scoped_canvas.h" + +using namespace chrome_browser_ui_views_tabs_tab_cc; + +// Same as Chomium Tab implementation except separators are +// achored to bottom (instead of floating in middle) and rounded ends +void BraveTab::PaintSeparators(gfx::Canvas* canvas) { + const auto separator_opacities = GetSeparatorOpacities(false); + if (!separator_opacities.left && !separator_opacities.right) + return; + + gfx::ScopedCanvas scoped_canvas(canvas); + const float scale = canvas->UndoDeviceScaleFactor(); + + const gfx::RectF aligned_bounds = + ScaleAndAlignBounds(bounds(), scale, GetStrokeThickness()); + const int corner_radius = GetCornerRadius(); + const float separator_height = GetTabSeparatorHeight() * scale; + gfx::RectF leading_separator_bounds( + aligned_bounds.x() + corner_radius * scale, + aligned_bounds.y() + aligned_bounds.height() - separator_height, + kSeparatorThickness * scale, separator_height); + gfx::RectF trailing_separator_bounds = leading_separator_bounds; + trailing_separator_bounds.set_x( + aligned_bounds.right() - (corner_radius + kSeparatorThickness) * scale); + + gfx::PointF origin(bounds().origin()); + origin.Scale(scale); + leading_separator_bounds.Offset(-origin.x(), -origin.y()); + trailing_separator_bounds.Offset(-origin.x(), -origin.y()); + + const SkColor separator_base_color = controller_->GetTabSeparatorColor(); + const auto separator_color = [separator_base_color](float opacity) { + return SkColorSetA(separator_base_color, + gfx::Tween::IntValueBetween(opacity, SK_AlphaTRANSPARENT, + SK_AlphaOPAQUE)); + }; + const int separator_radius = kSeparatorThickness / 2; + const SkScalar scaled_separator_radius = SkIntToScalar( + separator_radius * scale); + cc::PaintFlags flags; + flags.setAntiAlias(true); + flags.setColor(separator_color(separator_opacities.left)); + canvas->DrawRoundRect( + leading_separator_bounds, scaled_separator_radius, flags); + flags.setColor(separator_color(separator_opacities.right)); + canvas->DrawRoundRect( + trailing_separator_bounds, scaled_separator_radius, flags); +} diff --git a/browser/ui/views/tabs/brave_tab.h b/browser/ui/views/tabs/brave_tab.h new file mode 100644 index 000000000000..44ad4e0e5acd --- /dev/null +++ b/browser/ui/views/tabs/brave_tab.h @@ -0,0 +1,29 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public ++ * License, v. 2.0. If a copy of the MPL was not distributed with this file, ++ * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +#ifndef BRAVE_BROWSER_UI_VIEWS_TABS_BRAVE_TAB_H_ +#define BRAVE_BROWSER_UI_VIEWS_TABS_BRAVE_TAB_H_ + +#include "chrome/browser/ui/views/tabs/tab.h" +#include "ui/gfx/geometry/rect.h" + +namespace chrome_browser_ui_views_tabs_tab_cc { + +const gfx::RectF ScaleAndAlignBounds(const gfx::Rect& bounds, + float scale, + float stroke_thickness); + +} + +class BraveTab : public Tab { + public: + using Tab::Tab; + private: + // Paints the separator lines on the left and right edge of the tab if in + // material refresh mode. + void PaintSeparators(gfx::Canvas* canvas) override; + DISALLOW_COPY_AND_ASSIGN(BraveTab); +}; + +#endif diff --git a/chromium_src/chrome/browser/ui/views/tabs/tab_strip.cc b/chromium_src/chrome/browser/ui/views/tabs/tab_strip.cc index 08451df9a2d5..a427b6a81fc2 100644 --- a/chromium_src/chrome/browser/ui/views/tabs/tab_strip.cc +++ b/chromium_src/chrome/browser/ui/views/tabs/tab_strip.cc @@ -1,4 +1,7 @@ #include "brave/browser/ui/views/tabs/brave_new_tab_button.h" +// include brave_tab header so that patch inside tab_strip works +#include "brave/browser/ui/views/tabs/brave_tab.h" + #define NewTabButton BraveNewTabButton #include "../../../../../../chrome/browser/ui/views/tabs/tab_strip.cc" #undef NewTabButton diff --git a/patches/chrome-browser-ui-views-tabs-tab.cc.patch b/patches/chrome-browser-ui-views-tabs-tab.cc.patch index 4a0027c146d0..bc3c705f3660 100644 --- a/patches/chrome-browser-ui-views-tabs-tab.cc.patch +++ b/patches/chrome-browser-ui-views-tabs-tab.cc.patch @@ -1,7 +1,25 @@ diff --git a/chrome/browser/ui/views/tabs/tab.cc b/chrome/browser/ui/views/tabs/tab.cc -index ed257b73ca005b0f90d64927c3edc7862efb00f6..b1714709756a1e7e15b1a053bf2335ec017b8ae8 100644 +index 0dcdb4bebb1286e493d0b85eac586954353e10d1..5fe6861d927b1eb38336b073e8c8c50f8094c620 100644 --- a/chrome/browser/ui/views/tabs/tab.cc +++ b/chrome/browser/ui/views/tabs/tab.cc +@@ -76,7 +76,7 @@ + using base::UserMetricsAction; + using MD = ui::MaterialDesignController; + +-namespace { ++namespace chrome_browser_ui_views_tabs_tab_cc { + + constexpr int kExtraLeftPaddingToBalanceCloseButtonPadding = 2; + constexpr int kRefreshExtraLeftPaddingToBalanceCloseButtonPadding = 4; +@@ -99,7 +99,7 @@ constexpr float kSelectedTabThrobScale = 0.95f - kSelectedTabOpacity; + + // Height of the separator painted on the left edge of the tab for the material + // refresh mode. +-constexpr int kTabSeparatorHeight = 20; ++constexpr int kTabSeparatorHeight = 24; + constexpr int kTabSeparatorTouchHeight = 24; + + // Helper functions ------------------------------------------------------------ @@ -230,7 +230,7 @@ gfx::Path GetRefreshInteriorPath(float scale, bottom_offset *= scale; @@ -11,7 +29,7 @@ index ed257b73ca005b0f90d64927c3edc7862efb00f6..b1714709756a1e7e15b1a053bf2335ec const float top_radius = std::max(radius - stroke_thickness, 0.f); // Compute |extension| as the width outside the separators. This is a fixed -@@ -362,8 +362,8 @@ gfx::Path GetRefreshBorderPath(const gfx::Rect& bounds, +@@ -366,8 +366,8 @@ gfx::Path GetRefreshBorderPath(const gfx::Rect& bounds, bottom_offset *= scale; const float top_radius = GetTopCornerRadiusForWidth(bounds.width()) * scale; @@ -22,3 +40,11 @@ index ed257b73ca005b0f90d64927c3edc7862efb00f6..b1714709756a1e7e15b1a053bf2335ec // See comments in GetRefreshInteriorPath(). const float extension = Tab::GetCornerRadius() * scale; +@@ -491,6 +491,7 @@ gfx::Path GetBorderPath(float scale, + } + + } // namespace ++using namespace chrome_browser_ui_views_tabs_tab_cc; + + // Tab ------------------------------------------------------------------------- + diff --git a/patches/chrome-browser-ui-views-tabs-tab.h.patch b/patches/chrome-browser-ui-views-tabs-tab.h.patch new file mode 100644 index 000000000000..ce2fe55b6c1a --- /dev/null +++ b/patches/chrome-browser-ui-views-tabs-tab.h.patch @@ -0,0 +1,30 @@ +diff --git a/chrome/browser/ui/views/tabs/tab.h b/chrome/browser/ui/views/tabs/tab.h +index 5be5d08990a6133511b9cb16ee660ce17cc907e8..6b55d3e9f733c2fe99ff6cf460def4d12f87b60d 100644 +--- a/chrome/browser/ui/views/tabs/tab.h ++++ b/chrome/browser/ui/views/tabs/tab.h +@@ -56,7 +56,7 @@ class Tab : public gfx::AnimationDelegate, + + // Under refresh, thickness in DIPs of the separator painted on the left and + // right edges of the tab. +- static constexpr int kSeparatorThickness = 1; ++ static constexpr int kSeparatorThickness = 2; + + // When the content's width of the tab shrinks to below this size we should + // hide the close button on inactive tabs. Any smaller and they're too easy +@@ -235,6 +235,7 @@ class Tab : public gfx::AnimationDelegate, + friend class AlertIndicatorButtonTest; + friend class TabTest; + friend class TabStripTest; ++ friend class BraveTab; + FRIEND_TEST_ALL_PREFIXES(TabStripTest, TabCloseButtonVisibilityWhenStacked); + FRIEND_TEST_ALL_PREFIXES(TabStripTest, + TabCloseButtonVisibilityWhenNotStacked); +@@ -284,7 +285,7 @@ class Tab : public gfx::AnimationDelegate, + + // Paints the separator lines on the left and right edge of the tab if in + // material refresh mode. +- void PaintSeparators(gfx::Canvas* canvas); ++ virtual void PaintSeparators(gfx::Canvas* canvas); + + // Computes which icons are visible in the tab. Should be called everytime + // before layout is performed. diff --git a/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch b/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch index fda3ffa14b3b..318df62497cf 100644 --- a/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch +++ b/patches/chrome-browser-ui-views-tabs-tab_strip.cc.patch @@ -1,5 +1,13 @@ diff --git a/chrome/browser/ui/views/tabs/tab_strip.cc b/chrome/browser/ui/views/tabs/tab_strip.cc -index 1f7870f9ec645bd5eb15fc7b0e688bc9e60cb6eb..cbe8b005d8e11fbb00a2515127fcad34a128a3ab 100644 +index 1f7870f9ec645bd5eb15fc7b0e688bc9e60cb6eb..591ebbef63d609b18d997fc8d8bd95f9aaf074be 100644 --- a/chrome/browser/ui/views/tabs/tab_strip.cc +++ b/chrome/browser/ui/views/tabs/tab_strip.cc +@@ -446,7 +446,7 @@ void TabStrip::StopAllHighlighting() { + void TabStrip::AddTabAt(int model_index, TabRendererData data, bool is_active) { + const bool was_single_tab_mode = SingleTabMode(); +- Tab* tab = new Tab(this, animation_container_.get()); ++ Tab* tab = new BraveTab(this, animation_container_.get()); + AddChildView(tab); + const bool pinned = data.pinned; + tab->SetData(std::move(data));