[Payment] Update opened payment handler window header.

This CL:
1, Added a static separator between header and web contents
2, Removed site settings' icon

Bug: 840803
Change-Id: I0a2cfdf1f5d6d128054faec5edde0ba3d390f28e
Reviewed-on: https://chromium-review.googlesource.com/1057409Reviewed-by: anthonyvd <anthonyvd@chromium.org>
Commit-Queue: Ganggui Tang <gogerald@chromium.org>
Cr-Commit-Position: refs/heads/master@{#558896}

chrome/browser/ui/views/payments/payment_handler_web_flow_view_controller.cc

@@ -11,7 +11,6 @@
 #include "chrome/app/vector_icons/vector_icons.h"
 #include "chrome/browser/payments/ssl_validity_checker.h"
 #include "chrome/browser/profiles/profile.h"
-#include "chrome/browser/ui/chrome_pages.h"
 #include "chrome/browser/ui/views/payments/payment_request_dialog_view.h"
 #include "chrome/browser/ui/views/payments/payment_request_views_util.h"
 #include "chrome/grit/generated_resources.h"
@@ -21,14 +20,9 @@
 #include "content/public/browser/render_process_host.h"
 #include "content/public/browser/web_contents.h"
 #include "ui/base/l10n/l10n_util.h"
-#include "ui/gfx/color_utils.h"
 #include "ui/gfx/image/image_skia.h"
-#include "ui/gfx/paint_vector_icon.h"
 #include "ui/views/background.h"
 #include "ui/views/border.h"
-#include "ui/views/controls/button/button.h"
-#include "ui/views/controls/button/image_button.h"
-#include "ui/views/controls/button/image_button_factory.h"
 #include "ui/views/controls/image_view.h"
 #include "ui/views/controls/label.h"
 #include "ui/views/controls/progress_bar.h"
@@ -38,15 +32,6 @@
 
 namespace payments {
 
-constexpr int kFirstTagValue = static_cast<int>(
-    payments::PaymentRequestCommonTags::PAYMENT_REQUEST_COMMON_TAG_MAX);
-
-// Tags for the buttons in the payment sheet
-enum class PaymentHandlerWebFlowTags {
-  SITE_SETTINGS_TAG = kFirstTagValue,
-  MAX_TAG,  // Always keep last.
-};
-
 class ReadOnlyOriginView : public views::View {
  public:
   ReadOnlyOriginView(const base::string16& page_title,
@@ -119,10 +104,6 @@ class ReadOnlyOriginView : public views::View {
           kPaymentHandlerIconSize);
       top_level_columns->AddPaddingColumn(0, 8);
     }
-    constexpr int kSiteSettingsSize = 16;
-    top_level_columns->AddColumn(
-        views::GridLayout::TRAILING, views::GridLayout::FILL, 0,
-        views::GridLayout::FIXED, kSiteSettingsSize, kSiteSettingsSize);
 
     top_level_layout->StartRow(0, 0);
     top_level_layout->AddView(title_origin_container.release());
@@ -134,28 +115,6 @@ class ReadOnlyOriginView : public views::View {
           gfx::Size(kPaymentHandlerIconSize, kPaymentHandlerIconSize));
       top_level_layout->AddView(instrument_icon_view.release());
     }
-
-    views::ImageButton* site_settings_button =
-        views::CreateVectorImageButton(site_settings_listener);
-
-    // Inline the contents of views::SetImageFromVectorIcon to be able to
-    // properly set the icon size.
-    const SkColor icon_color = color_utils::DeriveDefaultIconColor(
-        GetForegroundColorForBackground(background_color));
-    site_settings_button->SetImage(
-        views::Button::STATE_NORMAL,
-        gfx::CreateVectorIcon(kSettingsIcon, kSiteSettingsSize, icon_color));
-    site_settings_button->set_ink_drop_base_color(icon_color);
-
-    site_settings_button->SetSize(
-        gfx::Size(kSiteSettingsSize, kSiteSettingsSize));
-    // This icon should be focusable in both regular and accessibility mode.
-    site_settings_button->SetFocusBehavior(views::View::FocusBehavior::ALWAYS);
-    site_settings_button->set_tag(
-        static_cast<int>(PaymentHandlerWebFlowTags::SITE_SETTINGS_TAG));
-    site_settings_button->SetAccessibleName(
-        l10n_util::GetStringUTF16(IDS_SETTINGS_SITE_SETTINGS));
-    top_level_layout->AddView(site_settings_button);
   }
   ~ReadOnlyOriginView() override {}
 
@@ -173,12 +132,16 @@ PaymentHandlerWebFlowViewController::PaymentHandlerWebFlowViewController(
     : PaymentRequestSheetController(spec, state, dialog),
       profile_(profile),
       target_(target),
-      progress_bar_is_shown_(false),
+      show_progress_bar_(false),
       progress_bar_(
           std::make_unique<views::ProgressBar>(/*preferred_height=*/2)),
+      separator_(std::make_unique<views::Separator>()),
       first_navigation_complete_callback_(
           std::move(first_navigation_complete_callback)) {
   progress_bar_->set_owned_by_client();
+  separator_->set_owned_by_client();
+  separator_->SetColor(separator_->GetNativeTheme()->GetSystemColor(
+      ui::NativeTheme::kColorId_SeparatorColor));
 }
 
 PaymentHandlerWebFlowViewController::~PaymentHandlerWebFlowViewController() {}
@@ -192,20 +155,7 @@ base::string16 PaymentHandlerWebFlowViewController::GetSheetTitle() {
 
 void PaymentHandlerWebFlowViewController::FillContentView(
     views::View* content_view) {
-  views::GridLayout* content_layout = content_view->SetLayoutManager(
-      std::make_unique<views::GridLayout>(content_view));
-  views::ColumnSet* columns = content_layout->AddColumnSet(0);
-  columns->AddColumn(views::GridLayout::FILL, views::GridLayout::FILL, 1,
-                     views::GridLayout::USE_PREF, 0, 0);
-
-  // Content header to display progress bar.
-  content_layout->StartRow(0, 0);
-  content_header_view_ = std::make_unique<views::View>();
-  content_header_view_->set_owned_by_client();
-  content_layout->AddView(content_header_view_.get());
-
-  // Content body to display the web page.
-  content_layout->StartRow(0, 0);
+  content_view->SetLayoutManager(std::make_unique<views::FillLayout>());
   std::unique_ptr<views::WebView> web_view =
       std::make_unique<views::WebView>(profile_);
   Observe(web_view->GetWebContents());
@@ -218,7 +168,7 @@ void PaymentHandlerWebFlowViewController::FillContentView(
   // total_dialog_height - header_height. On the other hand, the width will be
   // properly set so it can be 0 here.
   web_view->SetPreferredSize(gfx::Size(0, kDialogHeight - 75));
-  content_layout->AddView(web_view.release());
+  content_view->AddChildView(web_view.release());
 }
 
 bool PaymentHandlerWebFlowViewController::ShouldShowSecondaryButton() {
@@ -237,6 +187,13 @@ PaymentHandlerWebFlowViewController::CreateHeaderContentView() {
       background->get_color(), this);
 }
 
+views::View*
+PaymentHandlerWebFlowViewController::CreateHeaderContentSeparatorView() {
+  if (show_progress_bar_)
+    return progress_bar_.get();
+  return separator_.get();
+}
+
 std::unique_ptr<views::Background>
 PaymentHandlerWebFlowViewController::GetHeaderBackground() {
   if (!web_contents())
@@ -244,18 +201,14 @@ PaymentHandlerWebFlowViewController::GetHeaderBackground() {
   return views::CreateSolidBackground(web_contents()->GetThemeColor());
 }
 
-void PaymentHandlerWebFlowViewController::ButtonPressed(
-    views::Button* sender,
-    const ui::Event& event) {
-  if (sender->tag() ==
-      static_cast<int>(PaymentHandlerWebFlowTags::SITE_SETTINGS_TAG)) {
-    if (web_contents()) {
-      chrome::ShowSiteSettings(dialog()->GetProfile(),
-                               web_contents()->GetLastCommittedURL());
-    }
-  } else {
-    PaymentRequestSheetController::ButtonPressed(sender, event);
-  }
+bool PaymentHandlerWebFlowViewController::GetSheetId(DialogViewID* sheet_id) {
+  *sheet_id = DialogViewID::PAYMENT_APP_OPENED_WINDOW_SHEET;
+  return true;
+}
+
+bool PaymentHandlerWebFlowViewController::
+    DisplayDynamicBorderForHiddenContents() {
+  return false;
 }
 
 void PaymentHandlerWebFlowViewController::LoadProgressChanged(
@@ -265,23 +218,17 @@ void PaymentHandlerWebFlowViewController::LoadProgressChanged(
 
   progress_bar_->SetValue(progress);
 
-  if (progress == 1.0 && !progress_bar_is_shown_)
+  if (progress == 1.0 && show_progress_bar_) {
+    show_progress_bar_ = false;
+    UpdateHeaderContentSeparatorView();
     return;
+  }
 
-  if (progress < 1.0 && progress_bar_is_shown_)
+  if (progress < 1.0 && !show_progress_bar_) {
+    show_progress_bar_ = true;
+    UpdateHeaderContentSeparatorView();
     return;
-
-  content_header_view_->RemoveAllChildViews(/*delete_children=*/true);
-  if (progress_bar_is_shown_) {
-    progress_bar_is_shown_ = false;
-  } else {
-    content_header_view_->SetLayoutManager(
-        std::make_unique<views::FillLayout>());
-    content_header_view_->AddChildView(progress_bar_.get());
-    progress_bar_is_shown_ = true;
   }
-
-  RelayoutPane();
 }
 
 void PaymentHandlerWebFlowViewController::VisibleSecurityStateChanged(

chrome/browser/ui/views/payments/payment_handler_web_flow_view_controller.h

@@ -10,6 +10,7 @@
 #include "content/public/browser/web_contents_delegate.h"
 #include "content/public/browser/web_contents_observer.h"
 #include "ui/views/controls/progress_bar.h"
+#include "ui/views/controls/separator.h"
 #include "url/gurl.h"
 
 class Profile;
@@ -47,8 +48,10 @@ class PaymentHandlerWebFlowViewController
   void FillContentView(views::View* content_view) override;
   bool ShouldShowSecondaryButton() override;
   std::unique_ptr<views::View> CreateHeaderContentView() override;
+  views::View* CreateHeaderContentSeparatorView() override;
   std::unique_ptr<views::Background> GetHeaderBackground() override;
-  void ButtonPressed(views::Button* sender, const ui::Event& event) override;
+  bool GetSheetId(DialogViewID* sheet_id) override;
+  bool DisplayDynamicBorderForHiddenContents() override;
 
   // content::WebContentsDelegate:
   void LoadProgressChanged(content::WebContents* source,
@@ -67,9 +70,9 @@ class PaymentHandlerWebFlowViewController
 
   Profile* profile_;
   GURL target_;
-  bool progress_bar_is_shown_;
+  bool show_progress_bar_;
   std::unique_ptr<views::ProgressBar> progress_bar_;
-  std::unique_ptr<views::View> content_header_view_;
+  std::unique_ptr<views::Separator> separator_;
   PaymentHandlerOpenWindowCallback first_navigation_complete_callback_;
 };
 

chrome/browser/ui/views/payments/payment_request_dialog_view_ids.h

@@ -89,6 +89,9 @@ enum class DialogViewID : int {
   // The combobox to choose a billing address to associate to a credit card.
   CREDIT_CARD_BILLING_ADDRESS,
 
+  // The sheet opens payment app window.
+  PAYMENT_APP_OPENED_WINDOW_SHEET,
+
   // NOTE: Keep these values last.
   // Used to offset the IDs of input fields, which gets added to the Autofill
   // type value they represent.

chrome/browser/ui/views/payments/payment_request_sheet_controller.cc

@@ -19,6 +19,7 @@
 #include "ui/views/controls/scroll_view.h"
 #include "ui/views/focus/focus_search.h"
 #include "ui/views/layout/box_layout.h"
+#include "ui/views/layout/fill_layout.h"
 #include "ui/views/layout/grid_layout.h"
 #include "ui/views/painter.h"
 
@@ -237,6 +238,12 @@ std::unique_ptr<views::View> PaymentRequestSheetController::CreateView() {
   header_view_->set_owned_by_client();
   layout->AddView(header_view_.get());
 
+  layout->StartRow(0, 0);
+  header_content_separator_container_ = std::make_unique<views::View>();
+  header_content_separator_container_->set_owned_by_client();
+  layout->AddView(header_content_separator_container_.get());
+  UpdateHeaderContentSeparatorView();
+
   layout->StartRow(1, 0);
   // |content_view| will go into a views::ScrollView so it needs to be sized now
   // otherwise it'll be sized to the ScrollView's viewport height, preventing
@@ -260,7 +267,9 @@ std::unique_ptr<views::View> PaymentRequestSheetController::CreateView() {
   pane_layout->AddView(content_view_);
   pane_->SizeToPreferredSize();
 
-  scroll_ = std::make_unique<BorderedScrollView>();
+  scroll_ = DisplayDynamicBorderForHiddenContents()
+                ? std::make_unique<BorderedScrollView>()
+                : std::make_unique<views::ScrollView>();
   scroll_->set_owned_by_client();
   scroll_->set_hide_horizontal_scrollbar(true);
   scroll_->SetContents(pane_);
@@ -292,6 +301,29 @@ void PaymentRequestSheetController::UpdateHeaderView() {
   header_view_->SchedulePaint();
 }
 
+void PaymentRequestSheetController::UpdateHeaderContentSeparatorView() {
+  header_content_separator_container_->RemoveAllChildViews(true);
+  views::View* separator = CreateHeaderContentSeparatorView();
+  if (separator) {
+    header_content_separator_container_->SetLayoutManager(
+        std::make_unique<views::FillLayout>());
+    header_content_separator_container_->AddChildView(separator);
+  }
+
+  // Relayout sheet view after updating header content separator.
+  DialogViewID sheet_id;
+  if (!GetSheetId(&sheet_id))
+    return;
+  SheetView* sheet_view = static_cast<SheetView*>(
+      dialog()->GetViewByID(static_cast<int>(sheet_id)));
+  // This will be null on first call since it's not been set until CreateView
+  // returns, and the first call to UpdateHeaderContentSeparatorView comes
+  // from CreateView.
+  if (sheet_view) {
+    sheet_view->Layout();
+  }
+}
+
 void PaymentRequestSheetController::UpdateFocus(views::View* focused_view) {
   DialogViewID sheet_id;
   if (GetSheetId(&sheet_id)) {
@@ -347,6 +379,10 @@ PaymentRequestSheetController::CreateHeaderContentView() {
   return title_label;
 }
 
+views::View* PaymentRequestSheetController::CreateHeaderContentSeparatorView() {
+  return nullptr;
+}
+
 std::unique_ptr<views::Background>
 PaymentRequestSheetController::GetHeaderBackground() {
   return views::CreateThemedSolidBackground(
@@ -442,6 +478,10 @@ bool PaymentRequestSheetController::GetSheetId(DialogViewID* sheet_id) {
   return false;
 }
 
+bool PaymentRequestSheetController::DisplayDynamicBorderForHiddenContents() {
+  return true;
+}
+
 bool PaymentRequestSheetController::PerformPrimaryButtonAction() {
   // Return "true" to prevent other views from handling the event.
   if (!dialog()->IsInteractive())

chrome/browser/ui/views/payments/payment_request_sheet_controller.h

@@ -69,6 +69,9 @@ class PaymentRequestSheetController : public views::ButtonListener {
   // Clears and recreates the header view for this sheet.
   void UpdateHeaderView();
 
+  // Clears and recreates the header content separator view for this sheet.
+  void UpdateHeaderContentSeparatorView();
+
   // Update the focus to |focused_view|.
   void UpdateFocus(views::View* focused_view);
 
@@ -120,6 +123,10 @@ class PaymentRequestSheetController : public views::ButtonListener {
   // header.
   virtual std::unique_ptr<views::View> CreateHeaderContentView();
 
+  // Creates and returns the view to be inserted in the header content separator
+  // container betweem header and content.
+  virtual views::View* CreateHeaderContentSeparatorView();
+
   // Returns the background to use for the header section of the sheet.
   virtual std::unique_ptr<views::Background> GetHeaderBackground();
 
@@ -142,6 +149,9 @@ class PaymentRequestSheetController : public views::ButtonListener {
   // sets |sheet_id| to the desired value.
   virtual bool GetSheetId(DialogViewID* sheet_id);
 
+  // Returns true to display dynamic top and bottom border for hidden contents.
+  virtual bool DisplayDynamicBorderForHiddenContents();
+
   views::Button* primary_button() { return primary_button_.get(); }
 
  private:
@@ -172,6 +182,7 @@ class PaymentRequestSheetController : public views::ButtonListener {
   std::unique_ptr<views::Button> primary_button_;
   std::unique_ptr<views::Button> secondary_button_;
   std::unique_ptr<views::View> header_view_;
+  std::unique_ptr<views::View> header_content_separator_container_;
 
   DISALLOW_COPY_AND_ASSIGN(PaymentRequestSheetController);
 };