Skip to content

Commit

Permalink
Bring over more code from cole to improve the appearance of tabs. Sta…
Browse files Browse the repository at this point in the history 
…rt building parts of GTM that are needed for theming.

Review URL: http://codereview.chromium.org/42081

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@11482 0039d316-1c4b-4281-b951-d872f2087c98
  • Loading branch information
pinkerton@chromium.org committed Mar 11, 2009
1 parent b7948c9 commit 7e7b09d
Show file tree
Hide file tree
Showing 2 changed files with 145 additions and 107 deletions.
238 changes: 132 additions & 106 deletions chrome/browser/cocoa/tab_cell.mm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,132 +2,158 @@
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

#include "chrome/browser/cocoa/tab_cell.h"
#import "chrome/browser/cocoa/tab_cell.h"
#import "third_party/GTM/AppKit/GTMTheme.h"
#import "third_party/GTM/AppKit/GTMNSColor+Luminance.h"

#define INSET_MULTIPLIER 2.0/3.0
#define CP1_MULTIPLIER 1.0/3.0
#define CP2_MULTIPLIER 3.0/8.0

@implementation TabCell

- (id)initTextCell:(NSString *)aString {
self = [super initTextCell:aString];
if (self != nil) {
// nothing for now...
}
return self;
}

- (NSBackgroundStyle)interiorBackgroundStyle {
// GTMThemeStyle style =
// [self isHighlighted] ? GTMThemeStyleTabBarSelected
// : GTMThemeStyleTabBarDeselected;
return [[GTMTheme defaultTheme]
interiorBackgroundStyleForStyle:GTMThemeStyleTabBarSelected
active:YES];
}

// Override drawing the button so that it looks like a Chromium tab instead
// of just a normal MacOS button.
// TODO(pinkerton/alcor): Clearly this is a work in progress. Comments need
// to be added to the flow once we get a better idea of exactly what we
// want and the kinks worked out of the visual appearance/tracking.
// TODO(pinkerton/alcor): Document what most of these constants are.
- (void)drawWithFrame:(NSRect)cellFrame inView:(NSView *)controlView {
[[NSGraphicsContext currentContext] saveGraphicsState];

// create a rounded rect path with which we'll stroke the outine of the
// tab.
NSRect rect = cellFrame;
// rect.origin.y += 20;
NSBezierPath *path =
[NSBezierPath bezierPathWithRoundedRect:NSInsetRect(rect, 0.5, 0.5)
xRadius:10.0
yRadius:10.0];

[[NSColor lightGrayColor] setStroke];
BOOL isKey = [[controlView window] isKeyWindow];
if (1) { //[self state] || [self isHighlighted]) {
[[NSColor colorWithCalibratedHue:218.0 / 360.0
saturation:0.05
brightness:1.0
alpha:1.0] setFill];
// [[NSColor colorWithCalibratedHue:210.0/360.0 saturation:0.36
// brightness:0.73 alpha:1.0] setStroke];
path = [NSBezierPath bezierPath];
rect = NSInsetRect(rect, 0.5, 0.5);
float radius = 4.0;
if (radius > 0.0) {
// Clamp radius to be no larger than half the rect's width or height.
radius = MIN(radius, 0.5 * MIN(rect.size.width, rect.size.height));

NSPoint bottomLeft = NSMakePoint(NSMinX(rect), NSMaxY(rect));
NSPoint bottomRight = NSMakePoint(NSMaxX(rect), NSMaxY(rect));
NSPoint topRight =
NSMakePoint(NSMaxX(rect) - INSET_MULTIPLIER * NSHeight(rect),
NSMinY(rect));
NSPoint topLeft =
NSMakePoint(NSMinX(rect) + INSET_MULTIPLIER * NSHeight(rect),
NSMinY(rect));

float baseControlPointOutset = NSHeight(rect) * CP1_MULTIPLIER;
float bottomControlPointInset = NSHeight(rect) * CP2_MULTIPLIER;

[path moveToPoint:NSMakePoint(bottomLeft.x - 2, bottomLeft.y + 2)];
[path lineToPoint:NSMakePoint(bottomLeft.x - 2, bottomLeft.y)];
[path lineToPoint:bottomLeft];

[path curveToPoint:topLeft
controlPoint1:NSMakePoint(bottomLeft.x + baseControlPointOutset,
bottomLeft.y)
controlPoint2:NSMakePoint(topLeft.x - bottomControlPointInset,
topLeft.y)];

[path lineToPoint:topRight];

[path curveToPoint:bottomRight
controlPoint1:NSMakePoint(topRight.x + bottomControlPointInset,
topRight.y)
controlPoint2:NSMakePoint(bottomRight.x - baseControlPointOutset,
bottomRight.y)];

[path lineToPoint:NSMakePoint(bottomRight.x + 1, bottomRight.y)];
[path lineToPoint:NSMakePoint(bottomRight.x + 1, bottomRight.y + 1)];
}
BOOL selected = [(NSButton *)controlView state];

NSGradient *gradient = nil;

if (!selected)
[[NSBezierPath bezierPathWithRect:NSOffsetRect(cellFrame, 0, -1)]
addClip];
if (selected) {
NSColor* startingColor = [NSColor colorWithCalibratedWhite:1.0 alpha:1.0];
NSColor* endingColor =
[NSColor colorWithCalibratedWhite:isKey ? 0.95 : 0.98 alpha:1.0];
gradient =
[[[NSGradient alloc]
initWithStartingColor:startingColor endingColor:endingColor]
autorelease];
[[NSColor colorWithCalibratedWhite:0.0 alpha:isKey ? 0.5 : 0.3] set];
} else {
NSColor* startingColor = [NSColor colorWithCalibratedWhite:1.0 alpha:0.5];
NSColor* endingColor = [NSColor colorWithCalibratedWhite:0.95 alpha:0.5];
gradient =
[[[NSGradient alloc]
initWithStartingColor:startingColor endingColor:endingColor]
autorelease];
[[NSColor colorWithCalibratedWhite:0.0 alpha:isKey ? 0.3 : 0.1] set];
}

if (isKey || selected)
[gradient drawInBezierPath:path angle:90.0];

[path stroke];
BOOL active =
[[controlView window] isKeyWindow] || [[controlView window] isMainWindow];

BOOL selected = [(NSButton *)controlView state];

// Inset by 0.5 in order to draw on pixels rather than on borders (which would
// cause blurry pixels). Decrease height by 1 in order to move away from the
// edge for the dark shadow.
rect = NSInsetRect(rect, 0.5, selected ? 0 : -0.5);
rect.size.height -= 1;
rect.origin.y += 1;

NSPoint bottomLeft = NSMakePoint(NSMinX(rect), NSMaxY(rect));
NSPoint bottomRight = NSMakePoint(NSMaxX(rect), NSMaxY(rect));
NSPoint topRight =
NSMakePoint(NSMaxX(rect) - INSET_MULTIPLIER * NSHeight(rect),
NSMinY(rect));
NSPoint topLeft =
NSMakePoint(NSMinX(rect) + INSET_MULTIPLIER * NSHeight(rect),
NSMinY(rect));

float baseControlPointOutset = NSHeight(rect) * CP1_MULTIPLIER;
float bottomControlPointInset = NSHeight(rect) * CP2_MULTIPLIER;

// Outset many of these values by 1 to cause the fill to bleed outside the
// clip area
NSBezierPath *path = [NSBezierPath bezierPath];
[path moveToPoint:NSMakePoint(bottomLeft.x - 1, bottomLeft.y + 1)];
[path lineToPoint:NSMakePoint(bottomLeft.x - 1, bottomLeft.y)];
[path lineToPoint:bottomLeft];
[path curveToPoint:topLeft
controlPoint1:NSMakePoint(bottomLeft.x + baseControlPointOutset,
bottomLeft.y)
controlPoint2:NSMakePoint(topLeft.x - bottomControlPointInset,
topLeft.y)];
[path lineToPoint:topRight];
[path curveToPoint:bottomRight
controlPoint1:NSMakePoint(topRight.x + bottomControlPointInset,
topRight.y)
controlPoint2:NSMakePoint(bottomRight.x - baseControlPointOutset,
bottomRight.y)];
[path lineToPoint:NSMakePoint(bottomRight.x + 1, bottomRight.y)];
[path lineToPoint:NSMakePoint(bottomRight.x + 1, bottomRight.y + 1)];

GTMTheme *theme = [GTMTheme defaultTheme];
NSGradient *gradient = nil;

if (selected) {
gradient = [theme gradientForStyle:GTMThemeStyleTabBarSelected
active:active];
// Stroke with a translucent black
[[NSColor colorWithCalibratedWhite:0.0 alpha:active ? 0.5 : 0.3] set];
[[NSGraphicsContext currentContext] saveGraphicsState];
NSShadow *shadow = [[[NSShadow alloc] init] autorelease];
[shadow setShadowOffset:NSMakeSize(2, -1)];
[shadow setShadowBlurRadius:2.0];
[path fill];
[[NSGraphicsContext currentContext] restoreGraphicsState];
} else {
gradient = [theme gradientForStyle:GTMThemeStyleTabBarDeselected
active:active];
// Stroke with a translucent black
[[NSColor colorWithCalibratedWhite:0.0 alpha:active ? 0.3 : 0.1] set];
[path fill];
}

[[NSGraphicsContext currentContext] saveGraphicsState];
[[NSBezierPath bezierPathWithRect:NSOffsetRect(cellFrame, 0, -1)] addClip];
[[NSColor colorWithCalibratedWhite:0.0 alpha:0.2] set];
[path setLineWidth:selected ? 2.0 : 1.0];
[path stroke];
[[NSGraphicsContext currentContext] restoreGraphicsState];
[self drawInteriorWithFrame:NSInsetRect(cellFrame, 12.0, 0)
inView:controlView];
}

- (void)drawImage:(NSImage*)image withFrame:(NSRect)frame
inView:(NSView*)controlView {
NSSize size = [image size];
[image setFlipped: YES];
[gradient drawInBezierPath:path angle:90.0];
[[NSColor darkGrayColor] set];

[[NSGraphicsContext currentContext] restoreGraphicsState];

float opacity = [self isEnabled] ? 1.0 : 0.25;
// Inset where the text and favicon are drawn to keep them away from the
// sloping edges of the tab.
int kInteriorInset = cellFrame.size.height / 2.0;
[self drawInteriorWithFrame:NSInsetRect(cellFrame, kInteriorInset, 0)
inView:controlView];
}

[image drawInRect:NSMakeRect(frame.origin.x, frame.origin.y, 16.0, 16.0)
fromRect:NSMakeRect(0, 0, size.width, size.height)
operation:NSCompositeSourceOver fraction:opacity];
- (void)drawInteriorWithFrame:(NSRect)cellFrame inView:(NSView *)controlView {
[super drawInteriorWithFrame:cellFrame inView:controlView];

void* voidContext = [[NSGraphicsContext currentContext] graphicsPort];
CGContextRef c = static_cast<CGContextRef>(voidContext);

// Build the rect for where we draw the close (x).
// TODO(alcor): This should be retrieved from a method that can also be called
// for hit-testing. Right now it also will overlap content if the page title
// is wide enough.
const int kCloseRectSize = 8;
NSRect closeRect, restRect;
NSDivideRect(cellFrame, &closeRect, &restRect, NSHeight(cellFrame),
NSMaxXEdge);
closeRect = NSInsetRect(closeRect, kCloseRectSize, kCloseRectSize);

NSGradient *gradient =
[[GTMTheme defaultTheme] gradientForStyle:GTMThemeStyleTabBarSelected
active:YES];
NSColor *color = [gradient interpolatedColorAtLocation:0.5];
CGFloat luminance = [color gtm_luminance];

// Draw the (x). Fade the images as they move toward the contrasty ends of
// the spectrum
CGContextSetAlpha(c, 1.0 - fabsf(0.5 - luminance));
CGContextBeginTransparencyLayer(c, NULL);
[self drawImage:[NSImage imageNamed:@"NSStopProgressTemplate"]
withFrame:closeRect
inView:controlView];
CGContextEndTransparencyLayer(c);
}

- (void)highlight:(BOOL)flag withFrame:(NSRect)cellFrame
inView:(NSView *)controlView {
- (void)highlight:(BOOL)flag
withFrame:(NSRect)cellFrame
inView:(NSView *)controlView {
// Don't do normal highlighting
}

Expand Down
14 changes: 13 additions & 1 deletion chrome/chrome.gyp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -494,6 +494,8 @@
'browser/cocoa/tab_cell.mm',
'browser/cocoa/tab_contents_controller.h',
'browser/cocoa/tab_contents_controller.mm',
# 'browser/cocoa/tab_controller.h',
# 'browser/cocoa/tab_controller.mm',
'browser/cocoa/tab_strip_controller.h',
'browser/cocoa/tab_strip_controller.mm',
'browser/cocoa/tab_strip_view.h',
Expand Down Expand Up @@ -1194,7 +1196,16 @@
'browser/dom_ui/dev_tools_ui.cc',
'browser/dom_ui/dev_tools_ui.h',
],
}],
'sources': [
# Build the necessary GTM sources
'../third_party/GTM/AppKit/GTMTheme.m',
'../third_party/GTM/AppKit/GTMNSColor+Luminance.m',
],
'include_dirs': [
'../third_party/GTM',
'../third_party/GTM/AppKit',
],
}],
['OS=="win"', {
'defines': [
'__STD_C',
Expand Down Expand Up @@ -1423,6 +1434,7 @@
'app/nibs/en.lproj/BrowserWindow.xib',
'app/nibs/en.lproj/MainMenu.xib',
'app/nibs/en.lproj/TabContents.xib',
# 'app/nibs/en.lproj/TabView.xib',
'app/theme/back.pdf',
'app/theme/forward.pdf',
'app/theme/go.pdf',
Expand Down

0 comments on commit 7e7b09d

Please sign in to comment.