diff --git a/AppKit/CPComboBox.j b/AppKit/CPComboBox.j index 3620ca192..25792624b 100644 --- a/AppKit/CPComboBox.j +++ b/AppKit/CPComboBox.j @@ -34,7 +34,7 @@ CPComboBoxStateButtonBordered = CPThemeState("button-bordered"); var CPComboBoxTextSubview = @"text", CPComboBoxButtonSubview = @"button", CPComboBoxDefaultNumberOfVisibleItems = 5, - CPComboBoxFocusWidth = 2; + CPComboBoxFocusRingWidth = -1; @implementation CPComboBox : CPTextField @@ -60,7 +60,7 @@ var CPComboBoxTextSubview = @"text", + (id)themeAttributes { - return [CPDictionary dictionaryWithObjects:[CGSizeMake(21.0, 23.0)] forKeys:[@"popup-button-size"]]; + return [CPDictionary dictionaryWithObjectsAndKeys:_CGSizeMake(21.0, 29.0), @"popup-button-size"]; } + (Class)_binderClassForBinding:(CPString)theBinding @@ -413,7 +413,17 @@ var CPComboBoxTextSubview = @"text", [self makeList]; [self selectMatchingItem]; - [_list popUpRelativeToRect:[self borderFrame] view:self offset:CPComboBoxFocusWidth]; + + // Note the offset here is 1 less than the focus ring width because the outer edge + // of the focus ring is very transparent and it looks better if the list is closer. + if (CPComboBoxFocusRingWidth < 0) + { + var inset = [self borderInset]; + + CPComboBoxFocusRingWidth = inset.top; + } + + [_list popUpRelativeToRect:[self borderFrame] view:self offset:CPComboBoxFocusRingWidth - 1]; } /*! @ignore */ @@ -855,11 +865,15 @@ var CPComboBoxTextSubview = @"text", - (CGRect)popupButtonRectForBounds:(CGRect)bounds { - var inset = [self currentValueForThemeAttribute:@"border-inset"], + var inset = [self borderInset], buttonSize = [self currentValueForThemeAttribute:@"popup-button-size"]; - bounds.origin.x += _CGRectGetMaxX(bounds) - inset.right - buttonSize.width; + // The left edge of the button is the right edge of the content border rect + bounds.origin.x = CGRectGetMaxX(bounds) - inset.right; + + // The top edge of the button is the top edge of the content border rect bounds.origin.y += inset.top; + bounds.size.width = buttonSize.width; bounds.size.height = buttonSize.height; @@ -956,13 +970,14 @@ var CPComboBoxTextSubview = @"text", */ - (CGRect)borderFrame { - var borderInset = [self valueForThemeAttribute:@"border-inset"], + var inset = [self borderInset], + buttonSize = [self currentValueForThemeAttribute:@"popup-button-size"], frame = [self bounds]; - frame.origin.x += borderInset.left; - frame.origin.y += borderInset.top; - frame.size.width -= borderInset.left + borderInset.right; - frame.size.height -= borderInset.top + borderInset.bottom; + frame.origin.x += inset.left; + frame.origin.y += inset.top; + frame.size.width -= inset.left + inset.right - buttonSize.width; + frame.size.height -= inset.top + inset.bottom; return frame; } diff --git a/AppKit/CPTextField.j b/AppKit/CPTextField.j index 906c52f05..d3a278282 100644 --- a/AppKit/CPTextField.j +++ b/AppKit/CPTextField.j @@ -1297,9 +1297,9 @@ CPTextFieldStatePlaceholder = CPThemeState("placeholder"); - (CGRect)contentRectForBounds:(CGRect)bounds { - var contentInset = [self currentValueForThemeAttribute:@"content-inset"] || CGInsetMakeZero(), - borderInset = [self currentValueForThemeAttribute:@"border-inset"] || CGInsetMakeZero(), - textInset = CGInsetUnion(contentInset, borderInset); + var borderInset = [self borderInset], + contentInset = [self currentValueForThemeAttribute:@"content-inset"], + textInset = CGInsetUnion(borderInset, contentInset); bounds.origin.x += textInset.left; bounds.origin.y += textInset.top; @@ -1324,6 +1324,14 @@ CPTextFieldStatePlaceholder = CPThemeState("placeholder"); return bounds; } +- (CGInset)borderInset +{ + var bezelInset = [self currentValueForThemeAttribute:@"bezel-inset"], + borderInset = [self currentValueForThemeAttribute:@"border-inset"]; + + return CGInsetUnion(bezelInset, borderInset); +} + - (CGRect)rectForEphemeralSubviewNamed:(CPString)aName { if (aName === "bezel-view") diff --git a/AppKit/Themes/Aristo/ThemeDescriptors.j b/AppKit/Themes/Aristo/ThemeDescriptors.j index 6f53d08a6..f7caaa382 100755 --- a/AppKit/Themes/Aristo/ThemeDescriptors.j +++ b/AppKit/Themes/Aristo/ThemeDescriptors.j @@ -811,26 +811,31 @@ var themedButtonValues = nil, [@"bezel-color", bezelDisabledColor, CPThemeStateBezeled | CPThemeStateDisabled], [@"font", [CPFont systemFontOfSize:12.0], CPThemeStateBezeled], - [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 5.0), CPThemeStateBezeled], - [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 5.0), CPThemeStateBezeled | CPThemeStateEditing], + // no border + [@"bezel-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0)], + [@"border-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0)], + [@"content-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0)], + + // with border [@"bezel-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0), CPThemeStateBezeled], [@"bezel-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0), CPThemeStateBezeled | CPThemeStateEditing], - - // Because the bezel artwork does not use insets, provide an inset to the border [@"border-inset", CGInsetMake(3.0, 3.0, 3.0, 3.0), CPThemeStateBezeled], + [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 5.0), CPThemeStateBezeled], + [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 5.0), CPThemeStateBezeled | CPThemeStateEditing], [@"text-color", textDisabledColor, CPThemeStateBezeled | CPThemeStateDisabled], [@"text-color", placeholderColor, CPTextFieldStatePlaceholder], [@"line-break-mode", CPLineBreakByTruncatingTail, CPThemeStateTableDataView], [@"vertical-alignment", CPCenterVerticalTextAlignment, CPThemeStateTableDataView], - [@"content-inset", CGInsetMake(0.0, 0.0, 0.0, 2.0), CPThemeStateTableDataView], + [@"border-inset", CGInsetMake(3.0, 3.0, 3.0, 3.0), CPThemeStateTableDataView], + [@"content-inset", CGInsetMake(0.0, 0.0, 0.0, 3.0), CPThemeStateTableDataView], [@"text-color", [CPColor colorWithCalibratedWhite:51.0 / 255.0 alpha:1.0], CPThemeStateTableDataView], [@"text-color", [CPColor whiteColor], CPThemeStateTableDataView | CPThemeStateSelectedTableDataView], [@"font", [CPFont boldSystemFontOfSize:12.0], CPThemeStateTableDataView | CPThemeStateSelectedTableDataView], [@"text-color", [CPColor blackColor], CPThemeStateTableDataView | CPThemeStateEditing], - [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 2.0), CPThemeStateTableDataView | CPThemeStateEditing], + [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 4.0), CPThemeStateTableDataView | CPThemeStateEditing], [@"font", [CPFont systemFontOfSize:12.0], CPThemeStateTableDataView | CPThemeStateEditing], [@"bezel-inset", CGInsetMake(-1.0, -1.0, -1.0, -1.0), CPThemeStateTableDataView | CPThemeStateEditing], @@ -838,7 +843,7 @@ var themedButtonValues = nil, [@"text-color", [CPColor colorWithCalibratedWhite:1.0 alpha:1.0], CPThemeStateTableDataView | CPThemeStateGroupRow | CPThemeStateSelectedTableDataView], [@"text-shadow-color", [CPColor whiteColor], CPThemeStateTableDataView | CPThemeStateGroupRow], [@"text-shadow-offset", CGSizeMake(0,1), CPThemeStateTableDataView | CPThemeStateGroupRow], - [@"text-shadow-color", [CPColor colorWithCalibratedWhite:0.0 alpha:0.6], CPThemeStateTableDataView | CPThemeStateGroupRow | CPThemeStateSelectedTableDataView], + [@"text-shadow-color", [CPColor colorWithCalibratedWhite:0.0 alpha:0.6], CPThemeStateTableDataView | CPThemeStateGroupRow | CPThemeStateSelectedTableDataView], [@"font", [CPFont boldSystemFontOfSize:12.0], CPThemeStateTableDataView | CPThemeStateGroupRow] ]; @@ -890,15 +895,15 @@ var themedButtonValues = nil, [@"bezel-color", bezelDisabledColor, CPTextFieldStateRounded | CPThemeStateBezeled | CPThemeStateDisabled], [@"font", [CPFont systemFontOfSize:12.0]], - [@"content-inset", CGInsetMake(5.0, 12.0, 4.0, 12.0), CPTextFieldStateRounded | CPThemeStateBezeled], - [@"content-inset", CGInsetMake(5.0, 12.0, 4.0, 12.0), CPTextFieldStateRounded | CPThemeStateBezeled | CPThemeStateEditing], - [@"bezel-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0), CPTextFieldStateRounded | CPThemeStateBezeled], [@"bezel-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0), CPTextFieldStateRounded | CPThemeStateBezeled | CPThemeStateEditing], - // Because the bezel artwork does not use insets, provide an inset to the border. // There is one extra empty pixel at the bottom for size compatibility with an earlier version. - [@"border-inset", CGInsetMake(3.0, 3.0, 4.0, 3.0), CPThemeStateBezeled], + [@"border-inset", CGInsetMake(3.0, 10.0, 4.0, 10.0), CPTextFieldStateRounded | CPThemeStateBezeled], + [@"border-inset", CGInsetMake(3.0, 10.0, 4.0, 10.0), CPTextFieldStateRounded | CPThemeStateBezeled | CPThemeStateEditing], + + [@"content-inset", CGInsetMake(4.0, 5.0, 3.0, 5.0), CPTextFieldStateRounded | CPThemeStateBezeled], + [@"content-inset", CGInsetMake(4.0, 5.0, 3.0, 5.0), CPTextFieldStateRounded | CPThemeStateBezeled | CPThemeStateEditing], [@"text-color", placeholderColor, CPTextFieldStateRounded | CPTextFieldStatePlaceholder], @@ -936,13 +941,13 @@ var themedButtonValues = nil, [@"content-inset", CGInsetMake(2.0, 5.0, 1.0, 5.0)], // Non-bezeled token field with no tokens - [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 5.0), CPTextFieldStatePlaceholder], + [@"content-inset", CGInsetMake(4.0, 5.0, 3.0, 5.0), CPTextFieldStatePlaceholder], // Bezeled token field with tokens [@"content-inset", CGInsetMake(3.0, 5.0, 2.0, 5.0), CPThemeStateBezeled], // Bezeled token field with no tokens - [@"content-inset", CGInsetMake(5.0, 5.0, 4.0, 5.0), CPThemeStateBezeled | CPTextFieldStatePlaceholder], + [@"content-inset", CGInsetMake(4.0, 5.0, 3.0, 5.0), CPThemeStateBezeled | CPTextFieldStatePlaceholder], ]; [self registerThemeValues:overrides forView:tokenfield inherit:themedTextFieldValues]; @@ -982,8 +987,8 @@ var themedButtonValues = nil, [@"text-color", textHighlightedColor, CPThemeStateHighlighted], [@"bezel-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0), CPThemeStateBezeled], - [@"border-inset", CGInsetMakeZero(), CPThemeStateBezeled], - [@"content-inset", CGInsetMake(0.0, 26.0, 0.0, 15.0), CPThemeStateBezeled], + [@"border-inset", CGInsetMake(1.0, 23.0, 3.0, 15.0), CPThemeStateBezeled], + [@"content-inset", CGInsetMake(0.0, 0.0, 0.0, 0.0), CPThemeStateBezeled], // Minimum height == maximum height since tokens are fixed height. [@"min-size", CGSizeMake(0.0, 19.0)], @@ -1085,15 +1090,16 @@ var themedButtonValues = nil, [@"bezel-color", bezelNoBorderFocusedColor, CPThemeStateBezeled | CPThemeStateEditing], [@"bezel-color", bezelNoBorderDisabledColor, CPThemeStateBezeled | CPThemeStateDisabled], - // The right border inset has to make room for the popup button - [@"border-inset", CGInsetMake(3.0, 21.0, 3.0, 3.0), CPThemeStateBezeled | CPComboBoxStateButtonBordered], - [@"border-inset", CGInsetMake(3.0, 17.0, 3.0, 3.0), CPThemeStateBezeled], + // The right border inset has to make room for the focus ring and popup button + [@"border-inset", CGInsetMake(3.0, 24.0, 3.0, 3.0), CPThemeStateBezeled | CPComboBoxStateButtonBordered], + [@"border-inset", CGInsetMake(3.0, 21.0, 3.0, 3.0), CPThemeStateBezeled], + + [@"popup-button-size", CGSizeMake(21.0, 23.0), CPThemeStateBezeled | CPComboBoxStateButtonBordered], + [@"popup-button-size", CGSizeMake(17.0, 23.0), CPThemeStateBezeled], // Because combo box uses a three-part bezel, the height is fixed [@"min-size", CGSizeMake(0, 29.0)], - [@"max-size", CGSizeMake(-1, 29.0)], - - [@"popup-button-size", CGSizeMake(21.0, 23.0)] + [@"max-size", CGSizeMake(-1, 29.0)] ]; [self registerThemeValues:overrides forView:combo inherit:themedTextFieldValues]; diff --git a/AppKit/_CPPopUpList.j b/AppKit/_CPPopUpList.j index ae227bb06..8bc725bb1 100644 --- a/AppKit/_CPPopUpList.j +++ b/AppKit/_CPPopUpList.j @@ -178,7 +178,7 @@ var ListColumnIdentifier = @"1"; [table setColumnAutoresizingStyle:CPTableViewLastColumnOnlyAutoresizingStyle]; [table setUsesAlternatingRowBackgroundColors:NO]; [table setAllowsMultipleSelection:NO]; - [table setIntercellSpacing:CGSizeMake(0, 0)]; + [table setIntercellSpacing:CGSizeMake(3, 2)]; [table setTarget:self]; [table setDoubleAction:@selector(tableViewClickAction:)]; [table setAction:@selector(tableViewClickAction:)]; @@ -284,7 +284,8 @@ var ListColumnIdentifier = @"1"; if ([_panel isVisible]) return; - var frame = CGRectMake(0, 0, MAX(_listWidth, CGRectGetWidth(aRect)), [self rowHeightForTableView:_tableView] * [self numberOfRowsInTableView:_tableView]); + var rowRect = [_tableView rectOfRow:[self numberOfRowsInTableView:_tableView] - 1], + frame = CGRectMake(0, 0, MAX(_listWidth, CGRectGetWidth(aRect)), CGRectGetMaxY(rowRect)); // Place the frame relative to aRect and constrain it to the screen bounds frame = [self constrain:frame relativeToRect:aRect view:aView offset:offset]; @@ -310,7 +311,7 @@ var ListColumnIdentifier = @"1"; // Convert from the view's coordinate system to the coordinate system of the primary platform window var baseOrigin = [aView convertPointToBase:aRect.origin], windowOrigin = [[aView window] convertBaseToPlatformWindow:baseOrigin], - rowHeight = [self rowHeightForTableView:_tableView], + rowHeight = [self rowHeightForTableView:_tableView] + [_tableView intercellSpacing].height, // Be sure to clip the number of displayed rows to what the field wants numberOfRows = MIN([self numberOfRowsInTableView:_tableView], [_delegate numberOfVisibleItems]),