【问题标题】:How to create a UIImage RGB gradient with a portion of black programmatically如何以编程方式创建带有部分黑色的 UIImage RGB 渐变
【发布时间】:2014-01-13 16:54:48
【问题描述】:

我想生成一个 UIImage,它是一个 RGB 渐变,左侧也有一部分黑色。我想以编程方式执行此操作,而不必在 Photoshop 中制作图像并将其用作应用程序中的资产。

我在这里搜索过,之前看过 iOS 色轮的生成,但没有什么比我在 Photoshop 中模拟的矩形:

这将允许用户在触摸 UIImage 内部时更改文本颜色。

但我不确定从哪里开始,希望得到一些指点。

【问题讨论】:

标签: ios objective-c ios7 uiimageview uiimage


【解决方案1】:

下面的代码创建一个渐变 [从红色、黄色、绿色、蓝色、红色] 并在触摸它时返回 RGB 值。
下面的代码可用于任意数量的颜色,只需将它们的值设置为colors Array。
所选颜色设置为 selectedColorView(UIView) 的 backgroundColor。

ViewController.h 文件

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController
@end

ViewController.m 文件

#import "ViewController.h"
#import <QuartzCore/QuartzCore.h>
@interface ViewController ()
@end

@implementation ViewController{
    UIView *selectedColorView;
    CAGradientLayer *layer;
}
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
    if (self) {
        // Custom initialization
    }
    return self;
}
- (void)viewDidLoad
{
    [super viewDidLoad];
    layer =[CAGradientLayer layer];
    [layer setFrame:CGRectMake(20, 20, 280, 50)];
    layer.colors =@[(id)[UIColor redColor].CGColor,(id)[UIColor yellowColor].CGColor,(id)[UIColor greenColor].CGColor,(id)[UIColor blueColor].CGColor,(id)[UIColor redColor].CGColor];
    layer.startPoint =CGPointMake(0, .5);
    layer.endPoint =CGPointMake(1, .5);
    [self.view.layer addSublayer:layer];

    selectedColorView =[[UIView alloc] initWithFrame:CGRectMake(20, 20+50, 280, 50)];
    [self.view addSubview:selectedColorView];

}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
    CGPoint p = [[touches anyObject] locationInView:self.view];
    if(CGRectContainsPoint(layer.frame, p)){
        CGFloat xOffset = (p.x - layer.frame.origin.x);
        CGFloat gap=(layer.frame.size.width/(layer.colors.count-1));
        NSInteger index = xOffset/gap;
        xOffset =xOffset -index*gap;

        UIColor *color1=[UIColor colorWithCGColor:(CGColorRef)layer.colors[index]];
        UIColor *color2=[UIColor colorWithCGColor:(CGColorRef)layer.colors[index+1]];
        CGFloat r1,g1,b1,a1,r2,g2,b2,a2;
        [color1 getRed:&r1 green:&g1 blue:&b1 alpha:&a1];
        [color2 getRed:&r2 green:&g2 blue:&b2 alpha:&a2];

        selectedColorView.backgroundColor =[UIColor colorWithRed:(1-(xOffset/gap))*r1 +(xOffset/gap)*r2 green:(1-(xOffset/gap))*g1 +(xOffset/gap)*g2 blue:(1-(xOffset/gap))*b1 +(xOffset/gap)*b2 alpha:1.0];
    }
}
@end

【讨论】:

  • 哇,好棒的代码,没想到你能提供这么多帮助。在我接受这个答案之前的快速问题:如何使每个 UIColor 之间的过渡更平滑?因为他们现在非常突然和不愉快。再次感谢!
  • 我的意思是您可以清楚地看到每个 UIColor 结束和开始的位置,我想将它们平滑,使其看起来像我上面问题中的图像。
  • Apple 只为我们打开了颜色,其余的化学成分与它们一起使用。生成的渐变更多是精确的渐变。尝试降低颜色的强度量,例如绿色而不是设置1.0f 设置为 .8f,然后看起来就平滑了。
  • 我是否可以使用贝塞尔路径而不是使用色相饱和度亮度模型来创建 RGB 矩形?
【解决方案2】:

我认为您可以在上下文上绘制渐变颜色,然后创建此上下文的图像。

或者你也可以这样做。 http://belencruz.com/2012/12/gradient-background-in-ios-without-images/

【讨论】:

  • 这只是两个 UIColors,我如何创建一个 for 循环来填充剩余的光谱?
  • 编辑:一个 for 循环做 RGB 光谱的所有排列是可笑的。
猜你喜欢
  • 2014-05-29
  • 1970-01-01
  • 1970-01-01
  • 2011-10-19
  • 1970-01-01
  • 2013-04-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多