文字透明度|颜色渐变

时间:2015-02-12 16:45:34

标签: ios objective-c iphone transparency

我试图在UIButton的标题上放置透明度(或颜色渐变)。我不知道那是怎么回事。我试图简单地在titleColor上放一个clearColor,但我们只看到背景颜色。

所以我希望这里有人会对我的问题有个惊人的想法。

What's desired

我的解决方案

self.loginButton = [UIButton buttonWithType:UIButtonTypeCustom];
self.loginButton.backgroundColor=  [UIColor whiteColor];
self.loginButton.frame = CGRectMake(self.signUpButton.left,
                                    0,
                                    self.signUpButton.frame.size.width,
                                    self.signUpButton.frame.size.height);
[self.loginButton.layer setBackgroundColor:[[UIColor blackColor] CGColor]];
self.loginButton.layer.borderColor = [[UIColor whiteColor] CGColor];
self.loginButton.layer.borderWidth = 1.0f;
self.loginButton.layer.cornerRadius = 3.0f;
[self.loginButton addTarget:self action:@selector(loginButtonClicked:) forControlEvents:UIControlEventTouchUpInside];
    self.loginButtonLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 0, 0)];
self.loginButtonLabel.font = [UIFont fontWithName:@"OpenSans-Light" size:16.0f];
self.loginButtonLabel.textColor = [UIColor whiteColor];
self.loginButtonLabel.text = @"Connexion";
[self.loginButtonLabel sizeToFit];

UIColor *topColor = [UIColor blueColor];
UIColor *bottomColor = [UIColor orangeColor];

self.gradientView = [[UIView alloc] initWithFrame:self.loginButtonLabel.frame];
[self.loginButton addSubview:self.gradientView];
[self.loginButton sendSubviewToBack:self.gradientView];


[self.loginButton addSubview:self.loginButtonLabel];

CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = self.gradientView.frame;
gradient.colors = [NSArray arrayWithObjects:(id)topColor.CGColor, (id)bottomColor.CGColor, nil];
gradient.startPoint = CGPointMake(0, 0.5);
gradient.endPoint = CGPointMake(1, 0.5);
[self.gradientView.layer addSublayer:gradient];

self.gradientView.layer.mask = self.loginButtonLabel.layer;
self.gradientView.layer.masksToBounds = YES;

self.gradientView.center = CGPointMake(self.loginButton.width / 2, self.loginButton.height / 2);
[self.view addSubview:self.loginButton];

但是现在我需要将渐变放在边框上。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

所以我的解决方案是创建一个UILabel的自定义按钮。我将使用UIView为文本添加渐变颜色。

解决方案:

self.loginButton = [UIButton buttonWithType:UIButtonTypeCustom];
self.loginButton.backgroundColor=  [UIColor whiteColor];
self.loginButton.frame = CGRectMake(self.signUpButton.left,
                                0,
                                self.signUpButton.frame.size.width,
                                self.signUpButton.frame.size.height);
[self.loginButton.layer setBackgroundColor:[[UIColor blackColor] CGColor]];
self.loginButton.layer.borderColor = [[UIColor whiteColor] CGColor];
self.loginButton.layer.borderWidth = 1.0f;
self.loginButton.layer.cornerRadius = 3.0f;
[self.loginButton addTarget:self action:@selector(loginButtonClicked:) forControlEvents:UIControlEventTouchUpInside];
self.loginButtonLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 0, 0)];
self.loginButtonLabel.font = [UIFont fontWithName:@"OpenSans-Light" size:16.0f];
self.loginButtonLabel.textColor = [UIColor whiteColor];
self.loginButtonLabel.text = @"Connexion";
[self.loginButtonLabel sizeToFit];

UIColor *topColor = [UIColor blueColor];
UIColor *bottomColor = [UIColor orangeColor];

self.gradientView = [[UIView alloc] initWithFrame:self.loginButtonLabel.frame];
[self.loginButton addSubview:self.gradientView];
[self.loginButton sendSubviewToBack:self.gradientView];


[self.loginButton addSubview:self.loginButtonLabel];

CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = self.gradientView.frame;
gradient.colors = [NSArray arrayWithObjects:(id)topColor.CGColor, (id)bottomColor.CGColor, nil];
gradient.startPoint = CGPointMake(0, 0.5);
gradient.endPoint = CGPointMake(1, 0.5);
[self.gradientView.layer addSublayer:gradient];

self.gradientView.layer.mask = self.loginButtonLabel.layer;
self.gradientView.layer.masksToBounds = YES;

self.gradientView.center = CGPointMake(self.loginButton.width / 2, self.loginButton.height / 2);
[self.view addSubview:self.loginButton];