Omnibox UI Experiments: Port Vertical Layout experiment to Mac Cocoa.

chrome/browser/ui/cocoa/omnibox/omnibox_popup_cell.mm

 // Copyright 2013 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.
 
 #import "chrome/browser/ui/cocoa/omnibox/omnibox_popup_cell.h"
 
 #include <stddef.h>
 
 #include <algorithm>
 #include <cmath>
 
+#include "base/feature_list.h"
 #include "base/i18n/rtl.h"
 #include "base/mac/foundation_util.h"
 #include "base/mac/objc_property_releaser.h"
 #include "base/mac/scoped_nsobject.h"
 #include "base/metrics/field_trial_params.h"
 #include "base/strings/string_number_conversions.h"
 #include "base/strings/string_util.h"
 #include "base/strings/sys_string_conversions.h"
 #include "base/strings/utf_string_conversions.h"
 #include "chrome/browser/ui/cocoa/omnibox/omnibox_popup_view_mac.h"
@@ skipping 11 matching lines @@
 
 namespace {
 
 // Extra padding beyond the vertical text padding.
 constexpr CGFloat kMaterialExtraVerticalImagePadding = 2.0;
 
 constexpr CGFloat kMaterialTextStartOffset = 27.0;
 
 constexpr CGFloat kMaterialImageXOffset = 6.0;
 
+constexpr CGFloat kDefaultVerticalMargin = 3.0;
+
+constexpr CGFloat kDefaultTextHeight = 19;
+
 // Returns the margin that should appear at the top and bottom of the result.
 CGFloat GetVerticalMargin() {
-  constexpr CGFloat kDefaultVerticalMargin = 3.0;
-
   return base::GetFieldTrialParamByFeatureAsInt(
       omnibox::kUIExperimentVerticalMargin,
       OmniboxFieldTrial::kUIVerticalMarginParam, kDefaultVerticalMargin);
 }
 
 // Flips the given |rect| in context of the given |frame|.
 NSRect FlipIfRTL(NSRect rect, NSRect frame) {
   DCHECK_LE(NSMinX(frame), NSMinX(rect));
   DCHECK_GE(NSMaxX(frame), NSMaxX(rect));
   if (base::i18n::IsRTL()) {
@@ skipping 357 matching lines @@
       contents_ =
           [CreateAnswerLine(match.answer->first_line(), isDarkTheme) retain];
       description_ =
           [CreateAnswerLine(match.answer->second_line(), isDarkTheme) retain];
       maxLines_ = match.answer->second_line().num_text_lines();
     } else {
       contents_ = [CreateClassifiedAttributedString(
           match.contents, ContentTextColor(isDarkTheme), match.contents_class,
           isDarkTheme) retain];
       if (!match.description.empty()) {
+        // Swap the contents and description of non-search suggestions in
+        // vertical layouts.
+        BOOL swapMatchText = base::FeatureList::IsEnabled(
+                                 omnibox::kUIExperimentVerticalLayout) &&
+                             !AutocompleteMatch::IsSearchType(match.type);
+
         description_ = [CreateClassifiedAttributedString(
-            match.description, DimTextColor(isDarkTheme),
+            match.description,
+            swapMatchText ? ContentTextColor(isDarkTheme)
+                          : DimTextColor(isDarkTheme),

[tommycli, 2017/05/31 18:20:40]

I restructured the code... and addressed your comments. One extra addition is
not applying DimTextColor if swapMatchText is YES. That is necessary for correct
display.

[groby-ooo-7-16, 2017/05/31 19:24:17]

Do you need to do the same thing for |contents_|? :)

If so, it might be easier to pull out two strings, swap if necessary, and then
apply Content/Description styling without a ternary.

[tommycli, 2017/05/31 20:07:22]

Hey, I don't. I just need to cancel the force-dimming of the description.

             match.description_class, isDarkTheme) retain];
+
+        if (swapMatchText)
+          std::swap(contents_, description_);
       }
-      maxLines_ = 1;
     }
     propertyReleaser_OmniboxPopupCellData_.Init(self,
                                                 [OmniboxPopupCellData class]);
   }
   return self;
 }
 
 - (instancetype)copyWithZone:(NSZone*)zone {
   return [self retain];
 }
@@ skipping 17 matching lines @@
     } else {
       [HoveredBackgroundColor(isDarkTheme) set];
     }
     NSRectFillUsingOperation(cellFrame, NSCompositeSourceOver);
   }
 
   [self drawMatchWithFrame:cellFrame inView:controlView];
 }
 
 - (void)drawMatchWithFrame:(NSRect)cellFrame inView:(NSView*)controlView {
+  bool isVerticalLayout =
+      base::FeatureList::IsEnabled(omnibox::kUIExperimentVerticalLayout);
+
   OmniboxPopupCellData* cellData =
       base::mac::ObjCCastStrict<OmniboxPopupCellData>([self objectValue]);
   OmniboxPopupMatrix* tableView =
       base::mac::ObjCCastStrict<OmniboxPopupMatrix>(controlView);
   CGFloat remainingWidth = [OmniboxPopupCell getContentAreaWidth:cellFrame] -
                            [tableView contentLeftPadding];
   CGFloat contentsWidth = [cellData getMatchContentsWidth];
   CGFloat separatorWidth = [[tableView separator] size].width;
   CGFloat descriptionWidth =
       [cellData description] ? [[cellData description] size].width : 0;
   int contentsMaxWidth, descriptionMaxWidth;
   OmniboxPopupModel::ComputeMatchMaxWidths(
       ceilf(contentsWidth), ceilf(separatorWidth), ceilf(descriptionWidth),
-      ceilf(remainingWidth),
-      [cellData isAnswer],
-      !AutocompleteMatch::IsSearchType([cellData matchType]),
-      &contentsMaxWidth,
+      ceilf(remainingWidth), [cellData isAnswer] || isVerticalLayout,
+      !AutocompleteMatch::IsSearchType([cellData matchType]), &contentsMaxWidth,
       &descriptionMaxWidth);
 
+  CGFloat halfLineHeight = (kDefaultTextHeight + kDefaultVerticalMargin) / 2;
+
   NSWindow* parentWindow = [[controlView window] parentWindow];
   BOOL isDarkTheme = [parentWindow hasDarkTheme];
   NSRect imageRect = cellFrame;
   NSImage* theImage =
       isDarkTheme ? [cellData incognitoImage] : [cellData image];
   imageRect.size = [theImage size];
   imageRect.origin.x += kMaterialImageXOffset + [tableView contentLeftPadding];
   imageRect.origin.y +=
       GetVerticalMargin() + kMaterialExtraVerticalImagePadding;
+  if (isVerticalLayout)
+    imageRect.origin.y += halfLineHeight;
   [theImage drawInRect:FlipIfRTL(imageRect, cellFrame)
               fromRect:NSZeroRect
              operation:NSCompositeSourceOver
               fraction:1.0
         respectFlipped:YES
                  hints:nil];
 
-  NSPoint origin =
-      NSMakePoint(kMaterialTextStartOffset + [tableView contentLeftPadding],
-                  GetVerticalMargin());
+  CGFloat left = kMaterialTextStartOffset + [tableView contentLeftPadding];
+  NSPoint origin = NSMakePoint(left, GetVerticalMargin());
+
+  // For matches lacking description in vertical layout, center vertically.
+  if (isVerticalLayout && descriptionMaxWidth == 0)
+    origin.y += halfLineHeight;
+
   if ([cellData matchType] == AutocompleteMatchType::SEARCH_SUGGEST_TAIL) {
     // Tail suggestions are rendered with a prefix (usually ellipsis), which
     // appear vertically stacked.
     origin.x += [self drawMatchPrefixWithFrame:cellFrame
                                      tableView:tableView
                           withContentsMaxWidth:&contentsMaxWidth
                                   forDarkTheme:isDarkTheme];
   }
   origin.x += [self drawMatchPart:[cellData contents]
                         withFrame:cellFrame
                            origin:origin
                      withMaxWidth:contentsMaxWidth
                      forDarkTheme:isDarkTheme];
 
   if (descriptionMaxWidth > 0) {
     if ([cellData isAnswer]) {
       origin = NSMakePoint(
-          kMaterialTextStartOffset + [tableView contentLeftPadding],
-          [OmniboxPopupCell getContentTextHeight] - GetVerticalMargin());
+          left, [OmniboxPopupCell getContentTextHeightForDoubleLine:NO] -
+                    GetVerticalMargin());
       CGFloat imageSize = [tableView answerLineHeight];
       NSRect imageRect =
           NSMakeRect(NSMinX(cellFrame) + origin.x, NSMinY(cellFrame) + origin.y,
                      imageSize, imageSize);
       [[cellData answerImage] drawInRect:FlipIfRTL(imageRect, cellFrame)
                                 fromRect:NSZeroRect
                                operation:NSCompositeSourceOver
                                 fraction:1.0
                           respectFlipped:YES
                                    hints:nil];
       if ([cellData answerImage]) {
         origin.x += imageSize + kMaterialImageXOffset;
 
         // Have to nudge the baseline down 1pt in Material Design for the text
         // that follows, so that it's the same as the bottom of the image.
         origin.y += 1;
       }
     } else {
-      origin.x += [self drawMatchPart:[tableView separator]
-                            withFrame:cellFrame
-                               origin:origin
-                         withMaxWidth:separatorWidth
-                         forDarkTheme:isDarkTheme];
+      if (isVerticalLayout) {
+        origin.x = left;
+        origin.y += halfLineHeight * 2;
+      } else {
+        origin.x += [self drawMatchPart:[tableView separator]
+                              withFrame:cellFrame
+                                 origin:origin
+                           withMaxWidth:separatorWidth
+                           forDarkTheme:isDarkTheme];
+      }
     }
-    origin.x += [self drawMatchPart:[cellData description]
-                          withFrame:cellFrame
-                             origin:origin
-                       withMaxWidth:descriptionMaxWidth
-                       forDarkTheme:isDarkTheme];
+    [self drawMatchPart:[cellData description]
+              withFrame:cellFrame
+                 origin:origin
+           withMaxWidth:descriptionMaxWidth
+           forDarkTheme:isDarkTheme];
   }
 }
 
 - (CGFloat)drawMatchPrefixWithFrame:(NSRect)cellFrame
                           tableView:(OmniboxPopupMatrix*)tableView
                withContentsMaxWidth:(int*)contentsMaxWidth
                        forDarkTheme:(BOOL)isDarkTheme {
   OmniboxPopupCellData* cellData =
       base::mac::ObjCCastStrict<OmniboxPopupCellData>([self objectValue]);
   CGFloat offset = 0.0f;
@@ skipping 126 matching lines @@
 + (NSAttributedString*)createSeparatorStringForDarkTheme:(BOOL)isDarkTheme {
   base::string16 raw_separator =
       l10n_util::GetStringUTF16(IDS_AUTOCOMPLETE_MATCH_DESCRIPTION_SEPARATOR);
   return CreateAttributedString(raw_separator, DimTextColor(isDarkTheme));
 }
 
 + (CGFloat)getContentAreaWidth:(NSRect)cellFrame {
   return NSWidth(cellFrame) - kMaterialTextStartOffset;
 }
 
-+ (CGFloat)getContentTextHeight {
-  constexpr CGFloat kDefaultTextHeight = 19;
-  return kDefaultTextHeight + 2 * GetVerticalMargin();
++ (CGFloat)getContentTextHeightForDoubleLine:(BOOL)isDoubleLine {
+  CGFloat height = kDefaultTextHeight + 2 * GetVerticalMargin();
+  if (isDoubleLine)
+    height += kDefaultTextHeight + kDefaultVerticalMargin;
+  return height;
 }
 
 @end