[WebPayments] Start populating the Payment Sheet.

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

Index: chrome/browser/ui/views/payments/payment_sheet_view_controller.cc
diff --git a/chrome/browser/ui/views/payments/payment_sheet_view_controller.cc b/chrome/browser/ui/views/payments/payment_sheet_view_controller.cc
index 1992efaf4d9734a24c14d3a98de1653fe2424469..7da6e2da68c2b962cb7c84d998cc19bd2d25f14a 100644
--- a/chrome/browser/ui/views/payments/payment_sheet_view_controller.cc
+++ b/chrome/browser/ui/views/payments/payment_sheet_view_controller.cc
@@ -9,24 +9,113 @@
 
 #include "base/memory/ptr_util.h"
 #include "base/strings/utf_string_conversions.h"
+#include "chrome/browser/payments/payment_request_impl.h"
 #include "chrome/browser/ui/views/payments/payment_request_dialog.h"
 #include "chrome/browser/ui/views/payments/payment_request_views_util.h"
 #include "chrome/grit/generated_resources.h"
+#include "components/strings/grit/components_strings.h"
+#include "third_party/skia/include/core/SkColor.h"
 #include "ui/base/l10n/l10n_util.h"
+#include "ui/gfx/color_utils.h"
+#include "ui/gfx/font.h"
+#include "ui/gfx/geometry/insets.h"
+#include "ui/gfx/paint_vector_icon.h"
+#include "ui/gfx/range/range.h"
+#include "ui/gfx/vector_icons/vector_icons.h"
+#include "ui/views/border.h"
+#include "ui/views/controls/button/custom_button.h"
 #include "ui/views/controls/button/label_button.h"
 #include "ui/views/controls/button/md_text_button.h"
+#include "ui/views/controls/image_view.h"
+#include "ui/views/controls/label.h"
+#include "ui/views/controls/styled_label.h"
 #include "ui/views/layout/grid_layout.h"
 #include "ui/views/view.h"
 
+namespace payments {
+

[please use gerrit instead, 2017/01/04 19:17:11]

nit: no blank line

[anthonyvd, 2017/01/05 16:45:42]

Done.

 namespace {
 
-// The tag for the button that navigates to the Order Summary sheet.
-constexpr int kOrderSummaryTag = 0;
+enum class PaymentSheetViewControllerTags {
+  // The tag for the button that navigates to the Order Summary sheet.
+  SHOW_ORDER_SUMMARY_BUTTON = static_cast<int>(
+      payments::PaymentRequestCommonTags::PAYMENT_REQUEST_COMMON_TAG_MAX),
+};
+
+// Creates a clickable row to be displayed in the Payment Sheet. It contains
+// a section name and some content, followed by a chevron as a clickability
+// affordance. Both, either, or none of |content_view| and |extra_content_view|
+// may be present, the difference between the two being that content is pinned
+// to the left and extra_content is pinned to the right.
+// The row also displays a light gray horizontal ruler on its lower boundary.
+// +----------------------------+
+// | Name | Content | Extra | > |
+// +~~~~~~~~~~~~~~~~~~~~~~~~~~~~+ <-- ruler
+class PaymentSheetRow : public views::CustomButton {
+ public:
+  PaymentSheetRow(views::ButtonListener* listener,
+                  const base::string16& section_name,
+                  std::unique_ptr<views::View> content_view,
+                  std::unique_ptr<views::View> extra_content_view)
+    : views::CustomButton(listener) {
+    SetBorder(views::CreateSolidSidedBorder(0, 0, 1, 0, SK_ColorLTGRAY));
+    views::GridLayout* layout = new views::GridLayout(this);
+
+    constexpr int kRowVerticalInset = 18;
+    // The rows have extra inset compared to the header so that their right edge
+    // lines up with the close button's X rather than its invisible right edge.
+    constexpr int kRowExtraRightInset = 8;
+    layout->SetInsets(
+        kRowVerticalInset, 0, kRowVerticalInset, kRowExtraRightInset);
+    SetLayoutManager(layout);
+
+    views::ColumnSet* columns = layout->AddColumnSet(0);
+    // A column for the section name.
+    columns->AddColumn(views::GridLayout::LEADING, views::GridLayout::CENTER,
+                       0, views::GridLayout::USE_PREF, 0, 0);
+    // A column for the content.
+    columns->AddColumn(views::GridLayout::FILL, views::GridLayout::CENTER,
+                       1, views::GridLayout::USE_PREF, 0, 0);
+    // A column for the extra content.
+    columns->AddColumn(views::GridLayout::TRAILING, views::GridLayout::CENTER,
+                       0, views::GridLayout::USE_PREF, 0, 0);
+
+    constexpr int kPaddingColumnsWidth = 25;
+    columns->AddPaddingColumn(0, kPaddingColumnsWidth);
+    // A column for the chevron.
+    columns->AddColumn(views::GridLayout::TRAILING, views::GridLayout::CENTER,
+                       0, views::GridLayout::USE_PREF, 0, 0);
+
+    layout->StartRow(0, 0);
+    views::Label* name_label = new views::Label(section_name);
+    layout->AddView(name_label);
+
+    if (content_view) {
+      layout->AddView(content_view.release());
+    } else {
+      layout->SkipColumns(1);
+    }
+
+    if (extra_content_view) {
+      layout->AddView(extra_content_view.release());
+    } else {
+      layout->SkipColumns(1);
+    }
+
+    views::ImageView* chevron = new views::ImageView();
+    chevron->SetImage(gfx::CreateVectorIcon(
+        gfx::VectorIconId::SUBMENU_ARROW,
+        color_utils::DeriveDefaultIconColor(name_label->enabled_color())));
+    layout->AddView(chevron);
+
+    SetFocusForPlatform();

[anthonyvd, 2017/01/04 19:15:30]

Hmm it looks like this isn't the only call needed to enable focus. Will
investigate.

[anthonyvd, 2017/01/05 16:45:42]

It turns out focus is hard!

From what I can gather, the ViewStack is getting focus when the dialog is shown.
However, it's GetNextFocusableView() function returns nullptr, even after a
child view is added to it (which I thought would set up the focus chain
properly, but I'm probably missing something). The rows themselves never receive
focus.

In any case, I realized there's a lot more work that will be required to get
focus to work properly in the dialog. Since the ViewStack can hide and show
different views, this code will need a way to handle the case where a new view
is pushed on the stack while focus somewhere on a child of the view being
hidden. There seem to be 2 ways of doing this:

1. Manually setting up the focus chain in views being pushed on ViewStack and
calling RequestFocus() appropriately in ViewStack::Push/Pop(). This would
probably have the unwanted side-effect of always having something focused (which
might be avoidable with an invisible dummy view, I don't know).
2. Having ViewStack implement FocusTraversable and supply a custom FocusSearch
capable of finding the correct focus target in the stack. I don't know anything
about that mechanism so I might be wrong but this seems to be one of the cases
that require it.

sky@ WDYT? Unless I'm missing something that makes this much easier, I'd also
like to implement this properly in another CL so I removed the
SetFocusForPlatform() call here.

+  }
+
+  DISALLOW_COPY_AND_ASSIGN(PaymentSheetRow);
+};
 
 }  // namespace
 
-namespace payments {
-
 PaymentSheetViewController::PaymentSheetViewController(
     PaymentRequestImpl* impl, PaymentRequestDialog* dialog)
   : PaymentRequestSheetController(impl, dialog) {}
@@ -39,26 +128,57 @@ std::unique_ptr<views::View> PaymentSheetViewController::CreateView() {
   views::GridLayout* layout = new views::GridLayout(content_view.get());
   content_view->SetLayoutManager(layout);
   views::ColumnSet* columns = layout->AddColumnSet(0);
-  columns->AddColumn(views::GridLayout::TRAILING, views::GridLayout::CENTER,
-                     0, views::GridLayout::USE_PREF, 0, 0);
+  columns->AddColumn(views::GridLayout::FILL, views::GridLayout::CENTER,
+                     1, views::GridLayout::USE_PREF, 0, 0);
 
   layout->StartRow(0, 0);
-  views::LabelButton* order_summary_button =
-      views::MdTextButton::CreateSecondaryUiBlueButton(
-          this, base::ASCIIToUTF16("Order Summary"));
-  order_summary_button->set_tag(kOrderSummaryTag);
-  layout->AddView(order_summary_button);
-
-  return payments::CreatePaymentView(
-      l10n_util::GetStringUTF16(IDS_PAYMENT_REQUEST_PAYMENT_SHEET_TITLE),
+  layout->AddView(CreatePaymentSheetSummaryRow().release());
+
+  return CreatePaymentView(
+      CreateSheetHeaderView(
+          false,
+          l10n_util::GetStringUTF16(IDS_PAYMENT_REQUEST_PAYMENT_SHEET_TITLE),
+          this),
       std::move(content_view));
 }
 
 void PaymentSheetViewController::ButtonPressed(
     views::Button* sender, const ui::Event& event) {
-  DCHECK_EQ(kOrderSummaryTag, sender->tag());
+  switch (sender->tag()) {
+    case static_cast<int>(PaymentRequestCommonTags::CLOSE_BUTTON_TAG):
+      dialog()->CloseDialog();
+      break;
+    case static_cast<int>(
+        PaymentSheetViewControllerTags::SHOW_ORDER_SUMMARY_BUTTON):
+      dialog()->ShowOrderSummary();
+      break;
+    default:
+      NOTREACHED();
+  }
+}
+
+std::unique_ptr<views::View>
+PaymentSheetViewController::CreateOrderSummarySectionContent() {
+  base::string16 label_value =
+      l10n_util::GetStringFUTF16(
+          IDS_PAYMENT_REQUEST_ORDER_SUMMARY_SECTION_TOTAL_FORMAT,
+          base::ASCIIToUTF16(impl()->details()->total->label),
+          base::ASCIIToUTF16(impl()->details()->total->amount->currency),
+          base::ASCIIToUTF16(impl()->details()->total->amount->value));
+
+  return base::MakeUnique<views::Label>(label_value);
+}
 
-  dialog()->ShowOrderSummary();
+std::unique_ptr<views::View>
+PaymentSheetViewController::CreatePaymentSheetSummaryRow() {
+  std::unique_ptr<PaymentSheetRow> section = base::MakeUnique<PaymentSheetRow>(
+      this,
+      l10n_util::GetStringUTF16(IDS_PAYMENT_REQUEST_ORDER_SUMMARY_SECTION_NAME),
+      std::unique_ptr<views::View>(nullptr),
+      CreateOrderSummarySectionContent());
+  section->set_tag(static_cast<int>(
+      PaymentSheetViewControllerTags::SHOW_ORDER_SUMMARY_BUTTON));
+  return section;
 }
 
 }  // namespace payments