3

カスタム UIButton グラデーション背景を作成したいと思います。要件についての写真を添付し​​ました。
ここに画像の説明を入力
ここに画像の説明を入力

しかし、グラデーションの背景は期待どおりではありません。

ここに画像の説明を入力

私の質問は、位置または場所をグラデーションに設定する方法ですか? (上から中央へ、次に中央から下へ)。

これが私のコードです： 

- (void)setBlueShiningLayer {
    CALayer *buttonLayer = self.layer;
    [buttonLayer setMasksToBounds:YES];
    [buttonLayer setCornerRadius:5.0];
    [buttonLayer setBorderWidth:1.0f];
    [buttonLayer setBorderColor:[UIColor colorWithRed:153.0f / 255.0f green:153.0f / 255.0f blue:153.0f / 255.0f alpha:1.0f].CGColor];

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];
    [gradientLayer setBounds:self.bounds];
    NSArray *colors = [NSArray arrayWithObjects:
            (id) [UIColor colorWithRed:129.0f / 255.0f green:151.0f / 255.0f blue:179.0f / 255.0f alpha:0.8f].CGColor, // top
            (id) [UIColor colorWithRed:111.0f / 245.0f green:133.0f / 255.0f blue:162.0f / 255.0f alpha:0.4f].CGColor, // center
            (id) [UIColor colorWithRed:95.0f / 245.0f green:118.0f / 255.0f blue:151.0f / 255.0f alpha:0.4f].CGColor, // center
            (id) [UIColor colorWithRed:75.0f / 245.0f green:99.0f / 255.0f blue:133.0f / 255.0f alpha:0.8f].CGColor, // bottom
            nil];

    [gradientLayer setPosition:CGPointMake([self bounds].size.width / 2, [self bounds].size.height / 2)];
    [gradientLayer setColors:colors];
    [buttonLayer insertSublayer:gradientLayer atIndex:0];

    [self setTitleColor:[UIColor colorWithRed:0.0f green:0.0f blue:0.0f alpha:1.0f] forState:UIControlStateNormal];
    [self setTintColor:[UIColor colorWithRed:0.0f green:0.0f blue:0.0f alpha:0.3f]];
}
4

2 に答える 2

3

グラデーションレイヤーが色を均等に配置しているように見えます。それが、あなたが得ている効果を得ている理由です。

これを修正するには、 のlocationsプロパティを使用できますCAGradientLayer。

このような...

gradientLayer.locations = @[@0, @0.5, @0.5, @1.0];

TBH でこれを行う最も簡単な方法はUIButton、画像を使用することです。

必要なグラデーションと境界線を使用してボタン イメージを作成し、それを背景イメージとして追加するだけです。

異なるサイズで使用する必要がある場合は、サイズ変更可能な画像を作成できます。

于 2013-11-05T08:50:50.770 に答える
0

スウィフト - バージョン 4.2

@IBOutlet weak var gButton: UIButton!

override func viewDidLoad() {

    super.viewDidLoad()

    let topGradientColor = UIColor.red
    let bottomGradientColor = UIColor.yellow

    let gradientLayer = CAGradientLayer()

    gradientLayer.frame = gButton.bounds

    gradientLayer.colors = [topGradientColor.cgColor, bottomGradientColor.cgColor]

    //Vertical
    //gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.0)
    //gradientLayer.endPoint = CGPoint(x: 0.0, y: 1.0)

    //Horizontal
    gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.0)
    gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.0)

    gradientLayer.locations = [0.0, 1.0]

    gButton.layer.insertSublayer(gradientLayer, at: 0)
}
于 2019-01-17T05:12:56.377 に答える