Iphone 如何在objective-c中绘制色轮

Iphone 如何在objective-c中绘制色轮,iphone,objective-c,Iphone,Objective C,我试图为iPhone绘制一个色轮,但我无法使渐变围绕一个点旋转。我尝试使用渐变,但objective-c提供了一个线性渐变,它在一条直线上绘制渐变,如下所示: 还有一个径向梯度,它从点开始绘制梯度,并向各个方向辐射,如下所示: 我想画一个围绕点旋转的线性渐变,如下所示: 我不知道有什么能帮到你。你可以从(黄色->红色,红色->紫色,紫色->蓝色,等等)开始,然后看一眼 很抱歉,我帮不上什么忙。我创建了一个大型RGBA位图,根据其转换为极坐标的位置为每个像素着色,然后将位图转换为图像并按比例缩

我试图为iPhone绘制一个色轮,但我无法使渐变围绕一个点旋转。我尝试使用渐变,但objective-c提供了一个线性渐变,它在一条直线上绘制渐变,如下所示:

还有一个径向梯度,它从点开始绘制梯度,并向各个方向辐射,如下所示:

我想画一个围绕点旋转的线性渐变,如下所示:


我不知道有什么能帮到你。你可以从(黄色->红色,红色->紫色,紫色->蓝色,等等)开始,然后看一眼


很抱歉,我帮不上什么忙。

我创建了一个大型RGBA位图,根据其转换为极坐标的位置为每个像素着色,然后将位图转换为图像并按比例缩小图像。缩小比例是为了帮助在中心附近进行抗锯齿像素化。

您必须按照hotpaw2的建议制作位图。最有效的计算方法是使用。这将允许您创建一个函数,该函数以像素位置作为输入并输出RGB值,只需使用一些基本的算术运算和一点三角运算即可进行计算

如果你想在轮子的“辐条”上使用任意颜色,那就需要更多的工作。你需要计算每个像素的混合值,这涉及到一个更为三角学的公平视野,而且速度没有那么快。当我这样做的时候,我必须对它进行矢量化和并行化,以消除重新计算位图时的轻微(尽管可以察觉)刷新延迟——在MacBookPro上。在iPhone上你没有这些选项,所以你不得不忍受延迟


如果您需要这些技术的更详细解释,请告诉我;我很乐意效劳。

下面在UIView子类中绘制了一个HSL色轮。它通过计算每个像素的正确颜色值来生成位图。这并不完全是你想要做的(看起来它只是一个恒定亮度/饱和度的圆圈中的色调变化),但是你应该能够根据你的需要调整它

请注意,这可能没有最佳性能,但它应该让您开始。此外,您还可以使用
getColorWheelValue()
处理用户输入(在给定坐标处单击/触摸)

-(void)drawRect:(CGRect)rect
{
int dim=self.bounds.size.width;//应始终为正方形。
bitmapData=CFDataCreateMutable(NULL,0);
CFDataSetLength(位图数据,尺寸*尺寸*4);
generateColorWheelBitmap(CFDataGetMutableBytePtr(bitmapData)),暗显,亮度;
UIImage*image=createUIImageWithRGBAData(位图数据,self.bounds.size.width,self.bounds.size.height);
CFRelease(位图数据);
[图像绘制点:CGPointZero];
[图片发布];
}
void generateColorWheelBitmap(UInt8*位图,整数宽度高度,浮点l)
{
//我想也许你可以做1/3的馅饼,然后做一些聪明的事情来生成另外两个部分,但现在我们要用蛮力来实现。
对于(int y=0;y0.99)a=(1.0-s)*100;
否则a=1.0;
HSL2RGB(h、s、l和r、g和b);
}
其他的
{
r=g=b=a=0.0f;
}
int i=4*(x+y*宽度和高度);
位图[i]=r*0xff;
位图[i+1]=g*0xff;
位图[i+2]=b*0xff;
位图[i+3]=a*0xff;
}
}
}
void getColorWheelValue(整数宽度高度、整数x、整数y、浮点*outH、浮点*outS)
{
int c=宽度/高度/2;
浮点数dx=(浮点数)(x-c)/c;
浮动dy=(浮动)(y-c)/c;
float d=sqrtf((float)(dx*dx+dy*dy));
*outS=d;
*outH=acosf((浮动)dx/d)/M_-PI/2.0f;
如果(dy<0)*outH=1.0-*outH;
}
UIImage*createUIImageWithRGBAData(CFDataRef数据、整型宽度、整型高度)
{
CGDataProviderRef dataProvider=CGDataProviderCreateWithCFData(数据);
CGColorSpaceRef colorSpace=CGColorSpaceCreateDeviceRGB();
CGImageRef imageRef=CGImageCreate(宽度、高度、8、32、宽度*4、颜色空间、kCGImageAlphaLast、数据提供程序、NULL、0、KCGRenderingtentDefault);
UIImage*image=[[UIImage alloc]initWithCGImage:imageRef];
CGDataProviderRelease(数据提供者);
CGCOLORSPACTERELEASE(色彩空间);
CGImageRelease(imageRef);
返回图像;
}
//改编自Apple示例代码。看见http://en.wikipedia.org/wiki/HSV_color_space#Comparison_of_HSL_and_HSV
无效HSL2RGB(浮点数h、浮点数s、浮点数l、浮点数*outR、浮点数*outG、浮点数*outB)
{
浮动temp1、temp2;
浮子温度[3];
int i;
//检查饱和度。如果没有饱和度,只返回每个饱和度的亮度值,结果为灰色。
如果(s==0.0)
{
*outR=l;
*outG=l;
*outB=l;
返回;
}
//测试亮度并根据亮度和饱和度计算临时值
如果(l<0.5)
temp2=l*(1.0+s);
其他的
temp2=l+s-l*s;
temp1=2.0*l-temp2;
//基于色调计算中间值
温度[0]=h+1.0/3.0;
温度[1]=h;
温度[2]=h-1.0/3.0;
对于(i=0;i<3;++i)
{
//调整范围
如果(温度[i]<0.0)
温度[i]+=1.0;
如果(温度[i]>1.0)
温度[i]-=1.0;
如果(6.0*温度[i]<1.0)
温度[i]=温度1+(温度2-温度1)*6.0*温度[i];
否则{
如果(2.0*温度[i]<1.0)
temp[i]=temp2;
否则{
如果(3.0*温度[i]<2.0)
temp[i]=temp1+(temp2-temp1)*((2.0/3.0)-temp[i])*6.0;
- (void)drawRect:(CGRect)rect
{
    int dim = self.bounds.size.width; // should always be square.
    bitmapData = CFDataCreateMutable(NULL, 0);
    CFDataSetLength(bitmapData, dim * dim * 4);
    generateColorWheelBitmap(CFDataGetMutableBytePtr(bitmapData), dim, luminance);
    UIImage *image = createUIImageWithRGBAData(bitmapData, self.bounds.size.width, self.bounds.size.height);
    CFRelease(bitmapData);
    [image drawAtPoint:CGPointZero];
    [image release];
}

void generateColorWheelBitmap(UInt8 *bitmap, int widthHeight, float l)
{
    // I think maybe you can do 1/3 of the pie, then do something smart to generate the other two parts, but for now we'll brute force it.
    for (int y = 0; y < widthHeight; y++)
    {
        for (int x = 0; x < widthHeight; x++)
        {
            float h, s, r, g, b, a;
            getColorWheelValue(widthHeight, x, y, &h, &s);
            if (s < 1.0)
            {
                // Antialias the edge of the circle.
                if (s > 0.99) a = (1.0 - s) * 100;
                else a = 1.0;

                HSL2RGB(h, s, l, &r, &g, &b);
            }
            else
            {
                r = g = b = a = 0.0f;
            }

            int i = 4 * (x + y * widthHeight);
            bitmap[i] = r * 0xff;
            bitmap[i+1] = g * 0xff;
            bitmap[i+2] = b * 0xff;
            bitmap[i+3] = a * 0xff;
        }
    }
}

void getColorWheelValue(int widthHeight, int x, int y, float *outH, float *outS)
{
    int c = widthHeight / 2;
    float dx = (float)(x - c) / c;
    float dy = (float)(y - c) / c;
    float d = sqrtf((float)(dx*dx + dy*dy));
    *outS = d;
    *outH = acosf((float)dx / d) / M_PI / 2.0f;
    if (dy < 0) *outH = 1.0 - *outH;
}

UIImage *createUIImageWithRGBAData(CFDataRef data, int width, int height)
{
    CGDataProviderRef dataProvider = CGDataProviderCreateWithCFData(data);
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGImageRef imageRef = CGImageCreate(width, height, 8, 32, width * 4, colorSpace, kCGImageAlphaLast, dataProvider, NULL, 0, kCGRenderingIntentDefault);
    UIImage *image = [[UIImage alloc] initWithCGImage:imageRef];
    CGDataProviderRelease(dataProvider);
    CGColorSpaceRelease(colorSpace);
    CGImageRelease(imageRef);
    return image;
}

// Adapted from Apple sample code.  See http://en.wikipedia.org/wiki/HSV_color_space#Comparison_of_HSL_and_HSV
void HSL2RGB(float h, float s, float l, float* outR, float* outG, float* outB)
{
    float temp1, temp2;
    float temp[3];
    int i;

    // Check for saturation. If there isn't any just return the luminance value for each, which results in gray.
    if(s == 0.0)
    {
        *outR = l;
        *outG = l;
        *outB = l;
        return;
    }

    // Test for luminance and compute temporary values based on luminance and saturation 
    if(l < 0.5)
        temp2 = l * (1.0 + s);
    else
        temp2 = l + s - l * s;
    temp1 = 2.0 * l - temp2;

    // Compute intermediate values based on hue
    temp[0] = h + 1.0 / 3.0;
    temp[1] = h;
    temp[2] = h - 1.0 / 3.0;

    for(i = 0; i < 3; ++i)
    {
        // Adjust the range
        if(temp[i] < 0.0)
            temp[i] += 1.0;
        if(temp[i] > 1.0)
            temp[i] -= 1.0;


        if(6.0 * temp[i] < 1.0)
            temp[i] = temp1 + (temp2 - temp1) * 6.0 * temp[i];
        else {
            if(2.0 * temp[i] < 1.0)
                temp[i] = temp2;
            else {
                if(3.0 * temp[i] < 2.0)
                    temp[i] = temp1 + (temp2 - temp1) * ((2.0 / 3.0) - temp[i]) * 6.0;
                else
                    temp[i] = temp1;
            }
        }
    }

    // Assign temporary values to R, G, B
    *outR = temp[0];
    *outG = temp[1];
    *outB = temp[2];
}
//  ViewController.m; assuming ViewController is the app's root view controller
#include "ViewController.h"
@interface ViewController () 
{
    UIImage *img;
    UIImageView *iv;
}
@end

@implementation ViewController
- (void)viewDidLoad
{
    [super viewDidLoad];

    CGSize size = CGSizeMake(self.view.bounds.size.width, self.view.bounds.size.height);
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(size.width, size.height), YES, 0.0);
    [[UIColor whiteColor] setFill];
    UIRectFill(CGRectMake(0, 0, size.width, size.height));

    int sectors = 180;
    float radius = MIN(size.width, size.height)/2;
    float angle = 2 * M_PI/sectors;
    UIBezierPath *bezierPath;
    for ( int i = 0; i < sectors; i++)
    {
        CGPoint center = CGPointMake(size.width/2, size.height/2);
        bezierPath = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:i * angle endAngle:(i + 1) * angle clockwise:YES];
        [bezierPath addLineToPoint:center];
        [bezierPath closePath];
        UIColor *color = [UIColor colorWithHue:((float)i)/sectors saturation:1. brightness:1. alpha:1];
        [color setFill];
        [color setStroke];
        [bezierPath fill];
        [bezierPath stroke];
    }
    img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    iv = [[UIImageView alloc] initWithImage:img];
    [self.view addSubview:iv];
}
@end