您的位置:首页 > 产品设计 > UI/UE

UIView的背景渐变

2013-10-29 15:26 537 查看
//绘制背景渐变

/*

CGCradientCreateWithColorComponents函数需要四个参数:

色彩空间:(Color Space)这是一个色彩范围的容器,类型必须是CGColorSpaceRef.对于这个参数,我们可以传入CGColorSpaceCreateDeviceRGB函数的返回值,它将给我们一个RGB色彩空间。

颜色分量的数组:这个数组必须包含CGFloat类型的红、绿、蓝和alpha值。数组中元素的数量和接下来两个参数密切。从本质来讲,你必须让这个数组包含足够的值,用来指定第四个参数中位置的数量。所以如果你需要两个位置位置(起点和终点),那么你必须为数组提供两种颜色

位置数组,颜色数组中各个颜色的位置:此参数控制该渐变从一种颜色过渡到另一种颜色的速度有多快。

位置的数量:这个参数指明了我们需要多少颜色和位置。

*/

CGColorSpaceRef rgb = CGColorSpaceCreateDeviceRGB();

CGFloat colors[] =

{

51.0 / 255.0, 160.0 / 255.0, 0.0 / 255.0, 1.00,

68.0 / 255.0, 198.0 / 255.0, 0.0 / 255.0, 1.00,

//        0.0 / 255.0,  50.0 / 255.0, 126.0 / 255.0, 1.00,

};

CGGradientRef myGradient = CGGradientCreateWithColorComponents

(rgb, colors, NULL, sizeof(colors)/(sizeof(colors[0])*4));

// Allocate bitmap context

CGContextRef bitmapContext = CGBitmapContextCreate(NULL, 320, TITLE_CONTROL_HEIGHT, 8, 4 * 320, CGColorSpaceCreateDeviceRGB(), kCGImageAlphaNoneSkipFirst);

// Draw Gradient Here

/*

创建好线性渐变后,我们将使用CGContextDrawLinearGradient过程在图形上下文中绘制,此过程需要五个参数:

Graphics context 指定用于绘制线性渐变的图形上下文。

Axial gradient 我们使用CGGradientCreateWithColorComponents函数创建的线性渐变对象的句柄

start point 图形上下文中的一个CGPoint类型的点,表示渐变的起点。

End Point表示渐变的终点。

Gradient drawing options 当你的起点或者终点不在图形上下文的边缘内时,指定该如何处理。你可以使用你的开始或结束颜色来填充渐变以外的空间。此参数为以下值之一:KCGGradientDrawsAfterEndLocation扩展整个渐变到渐变的终点之后的所有点 KCGGradientDrawsBeforeStartLocation扩展整个渐变到渐变的起点之前的所有点。0不扩展该渐变。

*/

CGContextDrawLinearGradient(bitmapContext, myGradient, CGPointMake(160.0f, 0.0f),CGPointMake(160.0f, TITLE_CONTROL_HEIGHT),  kCGGradientDrawsBeforeStartLocation);

// Create a CGImage from context

CGImageRef cgImage = CGBitmapContextCreateImage(bitmapContext);

// Create a UIImage from CGImage

UIImage *uiImage = [UIImage imageWithCGImage:cgImage];

// Release the CGImage

CGImageRelease(cgImage);

// Release the bitmap context

CGContextRelease(bitmapContext);

// Create the patterned UIColor and set as background color

[titleScrollViewsetBackgroundColor:[UIColorcolorWithPatternImage:uiImage]];
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: