UIView和UILabels在iPhone上的渐变

Question

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

我的应用程序需要在a UIView或者背景中显示文本,UILabel但是背景必须是渐变而不是true UIColor.使用图形程序创建所需的外观并不好,因为文本可能会根据从服务器返回的数据而有所不同.

有谁知道解决这个问题的最快方法？非常感谢您的想法.

Answer 1

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

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

 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文档.您可以选择指定起点和终点(如果您不希望从顶部到底部直线的线性渐变),甚至可以指定映射到每种颜色的特定位置.

Answer 2

您可以使用Core Graphics绘制渐变,如Mike的回应中所指出的那样.作为一个更详细的示例,您可以创建一个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); 
}

此特定示例创建一个白色,光泽样式的渐变,从其顶部UIView到其垂直中心绘制.您可以将UIView's 设置为backgroundColor您喜欢的任何颜色,并且该颜色将在该颜色之上绘制.您还可以使用该CGContextDrawRadialGradient函数绘制径向渐变.

您只需要UIView适当调整大小并将其添加UILabel为子视图以获得您想要的效果.

编辑(4/23/2009):根据St3fan的建议,我已经用代码中的边界替换了视图的框架.这可以纠正视图原点不是(0,0)的情况.

Answer 3

使用时CAGradientLayer,相反CGGradient,渐变不平滑,但有明显的步进.看到:

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

Answer 4

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

Answer 5

Mirko Froehlich的回答对我有用,除非我想使用自定义颜色.诀窍是指定具有色调,饱和度和亮度而不是RGB的UI颜色.

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颜色选择器并转到HSB选项卡.Hue在此视图中以度为单位进行度量,因此将值除以360以获得您要在代码中输入的值.

Answer 6

这就是我的工作 - 将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];