UIView和UILabels在iPhone上的渐变

可能重复:
在iPhone应用程序中手动绘制渐变?

我的应用程序需要在UIViewUILabel显示文本,但是背景必须是渐变而不是真正的UIColor 。 使用graphics程序创build所需的外观并不好,因为文本可能因服务器返回的数据而异。

有没有人知道最快的方法来解决这个问题? 你的想法是不胜感激。

您还可以使用一个像素宽的graphics图像作为渐变,并将视图属性设置为展开graphics以填充视图(假设您正在考虑一个简单的线性渐变而不是某种径向graphics)。

我意识到这是一个较旧的线程,但供将来参考:

从iPhone SDK 3.0开始,通过使用新的CAGradientLayer ,可以非常容易地实现自定义渐变,无需创build子类或图像:

  UIView *view = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 100)] autorelease]; CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.frame = view.bounds; gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor blackColor] CGColor], (id)[[UIColor whiteColor] CGColor], nil]; [view.layer insertSublayer:gradient atIndex:0]; 

看看CAGradientLayer文档。 您可以select指定开始点和结束点(以防您不希望从顶部到底部直线渐变),甚至指定映射到每种颜色的特定位置。

您可以使用Core Graphics绘制渐变,如Mike的回复中指出的那样。 作为一个更详细的例子,你可以创build一个UIView子类作为你的UILabel的背景。 在该UIView子类中,重写drawRect:方法并插入与以下内容类似的代码:

 - (void)drawRect:(CGRect)rect { CGContextRef currentContext = UIGraphicsGetCurrentContext(); CGGradientRef glossGradient; CGColorSpaceRef rgbColorspace; size_t num_locations = 2; CGFloat locations[2] = { 0.0, 1.0 }; CGFloat components[8] = { 1.0, 1.0, 1.0, 0.35, // Start color 1.0, 1.0, 1.0, 0.06 }; // End color rgbColorspace = CGColorSpaceCreateDeviceRGB(); glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations); CGRect currentBounds = self.bounds; CGPoint topCenter = CGPointMake(CGRectGetMidX(currentBounds), 0.0f); CGPoint midCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMidY(currentBounds)); CGContextDrawLinearGradient(currentContext, glossGradient, topCenter, midCenter, 0); CGGradientRelease(glossGradient); CGColorSpaceRelease(rgbColorspace); } 

这个特殊的例子创build了一个白色,光滑的渐变,从UIView的顶部绘制到其垂直中心。 你可以设置UIViewbackgroundColor为你喜欢的任何东西,这种光泽将被绘制在该颜色的顶部。 您也可以使用CGContextDrawRadialGradient函数绘制径向渐变。

你只需要适当地调整这个UIView大小,并添加你的UILabel作为子视图来获得你想要的效果。

编辑(2009年4月23日):根据St3fan的build议,我用代码中的边界代替了视图的框架。 这可以纠正视图的原点不是(0,0)的情况。

当使用CAGradientLayer ,与CGGradient ,渐变不是光滑的,而是有明显的步进。 看到 这个例子

为了得到更有吸引力的结果,最好使用CGGradient

Mirko Froehlich的答案为我工作,除了当我想使用自定义颜色。 窍门是用色调,饱和度和亮度来指定UI颜色,而不是RGB。

 CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.frame = myView.bounds; UIColor *startColour = [UIColor colorWithHue:.580555 saturation:0.31 brightness:0.90 alpha:1.0]; UIColor *endColour = [UIColor colorWithHue:.58333 saturation:0.50 brightness:0.62 alpha:1.0]; gradient.colors = [NSArray arrayWithObjects:(id)[startColour CGColor], (id)[endColour CGColor], nil]; [myView.layer insertSublayer:gradient atIndex:0]; 

要获得某种颜色的色调,饱和度和亮度,请使用内置的xcode颜色select器并转至HSB选项卡。 在这个视图中,色相是以度来衡量的,所以把这个值除以360得到你想要input的代码值。

这是我得到的工作 – 在xCode的IB设置UIButton透明/清除,没有BG图像。

 UIColor *pinkDarkOp = [UIColor colorWithRed:0.9f green:0.53f blue:0.69f alpha:1.0]; UIColor *pinkLightOp = [UIColor colorWithRed:0.79f green:0.45f blue:0.57f alpha:1.0]; CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.frame = [[shareWordButton layer] bounds]; gradient.cornerRadius = 7; gradient.colors = [NSArray arrayWithObjects: (id)pinkDarkOp.CGColor, (id)pinkLightOp.CGColor, nil]; gradient.locations = [NSArray arrayWithObjects: [NSNumber numberWithFloat:0.0f], [NSNumber numberWithFloat:0.7], nil]; [[recordButton layer] insertSublayer:gradient atIndex:0]; 

我用一个UIImageView的子视图来实现这个function。 ImageView指向的图像是一个渐变。 然后我在UIView中设置背景颜色,并且我有一个彩色的渐变视图。 接下来,我使用视图,我需要绘制的东西将在这个梯度视图下。 通过在ImageView上添加第二个视图,您可以select是否将graphics放在渐变的下方或上方。