iOS:变色圆形按钮
Posted
技术标签:
【中文标题】iOS:变色圆形按钮【英文标题】:iOS: Color-changing circle button 【发布时间】:2013-06-10 20:58:09 【问题描述】:我正在尝试制作一个显示/隐藏颜色选择滑块的按钮。这是最简单的部分。
我不知道该怎么做是让按钮成为一个带有轮廓的圆圈(比如黑色),填充是滑块中显示的颜色。当用户移动滑块时,圆圈的颜色会相应改变。
我是 ios 开发的新手,所以可能我处理这一切都错了。我真的很感激任何想法,即使它们与我在这里的想法完全不同。
我开始通过使用 QuartzCore 层的子类来解决这个问题,结果还不错,但是有些问题/事情困扰着我:
-
由于某种原因,我在按下按钮时没有高亮状态
用圆角来实现圆形显然很奇怪
不幸的是,在我绘制图层时,按钮尚未布局,因此我不得不硬编码半径,而不是根据按钮大小来制作半径。
所以,是的,我几乎不认为这种方法是理想的。我将不胜感激任何和所有的帮助。谢谢!
#import "ColorPickerButton.h"
@implementation ColorPickerButton
#pragma mark - UIButton Overrides
+ (ColorPickerButton *)buttonWithType:(UIButtonType)buttonType
return [super buttonWithType:UIButtonTypeCustom];
- (id)initWithCoder:(NSCoder *)aDecoder
self = [super initWithCoder:aDecoder];
if (self)
r = 0.3;
g = 0.6;
b = 0.9;
[self drawOutline];
[self drawColor];
return self;
- (id)initWithFrame:(CGRect)frame
self = [super initWithFrame:frame];
if (self)
// Initialization code
return self;
- (void)layoutSubviews
_outlineLayer.frame = CGRectInset(self.bounds, 5, 5);
_colorLayer.frame = CGRectInset(self.bounds, 5+_outlineLayer.borderWidth, 5+_outlineLayer.borderWidth);
[super layoutSubviews];
#pragma mark - Layer setters
- (void)drawOutline
if (!_outlineLayer)
_outlineLayer = [CALayer layer];
_outlineLayer.cornerRadius = 20.0;
_outlineLayer.borderWidth = 3;
_outlineLayer.borderColor = [[UIColor colorWithRed:170.0/255.0 green:170.0/255.0 blue:170.0/255.0 alpha:1.0] CGColor];
_outlineLayer.opacity = 0.6;
[self.layer insertSublayer:_outlineLayer atIndex:1];
- (void)drawColor
if (!_colorLayer)
_colorLayer = [CALayer layer];
_colorLayer.cornerRadius = 16.0;
_colorLayer.backgroundColor = [[UIColor colorWithRed:r green:g blue:b alpha:1.0] CGColor];
_colorLayer.opacity = 1.0;
[self.layer insertSublayer:_colorLayer atIndex:2];
- (void)changeColorWithRed:(CGFloat)red green:(CGFloat)green blue:(CGFloat)blue
r = red;
g = green;
b = blue;
[self drawColor];
@end
【问题讨论】:
同意虽然这不是创建边框的最佳方式,但您始终可以使用圆角来实现所需的目标。它好的一个原因是您不会绘制不必要的边框,因为与圆角相比,这是一项相当繁重的操作。 【参考方案1】:我们在我们的应用程序中执行此操作。我们在按钮上使用 CALayer 并添加 1/2 组件宽度大小的圆角。我们为按钮添加边框,然后设置按钮背景颜色以实现“填充”颜色。效果很好。
【讨论】:
以上是关于iOS:变色圆形按钮的主要内容,如果未能解决你的问题,请参考以下文章