文字透明度|颜色渐变

text transparency|color gradient

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

所以我希望这里有人能对我的问题提出绝妙的想法。

我的解决方案

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];

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

所以我的解决方案是创建一个带有 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];