web-dev-qa-db-fra.com

iPhone: Comment définir BackgroundColor de UIButton avec buttonType UIButtonTypeCustom

je veux changer la couleur du bouton quand il est cliqué. J'ai utilisé :

[button setBackgroundColor:[UIColor redColor]];

mais cela montre la couleur rouge que sur les quatre coins du bouton pas sur le bouton entier et aussi lorsque j'utilise forState:UIControlStateNormal alors l'application se bloque . Est-il un moyen de montrer une couleur sur le bouton lorsque vous cliquez dessus? 

[click1 setBackgroundColor:[UIColor redColor] forState:UIControlStateHighlighted];

Toute aide serait appréciée.

iphoneobjective-cxcodeipad
33
Pankaj Kainthla

Vous pouvez créer une image par programme et avoir ainsi la possibilité d'utiliser vos couleurs de manière dynamique:

Créez une catégorie pour UIButton avec cette méthode et assurez-vous que QuartzCore lib est importé via @import QuartzCore:

- (void)setColor:(UIColor *)color forState:(UIControlState)state
{
    UIView *colorView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1, 1)];
    colorView.backgroundColor = color;

    UIGraphicsBeginImageContext(colorView.bounds.size);
    [colorView.layer renderInContext:UIGraphicsGetCurrentContext()];

    UIImage *colorImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    [self setBackgroundImage:colorImage forState:state];
}

Cela va créer une image avec la taille de votre bouton pour la couleur que vous avez spécifiée, puis l'affecter à l'état souhaité. En raison de l'utilisation de backgroundImage, vous pouvez toujours définir un titre pour le bouton via la méthode setTitle: forState:.

37
Hendrik

C’est ce que je fais ... c’est une sous-classe personnalisée de UIButton, il suffit de définir les couleurs normales et surlignées pour que tout fonctionne correctement;)

En tête de fichier:

//
//  FTCustomButton.h
//  FTLibrary
//
//  Created by Ondrej Rafaj on 14/01/2013.
//  Copyright (c) 2013 Fuerte International. All rights reserved.
//

#import <UIKit/UIKit.h>


@interface FTCustomButton : UIButton

@property (nonatomic, strong, readonly) UIColor *normalColor;
@property (nonatomic, strong, readonly) UIColor *highlightedColor;

- (void)setNormalColor:(UIColor *)normalColor;
- (void)setHighlightedColor:(UIColor *)highlightedColor;


@end

C'est le fichier d'implémentation:

//
//  FTCustomButton.m
//  FTLibrary
//
//  Created by Ondrej Rafaj on 14/01/2013.
//  Copyright (c) 2013 Fuerte International. All rights reserved.
//

#import "FTCustomButton.h"

//*****************************************************************************
// private interface declaration
//*****************************************************************************
@interface MCSelectionButton ()
    @property(nonatomic, strong, readwrite) UIColor *normalColor;
    @property(nonatomic, strong, readwrite) UIColor *highlightedColor;
@end

//*****************************************************************************
// public interface implementation
//*****************************************************************************

@implementation FTCustomButton


#pragma mark Settings

- (void)setNormalColor:(UIColor *)normalColor {
    [self setBackgroundColor:normalColor];
    _normalColor = normalColor;
}

- (void)setHighlightedColor:(UIColor *)highlightedColor {
    _highlightedColor = highlightedColor;
}

#pragma mark Actions

- (void)didTapButtonForHighlight:(UIButton *)sender {
    [self setBackgroundColor:_highlightedColor];
}

- (void)didUnTapButtonForHighlight:(UIButton *)sender {
    [self setBackgroundColor:_normalColor];
}

#pragma mark Initialization

- (void)setupButton {
    [self addTarget:self action:@selector(didTapButtonForHighlight:) forControlEvents:UIControlEventTouchDown];
    [self addTarget:self action:@selector(didUnTapButtonForHighlight:) forControlEvents:UIControlEventTouchUpInside];
    [self addTarget:self action:@selector(didUnTapButtonForHighlight:) forControlEvents:UIControlEventTouchUpOutside];
}

- (id)init {
    self = [super init];
    if (self) {
        [self setupButton];
    }
    return self;
}

- (id)initWithCoder:(NSCoder *)aDecoder {
    self = [super initWithCoder:aDecoder];
    if (self) {
        [self setupButton];
    }
    return self;
}

- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        [self setupButton];
    }
    return self;
}


@end
14
Ondrej

Assurez-vous que le type de bouton est personnalisé, comme l'a déjà dit quelqu'un d'autre. Ensuite, procédez comme suit pour ramener ces coins arrondis:

 [self.myButton.layer setCornerRadius:8.0f];
 [self.myButton.layer setMasksToBounds:YES];
 [self.myButton.layer setBorderWidth:1.0f];
 [self.myButton.layer setBorderColor:[[UIColor whiteColor] CGColor]];
 self.myButton.backgroundColor = [UIColor redColor];

Personnellement, je suis un grand fan des boutons de dégradé sur les couleurs unies ... De plus, la couleur de fond n'a pas d'états différents, alors que les images de fond ont:

 [self.myButton setBackgroundImage:[UIImage imageNamed:@"gradient.png"] forState:UIControlStateNormal];

Si vous utilisez une image, votre bouton s’assombrira avec la sélection (ou vous pouvez fournir une image d’arrière-plan différente d’un État à l’autre). Cela ne se produira pas avec la couleur d'arrière-plan, l'arrière-plan restera toujours le même, seule votre étiquette de bouton changera par état.

13
DiggyJohn

Pour compléter la réponse de Dima, j'ai implémenté une extension dans Swift:

extension UIButton {
    private func imageWithColor(color: UIColor) -> UIImage {
        let rect = CGRectMake(0.0, 0.0, 1.0, 1.0)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()

        CGContextSetFillColorWithColor(context, color.CGColor)
        CGContextFillRect(context, rect)

        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return image
    }

    func setBackgroundColor(color: UIColor, forUIControlState state: UIControlState) {
        self.setBackgroundImage(imageWithColor(color), forState: state)
    }
}
7
Giordano Scalzo

Je pense qu'une solution plus efficace que toutes les solutions répertoriées consiste à dessiner directement l'image dans Core Graphics. Vous évitez d'avoir à faire une UIView et à appeler renderInContext:, ce qui peut être assez lent .

+ (UIImage *) imageWithColor:(UIColor *)color
{
    CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
    UIGraphicsBeginImageContext(rect.size);
    CGContextRef context = UIGraphicsGetCurrentContext();

    CGContextSetFillColorWithColor(context, [color CGColor]);
    CGContextFillRect(context, rect);

    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;
}

Vous pouvez l'utiliser dans une catégorie UIImage pour créer une image à utiliser dans une UIButton.

4
Dima

vous avez pris une image couleur rouge pour votre bouton et vous pouvez la définir lorsque l'utilisateur clique 

[yourButtonName setBackgroundImage:[UIImage imageNamed:@"yourRedButton.png"] forState:UIControlStateHighlighted];
2
Gyani

Pour obtenir un bouton d'une seule couleur, définissez le bouton sur le bouton personnalisé . Voici ma liste connue d'api de bouton disponibles (vous pouvez les définir dans viewDidLoad après les avoir définies comme points de vente) . Importez simplement le quartz et changez le rayon de la bordure pour qu’il ressemble à un bouton.

//highlightcolor - this changes the status for UIControlStateHighlighted
OUTLETNAME.tintColor =  [UIColor orangeColor];

//borderradius *quartz
[[OUTLETNAME layer] setCornerRadius:20.0f];

//border *quartz
[[OUTLETNAME layer] setBorderWidth:5.0f];

//bordercolor
[OUTLETNAME.layer setBorderColor:[[UIColor greenColor] CGColor]];

//backgroundcolor 
OUTLETNAME.backgroundColor = [UIColor blackColor];

//image 
[OUTLETNAME setImage:[UIImage imageNamed:PICNAME] forState:UIControlStateNormal];

//text 
[OUTLETNAME setTitle:@"TEXT" forState:UIControlStateNormal];

//fontsize
OUTLETNAME.titleLabel.font = [UIFont systemFontOfSize:36.0];

//fontcolor
OUTLETNAME.titleLabel.textColor = [UIColor blackColor];

//fontcolor
[OUTLETNAME setTitleColor:[UIColor orangeColor] forState: UIControlStateNormal];

Si vous voulez des boutons personnalisés avec une couleur de dégradé, vous devez créer une classe de boutons personnalisée.

Ce blog contient un projet de classe de boutons brillant à télécharger . http://didikot.com/?p=217

Je pense que vous devez réfracter et convertir en ARC pour l'utiliser.

Ce blog fait la même chose mais sans le gloss . http://www.cimgf.com/2010/01/28/fun-with-uibuttons-and-core-animation-layers/

2
MGM

Juste une mise à jour pour répondre Hendrik.

Pour bien fonctionner avec la mise en page automatique, vous devez définir la taille du cadre UIView sur le bouton intrinsicContentSize. Sinon, cela gâcherait la présentation.

- (void)setColor:(UIColor *)color forState:(UIControlState)state
{
    UIView *colorView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.intrinsicContentSize.width, self.intrinsicContentSize.height)];
    colorView.backgroundColor = color;

    UIGraphicsBeginImageContext(colorView.bounds.size);
    [colorView.layer renderInContext:UIGraphicsGetCurrentContext()];

    UIImage *colorImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    [self setBackgroundImage:colorImage forState:state];
}
1
BrunoVillanova

@pankaj Gyani dit correct

UIButton *button = [[UIButton buttonWithType:UIButtonTypeCustom] initWithFrame:CGRectMake(0, 0, 24, 24)];
[button addTarget:self action:@selector(prevButtonClick:) forControlEvents:UIControlEventTouchUpInside];
[button setBackgroundImage:[UIImage imageNamed:@"IntroArrowLeft.png"] forState:UIControlStateNormal];
[self addSubview:button];
1
arunkumar.p

Vous devez définir le type de UIButton sur custom et définir ses propriétés d'image ou d'image d'arrière-plan pour les états normal et en surbrillance.

Pour les boutons professionnels et agréables que vous pouvez facilement utiliser dans vos applications ceci le composant de bouton personnalisé peut également aider.

1
Ahmet Ardal

Vous avez tout correct. Il suffit de définir le type de votre bouton sur UIButtonTypeCustom ..

button =    [UIButton buttonWithType:UIButtonTypeCustom];
button.frame    =   CGRectMake(200, 8, 100, 30);
[button setTitle:@"Set up" forState:UIControlStateNormal];
[button setBackgroundColor:[UIColor greenColor]];
button.clipsToBounds    =   YES;
button.layer.cornerRadius   =   10;
button.alpha        =   0.5;
1
Shob-Z

Faites le type de bouton comme personnalisé.

Par exemple

button = [UIButton buttonWithType:UIButtonTypeCustom];

Bonne chance.

0
Warrior

Merci à @ Dima 

Voici un code mis à jour pour Swift 3.0 en tant qu'extension UIButton

extension UIButton {
  // thanks to @Dima http://stackoverflow.com/a/24665476/2581637 update code for Swift 3
  func setBackgroundColor(color: UIColor, forUIControlState state: UIControlState) {
    func imageWithColor(color: UIColor) -> UIImage? {
      let rect = CGRect(x: 0.0, y: 0.0, width: 1.0, height: 1.0)
      UIGraphicsBeginImageContext(rect.size)
      if let context = UIGraphicsGetCurrentContext() {
        context.setFillColor(color.cgColor)
        context.fill(rect)
      }

      let image = UIGraphicsGetImageFromCurrentImageContext()
      UIGraphicsEndImageContext()

      return image
    }

    self.setBackgroundImage(imageWithColor(color: color), for: state)
  }
}
0
nuynait