UIButton上的iOS线性渐变无法正常显示

Question

我正在尝试向我的自定义UIButton添加渐变，但是当我运行它时，按钮显示为透明而不是显示所需的渐变。

这是我的代码：

UIButton * button = [UIButton buttonWithType:UIButtonTypeCustom];
button.titleLabel.font = [UIFont fontWithName:@"SFUIDisplay-Medium" size:16];
[button setTitleColor:[UIColor whiteColor]
             forState:UIControlStateNormal];
button.layer.cornerRadius = [UIButton cornerRadius];
button.contentEdgeInsets = UIEdgeInsetsMake(13, 0, 13, 0);

button.frame = CGRectMake(50, 50, 100, 40); //this line is new

CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.frame = button.layer.bounds;
gradientLayer.colors = [NSArray arrayWithObjects:
                        (id)[UIColor lightGrayColor].CGColor,
                        (id)[UIColor blackColor].CGColor,
                        nil];
gradientLayer.locations = [NSArray arrayWithObjects:
                           [NSNumber numberWithFloat:0.0f],
                           [NSNumber numberWithFloat:1.0f],
                           nil];
gradientLayer.cornerRadius = button.layer.cornerRadius;

gradientLayer.startPoint = CGPointMake(0, 0.5); //this line is new
gradientLayer.endPoint = CGPointMake(1, 0.5); //this line is new

[button.layer addSublayer:gradientLayer];
button.translatesAutoresizingMaskIntoConstraints = NO;
[button setTitle:@"Test"
        forState:UIControlStateNormal];
[button constrainHeight:56];
[button addTarget:self
        action:@selector(doAction)
        forControlEvents:UIControlEventTouchUpInside];
[self addSubview:button];

如果我添加这一行：

button.backgroundColor = [UIColor colorWithRed:0.2 green:0.2 blue:0.2 alpha:1.0];

然后按钮看起来像这样。

Answer 1

在我分配frame之后你的代码工作正常，例如：

button.frame = CGRectMake(50, 50, 100, 40);

并添加到查看控制器的视图，例如：

[self.view addSubview:button];

Answer 2

首先，尝试将按钮添加到视图中。然后，它看起来不像您正在设置起点和终点。对于线性渐变，请尝试以下方法：

[self.view addSubview: button];

gradientLayer.startPoint = CGPointMake(x: 0, y: 0.5);
gradientLayer.endPoint = CGPointMake(x: 1, y: 0.5);

此配置将确保渐变从左侧的中间开始，并在右侧的中间结束。您可以使用下面描述的思路修改不同类型渐变的值：

(0, 0)     ||     (1, 0)
           ||
=========================
           ||
(1, 0)     ||     (1, 1)