Made CPTokenField themeable. Todo: the autocomplete drop-down is still hardcoded and Aristo style images are needed.

This commit is contained in:
Alexander Ljungberg
2010-10-02 19:36:24 -04:00
parent 656e0eb28e
commit 124a63736f
2 changed files with 66 additions and 51 deletions
+13 -51
View File
@@ -883,74 +883,27 @@ var CPTokenFieldTableColumnIdentifier = @"CPTokenFieldTableColumnIdentifier";
@end
_CPTokenFieldTokenDeleteImage = [[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_close.png" size:CPSizeMake(9.0, 9.0)];
_CPTokenFieldTokenDeleteImageHighlighted = [[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_close_active.png"
size:CPSizeMake(9.0, 9.0)];
_CPTokenFieldActiveTokenDeleteImage = [[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_active_close.png"
size:CPSizeMake(9.0, 9.0)];
_CPTokenFieldActiveTokenDeleteImageHighlighted = [[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_active_close_active.png"
size:CPSizeMake(9.0, 9.0)];
@implementation _CPTokenFieldToken : CPTextField
{
CPButton _deleteButton;
CPTokenField _tokenField;
_CPTokenFieldTokenCloseButton _deleteButton;
CPTokenField _tokenField;
}
- (id)initWithFrame:(CPRect)frame
{
if (self = [super initWithFrame:frame])
{
_deleteButton = [[CPButton alloc] initWithFrame:CPRectMakeZero()];
[_deleteButton setBordered:NO];
_deleteButton = [[_CPTokenFieldTokenCloseButton alloc] initWithFrame:CPRectMakeZero()];
[self addSubview:_deleteButton];
[self setEditable:NO];
[self setHighlighted:NO];
[self setBezeled:YES];
var bezelColor = [CPColor colorWithPatternImage:[[CPThreePartImage alloc] initWithImageSlices:
[
[[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_left.png" size:CPSizeMake(4.0, 21.0)],
[[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_middle.png" size:CPSizeMake(4.0, 21.0)],
[[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_right.png" size:CPSizeMake(4.0, 21.0)]
] isVertical:NO]];
bezelFocusedColor = [CPColor colorWithPatternImage:[[CPThreePartImage alloc] initWithImageSlices:
[
[[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_active_left.png" size:CPSizeMake(4.0, 21.0)],
[[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_active_middle.png" size:CPSizeMake(4.0, 21.0)],
[[CPImage alloc] initByReferencingFile:@"Resources/Menu/CPTokenField/token_active_right.png" size:CPSizeMake(4.0, 21.0)]
] isVertical:NO]];
[self setValue:[CPColor colorWithRed:41.0 / 255.0 green:51.0 / 255.0 blue:64.0 / 255.0 alpha:1.0] forThemeAttribute:@"text-color"];
[self setValue:bezelColor forThemeAttribute:@"bezel-color" inState:CPThemeStateBezeled];
[self setValue:bezelFocusedColor forThemeAttribute:@"bezel-color" inState:CPThemeStateBezeled|CPThemeStateHighlighted];
[self setValue:CGInsetMake(1.5, 0.0, 1.5, 0.0) forThemeAttribute:@"bezel-inset"];
[self setValue:CGInsetMake(2.0, 20.0, 1.0, 10.0) forThemeAttribute:@"content-inset"];
[self setValue:CPCenterTextAlignment forThemeAttribute:@"vertical-alignment"]
}
return self;
}
- (void)setHighlighted:(BOOL)isLit
{
[super setHighlighted:isLit];
if (!isLit)
{
[_deleteButton setImage:_CPTokenFieldTokenDeleteImage];
[_deleteButton setAlternateImage:_CPTokenFieldTokenDeleteImageHighlighted];
}
else
{
[_deleteButton setImage:_CPTokenFieldActiveTokenDeleteImage];
[_deleteButton setAlternateImage:_CPTokenFieldActiveTokenDeleteImageHighlighted];
}
}
- (CPTokenField)tokenField
{
return _tokenField;
@@ -999,4 +952,13 @@ _CPTokenFieldActiveTokenDeleteImageHighlighted = [[CPImage alloc] initByReferenc
[_tokenField _deleteToken:self];
}
@end
@end
/*
This class left empty on purpose as a theming hook.
*/
@implementation _CPTokenFieldTokenCloseButton : CPButton
{
}
@end
+53
View File
@@ -798,6 +798,59 @@ var themedButtonValues = nil,
return textfield;
}
+ (_CPTokenFieldToken)themedTokenFieldToken
{
var tokenfield = [[_CPTokenFieldToken alloc] initWithFrame:CGRectMake(0.0, 0.0, 60.0, 24.0)];
var bezelColor = [CPColor colorWithPatternImage:[[CPThreePartImage alloc] initWithImageSlices:
[
[_CPCibCustomResource imageResourceWithName:@"tokenfield-left.png" size:CPSizeMake(4.0, 21.0)],
[_CPCibCustomResource imageResourceWithName:@"tokenfield-middle.png" size:CPSizeMake(4.0, 21.0)],
[_CPCibCustomResource imageResourceWithName:@"tokenfield-right.png" size:CPSizeMake(4.0, 21.0)]
] isVertical:NO]];
bezelFocusedColor = [CPColor colorWithPatternImage:[[CPThreePartImage alloc] initWithImageSlices:
[
[_CPCibCustomResource imageResourceWithName:@"tokenfield-focused-left.png" size:CPSizeMake(4.0, 21.0)],
[_CPCibCustomResource imageResourceWithName:@"tokenfield-focused-middle.png" size:CPSizeMake(4.0, 21.0)],
[_CPCibCustomResource imageResourceWithName:@"tokenfield-focused-right.png" size:CPSizeMake(4.0, 21.0)]
] isVertical:NO]];
[tokenfield setValue:[CPColor colorWithRed:41.0 / 255.0 green:51.0 / 255.0 blue:64.0 / 255.0 alpha:1.0] forThemeAttribute:@"text-color"];
[tokenfield setValue:bezelColor forThemeAttribute:@"bezel-color" inState:CPThemeStateBezeled];
[tokenfield setValue:bezelFocusedColor forThemeAttribute:@"bezel-color" inState:CPThemeStateBezeled|CPThemeStateHighlighted];
[tokenfield setValue:CGInsetMake(2, 0.0, 2, 0.0) forThemeAttribute:@"bezel-inset" inState:CPThemeStateBezeled];
[tokenfield setValue:CGInsetMake(2.0, 20.0, 1.0, 10.0) forThemeAttribute:@"content-inset" inState:CPThemeStateBezeled];
[tokenfield setValue:CPCenterTextAlignment forThemeAttribute:@"vertical-alignment"]
return tokenfield;
}
+ (_CPTokenFieldTokenCloseButton)themedTokenFieldTokenCloseButton
{
var button = [[_CPTokenFieldTokenCloseButton alloc] initWithFrame:CGRectMake(0, 0, 9, 9)];
var bezelColor = PatternColor([[CPThreePartImage alloc] initWithImageSlices:
[
[_CPCibCustomResource imageResourceWithName:"tokenfield-close.png" size:CGSizeMake(9.0, 9.0)], nil, nil
]
isVertical:NO]),
bezelColorPushed = PatternColor([[CPThreePartImage alloc] initWithImageSlices:
[
[_CPCibCustomResource imageResourceWithName:"tokenfield-close-pushed.png" size:CGSizeMake(9.0, 9.0)], nil, nil
]
isVertical:NO]);
[button setValue:bezelColor forThemeAttribute:@"bezel-color" inState:CPThemeStateBordered];
[button setValue:bezelColorPushed forThemeAttribute:@"bezel-color" inState:CPThemeStateBordered|CPThemeStateHighlighted];
[button setValue:CGSizeMake(9.0, 9.0) forThemeAttribute:@"min-size"];
[button setValue:CGSizeMake(9.0, 9.0) forThemeAttribute:@"max-size"];
return button;
}
+ (CPRadioButton)themedRadioButton
{
var button = [CPRadio radioWithTitle:@"Hello Friend!"],