Mac: improve hover/clicked state appearance of bookmark bar buttons.

chrome/browser/cocoa/gradient_button_cell.mm

 // Copyright (c) 2009 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 "base/scoped_nsobject.h"
 #include "chrome/browser/cocoa/gradient_button_cell.h"
 #import "third_party/GTM/AppKit/GTMTheme.h"
 #import "third_party/GTM/AppKit/GTMNSColor+Luminance.h"
 
 @interface GradientButtonCell (Private)
@@ skipping 54 matching lines @@
 }
 
 // For programmatic instantiations
 - (id)initTextCell:(NSString*)string {
   if ((self = [super initTextCell:string])) {
     [self sharedInit];
   }
   return self;
 }
 
-- (NSGradient *)gradientForHoverAlpha:(CGFloat)hoverAlpha
-                             isThemed:(BOOL)themed {
+- (NSGradient*)gradientForHoverAlpha:(CGFloat)hoverAlpha
+                            isThemed:(BOOL)themed {
   CGFloat startAlpha = 0.6 + 0.3 * hoverAlpha;
   CGFloat endAlpha = 0.333 * hoverAlpha;
 
   if (themed) {
     startAlpha = 0.2 + 0.35 * hoverAlpha;
     endAlpha = 0.333 * hoverAlpha;
   }
 
   NSColor* startColor =
       [NSColor colorWithCalibratedWhite:1.0
                                   alpha:startAlpha];
   NSColor* endColor =
       [NSColor colorWithCalibratedWhite:1.0 - 0.15 * hoverAlpha
                                   alpha:endAlpha];
-  NSGradient *gradient = [[NSGradient alloc] initWithColorsAndLocations:
+  NSGradient* gradient = [[NSGradient alloc] initWithColorsAndLocations:
                           startColor, hoverAlpha * 0.33,
                           endColor, 1.0, nil];
 
   return [gradient autorelease];
 }
 
 - (void)sharedInit {
   shouldTheme_ = YES;
   gradient_.reset([[self gradientForHoverAlpha:0.0 isThemed:NO] retain]);
 }
 
 - (void)setShouldTheme:(BOOL)shouldTheme {
   shouldTheme_ = shouldTheme;
 }
 
 - (NSImage*)underlayImage {
   return underlayImage_;
 }
 
 - (void)setUnderlayImage:(NSImage*)image {
   underlayImage_.reset([image retain]);
 
   [[self controlView] setNeedsDisplay:YES];
 }
 
 - (NSBackgroundStyle)interiorBackgroundStyle {
-  return [self isHighlighted] ?
-      NSBackgroundStyleLowered : NSBackgroundStyleRaised;
+  // Never lower the interior, since that just leads to a weird shadow which can
+  // often interact badly with the theme.
+  return NSBackgroundStyleRaised;
 }
 
-- (void)mouseEntered:(NSEvent *)theEvent {
+- (void)mouseEntered:(NSEvent*)theEvent {
   [self setMouseInside:YES animate:YES];
 }
 
-- (void)mouseExited:(NSEvent *)theEvent {
+- (void)mouseExited:(NSEvent*)theEvent {
   [self setMouseInside:NO animate:YES];
 }
 
 - (BOOL)isMouseInside {
   return trackingArea_ && isMouseInside_;
 }
 
 // Since we have our own drawWithFrame:, we need to also have our own
 // logic for determining when the mouse is inside for honoring this
 // request.
@@ skipping 13 matching lines @@
     [[self controlView] addTrackingArea:trackingArea_];
   } else {
     if (trackingArea_) {
       [[self controlView] removeTrackingArea:trackingArea_];
       trackingArea_.reset(nil);
       isMouseInside_ = NO;
     }
   }
 }
 
+// TODO(viettrungluu): clean up/reorganize.
 - (void)drawBorderAndFillForTheme:(GTMTheme*)theme
                       controlView:(NSView*)controlView
                         outerPath:(NSBezierPath*)outerPath
                         innerPath:(NSBezierPath*)innerPath
               showClickedGradient:(BOOL)showClickedGradient
             showHighlightGradient:(BOOL)showHighlightGradient
                        hoverAlpha:(CGFloat)hoverAlpha
                            active:(BOOL)active
                         cellFrame:(NSRect)cellFrame
                   defaultGradient:(NSGradient*)defaultGradient {
-  NSImage* backgroundImage =
-      [theme backgroundImageForStyle:GTMThemeStyleToolBarButton state:YES];
+  BOOL isFlatButton = [self showsBorderOnlyWhileMouseInside];
 
-  if (!defaultGradient)
-    defaultGradient = gradient_;
+  // For flat (unbordered when not hovered) buttons, never use the toolbar
+  // button background image, but the modest gradient used for themed buttons.
+  // To make things even more modest, scale the hover alpha down by 40 percent
+  // unless clicked.
+  NSImage* backgroundImage;
+  BOOL useThemeGradient;
+  if (isFlatButton) {
+    backgroundImage = nil;
+    useThemeGradient = YES;
+    if (!showClickedGradient)
+      hoverAlpha *= 0.6;
+  } else {
+    backgroundImage = [theme backgroundImageForStyle:GTMThemeStyleToolBarButton
+                                               state:YES];
+    useThemeGradient = backgroundImage ? YES : NO;
+  }
 
+  // The basic gradient shown inside; see above.
+  NSGradient* gradient;
+  if (hoverAlpha == 0 && !useThemeGradient) {
+    gradient = defaultGradient ? defaultGradient
+                               : gradient_;
+  } else {
+    gradient = [self gradientForHoverAlpha:hoverAlpha
+                                  isThemed:useThemeGradient];
+  }
+
+  // If we're drawing a background image, show that; else possibly show the
+  // clicked gradient.
   if (backgroundImage) {
     NSColor* patternColor = [NSColor colorWithPatternImage:backgroundImage];
     [patternColor set];
     // Set the phase to match window.
     NSRect trueRect = [controlView convertRectToBase:cellFrame];
     [[NSGraphicsContext currentContext]
         setPatternPhase:NSMakePoint(NSMinX(trueRect), NSMaxY(trueRect))];
     [innerPath fill];
   } else {
     if (showClickedGradient) {
-      NSGradient* gradient =
-          [theme gradientForStyle:GTMThemeStyleToolBarButtonPressed
-                            state:active];
-      [gradient drawInBezierPath:innerPath angle:90.0];
+      NSGradient* clickedGradient;
+      if (isFlatButton) {
+        clickedGradient = gradient;
+      } else {
+        clickedGradient =
+            [theme gradientForStyle:GTMThemeStyleToolBarButtonPressed
+                              state:active];
+      }
+      [clickedGradient drawInBezierPath:innerPath angle:90.0];
     }
   }
 
-  BOOL isCustomTheme = backgroundImage != nil;
-
+  // Visually indicate unclicked, enabled buttons.
   if (!showClickedGradient && [self isEnabled]) {
     [NSGraphicsContext saveGraphicsState];
     [innerPath addClip];
 
     // Draw the inner glow.
     if (hoverAlpha > 0) {
       [innerPath setLineWidth:2];
       [[NSColor colorWithCalibratedWhite:1.0 alpha:0.2 * hoverAlpha] setStroke];
       [innerPath stroke];
     }
 
     // Draw the top inner highlight.
     NSAffineTransform* highlightTransform = [NSAffineTransform transform];
     [highlightTransform translateXBy:1 yBy:1];
     scoped_nsobject<NSBezierPath> highlightPath([innerPath copy]);
     [highlightPath transformUsingAffineTransform:highlightTransform];
     [[NSColor colorWithCalibratedWhite:1.0 alpha:0.2] setStroke];
     [highlightPath stroke];
 
-    NSGradient *gradient = nil;
-    if (hoverAlpha == 0 && !isCustomTheme) {
-      gradient = defaultGradient;
-    } else {
-      gradient = [self gradientForHoverAlpha:hoverAlpha isThemed:isCustomTheme];
-    }
+    // Draw the gradient inside.
     [gradient drawInBezierPath:innerPath angle:90.0];
 
     [NSGraphicsContext restoreGraphicsState];
   }
 
-  // Draw the outer stroke
-  NSColor* stroke = [theme strokeColorForStyle:GTMThemeStyleToolBarButton
-                                         state:active];
-
-  if (showClickedGradient) {
-    stroke = [NSColor colorWithCalibratedWhite:0.0 alpha:0.3];
-  }
-  [stroke setStroke];
+  // Draw the outer stroke.
+  NSColor* strokeColor = showClickedGradient ?
+      [NSColor colorWithCalibratedWhite:0.0 alpha:0.3] :
+      [theme strokeColorForStyle:GTMThemeStyleToolBarButton state:active];
+  [strokeColor setStroke];
 
   [innerPath setLineWidth:1];
   [innerPath stroke];
 }
 
 - (void)drawWithFrame:(NSRect)cellFrame inView:(NSView*)controlView {
   // Constants from Cole.  Will kConstant them once the feedback loop
   // is complete.
   NSRect drawFrame = NSInsetRect(cellFrame, 1.5, 1.5);
   NSRect innerFrame = NSInsetRect(cellFrame, 2, 1);
@@ skipping 13 matching lines @@
       innerFrame.size.width += 2;
     default:
       break;
   }
 
   const float radius = 3.5;
   BOOL pressed = [self isHighlighted];
   NSWindow* window = [controlView window];
   BOOL active = [window isKeyWindow] || [window isMainWindow];
 
-  GTMTheme *theme = [controlView gtm_theme];
+  GTMTheme* theme = [controlView gtm_theme];
 
   NSBezierPath* innerPath =
       [NSBezierPath bezierPathWithRoundedRect:drawFrame
                                       xRadius:radius
                                       yRadius:radius];
   NSBezierPath* outerPath =
       [NSBezierPath bezierPathWithRoundedRect:NSInsetRect(drawFrame, -1, -1)
                                       xRadius:radius + 1
                                       yRadius:radius + 1];
 
@@ skipping 38 matching lines @@
     [NSGraphicsContext saveGraphicsState];
 
     CGContextRef context =
         (CGContextRef)([[NSGraphicsContext currentContext] graphicsPort]);
 
     NSColor* color = [theme iconColorForStyle:GTMThemeStyleToolBarButton
                                         state:YES];
 
     if (isTemplate) {
       scoped_nsobject<NSShadow> shadow([[NSShadow alloc] init]);
-      NSColor *shadowColor = [color gtm_legibleTextColor];
+      NSColor* shadowColor = [color gtm_legibleTextColor];
       shadowColor = [shadowColor colorWithAlphaComponent:0.25];
       [shadow.get() setShadowColor:shadowColor];
       [shadow.get() setShadowOffset:NSMakeSize(0, -1.0)];
       [shadow setShadowBlurRadius:1.0];
       [shadow set];
     }
 
     [self drawUnderlayImageWithFrame:cellFrame inView:controlView];
 
     CGContextBeginTransparencyLayer(context, 0);
@@ skipping 31 matching lines @@
     imageRect.size = [underlayImage_ size];
     [underlayImage_ setFlipped:[controlView isFlipped]];
     [underlayImage_ drawInRect:[self imageRectForBounds:cellFrame]
                       fromRect:imageRect
                      operation:NSCompositeSourceOver
                       fraction:[self isEnabled] ? 1.0 : 0.5];
   }
 }
 
 @end