2013-11-04 35 views
2

我想创建一个自定义的UIButton渐变背景。我附上了一些关于要求的图片。
enter image description here
enter image description here如何为UIButton设置自定义渐变背景?

但我的渐变背景是不是如我所料。

enter image description here

我的问题是如何设置渐变的位置或位置? (从顶部到中心,然后从中心到底部)。

这里是我的代码:

- (void)setBlueShiningLayer { 
    CALayer *buttonLayer = self.layer; 
    [buttonLayer setMasksToBounds:YES]; 
    [buttonLayer setCornerRadius:5.0]; 
    [buttonLayer setBorderWidth:1.0f]; 
    [buttonLayer setBorderColor:[UIColor colorWithRed:153.0f/255.0f green:153.0f/255.0f blue:153.0f/255.0f alpha:1.0f].CGColor]; 

    CAGradientLayer *gradientLayer = [CAGradientLayer layer]; 
    [gradientLayer setBounds:self.bounds]; 
    NSArray *colors = [NSArray arrayWithObjects: 
      (id) [UIColor colorWithRed:129.0f/255.0f green:151.0f/255.0f blue:179.0f/255.0f alpha:0.8f].CGColor, // top 
      (id) [UIColor colorWithRed:111.0f/245.0f green:133.0f/255.0f blue:162.0f/255.0f alpha:0.4f].CGColor, // center 
      (id) [UIColor colorWithRed:95.0f/245.0f green:118.0f/255.0f blue:151.0f/255.0f alpha:0.4f].CGColor, // center 
      (id) [UIColor colorWithRed:75.0f/245.0f green:99.0f/255.0f blue:133.0f/255.0f alpha:0.8f].CGColor, // bottom 
      nil]; 

    [gradientLayer setPosition:CGPointMake([self bounds].size.width/2, [self bounds].size.height/2)]; 
    [gradientLayer setColors:colors]; 
    [buttonLayer insertSublayer:gradientLayer atIndex:0]; 

    [self setTitleColor:[UIColor colorWithRed:0.0f green:0.0f blue:0.0f alpha:1.0f] forState:UIControlStateNormal]; 
    [self setTintColor:[UIColor colorWithRed:0.0f green:0.0f blue:0.0f alpha:0.3f]]; 
} 
+0

我的回答是否对您的问题进行排序? – Fogmeister

回答

2

它看起来像梯度层均匀地间隔出来的颜色。这就是为什么你会得到你所得到的效果。

要解决此问题,您可以使用CAGradientLayerlocations属性。

就像这个...

gradientLayer.locations = @[@0, @0.5, @0.5, @1.0]; 

TBH,具有UIButton做到这一点,最简单的方法是使用图像。

只需使用所需的渐变和边框创建按钮图像,然后将其添加到背景图像中。

如果您需要以不同的尺寸使用它,您可以创建可调整大小的图像。

+0

现在非常感谢它,但是我必须将最后的位置设置为0。我同意你使用图像,但设计师给我的RGB而不是图片:) – kameny