Add an opacity slider to the color panel

This commit is contained in:
Ross Boucher committed 2009-04-16 22:51:47 -07:00
1 parent f4e329f5de
commit 6d8d4b59cc
4 files changed
+74 -35

No files matched your search

+12 -7
View File
@@ -148,9 +148,14 @@ var cachedBlackColor,
@return the initialized color
*/
+ (CPColor)colorWithHue:(float)hue saturation:(float)saturation brightness:(float)brightness
{
return [self colorWithHue:hue saturation:saturation brightness:brightness alpha:1.0];
}
+ (CPColor)colorWithHue:(float)hue saturation:(float)saturation brightness:(float)brightness alpha:(float)alpha
{
if(saturation === 0.0)
return [CPColor colorWithCalibratedWhite:brightness / 100.0 alpha:1.0];
return [CPColor colorWithCalibratedWhite:brightness / 100.0 alpha:alpha];
var f = hue % 60,
p = (brightness * (100 - saturation)) / 10000,
@@ -160,12 +165,12 @@ var cachedBlackColor,
switch(FLOOR(hue / 60))
{
case 0: return [CPColor colorWithCalibratedRed: b green: t blue: p alpha: 1.0];
case 1: return [CPColor colorWithCalibratedRed: q green: b blue: p alpha: 1.0];
case 2: return [CPColor colorWithCalibratedRed: p green: b blue: t alpha: 1.0];
case 3: return [CPColor colorWithCalibratedRed: p green: q blue: b alpha: 1.0];
case 4: return [CPColor colorWithCalibratedRed: t green: p blue: b alpha: 1.0];
case 5: return [CPColor colorWithCalibratedRed: b green: p blue: q alpha: 1.0];
case 0: return [CPColor colorWithCalibratedRed: b green: t blue: p alpha: alpha];
case 1: return [CPColor colorWithCalibratedRed: q green: b blue: p alpha: alpha];
case 2: return [CPColor colorWithCalibratedRed: p green: b blue: t alpha: alpha];
case 3: return [CPColor colorWithCalibratedRed: p green: q blue: b alpha: alpha];
case 4: return [CPColor colorWithCalibratedRed: t green: p blue: b alpha: alpha];
case 5: return [CPColor colorWithCalibratedRed: b green: p blue: q alpha: alpha];
}
}
+48 -20
View File
@@ -63,20 +63,19 @@ CPColorPickerViewHeight = 370;
_CPColorPanelToolbar _toolbar;
_CPColorPanelSwatches _swatchView;
_CPColorPanelPreview _previewView;
CPTextField _previewLabel;
CPTextField _swatchLabel;
CPSlider _opacitySlider;
CPArray _colorPickers;
CPView _currentView;
id _activePicker;
CPView _currentView;
id _activePicker;
CPColor _color;
id _target;
SEL _action;
int _mode;
SEL _action;
int _mode;
}
/*!
@@ -115,7 +114,7 @@ CPColorPickerViewHeight = 370;
*/
- (id)init
{
self = [super initWithContentRect:CGRectMake(500.0, 50.0, 219.0, 322.0)
self = [super initWithContentRect:CGRectMake(500.0, 50.0, 219.0, 370.0)
styleMask:(CPTitledWindowMask | CPClosableWindowMask | CPResizableWindowMask)];
if (self)
@@ -153,6 +152,7 @@ CPColorPickerViewHeight = 370;
object:self];
[_activePicker setColor:_color];
[_opacitySlider setFloatValue:[_color alphaComponent]];
}
/*!
@@ -176,6 +176,11 @@ CPColorPickerViewHeight = 370;
return _color;
}
- (float)opacity
{
return [_opacitySlider floatValue];
}
/*!
Sets the target for the color panel. Messages are sent
to the target when colors are selected in the panel.
@@ -236,7 +241,7 @@ CPColorPickerViewHeight = 370;
[view setFrame:[_currentView frame]];
else
{
var height = (TOOLBAR_HEIGHT+10+PREVIEW_HEIGHT+5+SWATCH_HEIGHT+10),
var height = (TOOLBAR_HEIGHT+10+PREVIEW_HEIGHT+5+SWATCH_HEIGHT+32),
bounds = [[self contentView] bounds];
[view setFrameSize: CPSizeMake(bounds.size.width - 10, bounds.size.height - height)];
@@ -330,7 +335,7 @@ CPColorPickerViewHeight = 370;
[previewBox addSubview:_previewView];
_previewLabel = [[CPTextField alloc] initWithFrame: CPRectMake(10, TOOLBAR_HEIGHT + 13, 60, 15)];
var _previewLabel = [[CPTextField alloc] initWithFrame: CPRectMake(10, TOOLBAR_HEIGHT + 10, 60, 15)];
[_previewLabel setStringValue: "Preview:"];
[_previewLabel setTextColor:[CPColor blackColor]];
[_previewLabel setAlignment:CPRightTextAlignment];
@@ -348,17 +353,32 @@ CPColorPickerViewHeight = 370;
[swatchBox addSubview:_swatchView];
_swatchLabel = [[CPTextField alloc] initWithFrame: CPRectMake(10, TOOLBAR_HEIGHT + 8 + PREVIEW_HEIGHT + 7, 60, 15)];
var _swatchLabel = [[CPTextField alloc] initWithFrame: CPRectMake(10, TOOLBAR_HEIGHT + 8 + PREVIEW_HEIGHT + 6, 60, 15)];
[_swatchLabel setStringValue: "Swatches:"];
[_swatchLabel setTextColor:[CPColor blackColor]];
[_swatchLabel setAlignment:CPRightTextAlignment];
[contentView addSubview: _toolbar];
[contentView addSubview: previewBox];
[contentView addSubview: _previewLabel];
[contentView addSubview: swatchBox];
[contentView addSubview: _swatchLabel];
var opacityLabel = [[CPTextField alloc] initWithFrame: CPRectMake(10, TOOLBAR_HEIGHT + PREVIEW_HEIGHT + 35, 60, 20)];
[opacityLabel setStringValue: "Opacity:"];
[opacityLabel setTextColor:[CPColor blackColor]];
[opacityLabel setAlignment:CPRightTextAlignment];
_opacitySlider = [[CPSlider alloc] initWithFrame:CGRectMake(76, TOOLBAR_HEIGHT + PREVIEW_HEIGHT + 34, CGRectGetWidth(bounds) - 86, 20.0)];
[_opacitySlider setMinValue:0.0];
[_opacitySlider setMaxValue:1.0];
[_opacitySlider setTarget:self];
[_opacitySlider setAction:@selector(setOpacity:)];
[contentView addSubview:_toolbar];
[contentView addSubview:previewBox];
[contentView addSubview:_previewLabel];
[contentView addSubview:swatchBox];
[contentView addSubview:_swatchLabel];
[contentView addSubview:opacityLabel];
[contentView addSubview:_opacitySlider];
_target = nil;
_action = nil;
@@ -370,6 +390,14 @@ CPColorPickerViewHeight = 370;
[self _setPicker:buttonForLater];
}
- (void)setOpacity:(id)sender
{
var components = [[self color] components],
alpha = [sender floatValue];
[self setColor:[_color colorWithAlphaComponent:alpha] updatePicker:YES];
}
@end
+4 -1
View File
@@ -151,7 +151,10 @@
[_hueSaturationView setWheelBrightness:brightness / 100.0];
[_brightnessSlider setBackgroundColor:[CPColor colorWithHue:hue saturation:saturation brightness:100]];
_cachedColor = [CPColor colorWithHue:hue saturation:saturation brightness:brightness];
var colorPanel = [self colorPanel],
opacity = [colorPanel opacity];
_cachedColor = [CPColor colorWithHue:hue saturation:saturation brightness:brightness alpha:opacity];
[[self colorPanel] setColor:_cachedColor];
}
+10 -7
View File
@@ -257,15 +257,15 @@
brightnessValue._DOMElement.appendChild(_brightnessValue);
[_contentView addSubview: brightnessValue];
_hexLabel = [[CPTextField alloc] initWithFrame: CPRectMake(0, 230, 100, 20)];
_hexLabel = [[CPTextField alloc] initWithFrame: CPRectMake(0, 230, 30, 20)];
[_hexLabel setStringValue: "Hex"];
[_hexLabel setTextColor:[CPColor blackColor]];
//hex input box
_hexValue = _redValue.cloneNode(false);
_hexValue.style.top = "255px";
_hexValue.style.top = "228px";
_hexValue.style.width = "80px";
_hexValue.style.left = "0px";
_hexValue.style.left = "35px";
_hexValue.onkeypress = function(aDOMEvent)
{
aDOMEvent = aDOMEvent || window.event;
@@ -329,7 +329,9 @@
-(void)sliderChanged:(id)sender
{
var newColor;
var newColor,
colorPanel = [self colorPanel],
alpha = [colorPanel opacity];
switch(sender)
{
@@ -337,7 +339,8 @@
case _saturationSlider:
case _brightnessSlider: newColor = [CPColor colorWithHue: [_hueSlider floatValue]
saturation: [_saturationSlider floatValue]
brightness: [_brightnessSlider floatValue]];
brightness: [_brightnessSlider floatValue]
alpha: alpha];
[self updateRGBSliders: newColor];
break;
@@ -347,7 +350,7 @@
case _blueSlider: newColor = [CPColor colorWithCalibratedRed: [_redSlider floatValue]
green: [_greenSlider floatValue]
blue: [_blueSlider floatValue]
alpha: 1.0];
alpha: alpha];
[self updateHSBSliders: newColor];
break;
@@ -355,7 +358,7 @@
[self updateLabels];
[self updateHex: newColor];
[[self colorPanel] setColor: newColor];
[colorPanel setColor: newColor];
}
-(void)setColor:(CPColor)aColor