Est-il possible de changer la couleur de fond des UIButtons?

Celui-ci m’a déconcerté.

Est-il possible de changer la couleur de fond d’un UIButton dans Cocoa pour iPhone. J’ai essayé de définir la couleur d’arrière-plan mais cela ne change que les coins. setBackgroundColor: semble être la seule méthode disponible pour de telles choses.

 [random setBackgroundColor:[UIColor blueColor]]; [random.titleLabel setBackgroundColor:[UIColor blueColor]]; 

Cela peut être fait par programmation en faisant une réplique:

  loginButton = [UIButton buttonWithType:UIButtonTypeCustom]; [loginButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal]; loginButton.backgroundColor = [UIColor whiteColor]; loginButton.layer.borderColor = [UIColor blackColor].CGColor; loginButton.layer.borderWidth = 0.5f; loginButton.layer.cornerRadius = 10.0f; 

edit: bien sûr, vous devriez #import

edit: à tous les nouveaux lecteurs, vous devriez également considérer quelques options ajoutées comme “une autre possibilité”. pour vous considération.

Comme il s’agit d’une ancienne réponse, je recommande fortement de lire les commentaires pour le dépannage.

J’ai une approche différente,

 [btFind setTitle:NSLocalizedSsortingng(@"Find", @"") forState:UIControlStateNormal]; [btFind setBackgroundImage:[CommonUIUtility imageFromColor:[UIColor cyanColor]] forState:UIControlStateNormal]; btFind.layer.cornerRadius = 8.0; btFind.layer.masksToBounds = YES; btFind.layer.borderColor = [UIColor lightGrayColor].CGColor; btFind.layer.borderWidth = 1; 

De CommonUIUtility,

 + (UIImage *) imageFromColor:(UIColor *)color { CGRect rect = CGRectMake(0, 0, 1, 1); UIGraphicsBeginImageContext(rect.size); CGContextRef context = UIGraphicsGetCurrentContext(); CGContextSetFillColorWithColor(context, [color CGColor]); // [[UIColor colorWithRed:222./255 green:227./255 blue: 229./255 alpha:1] CGColor]) ; CGContextFillRect(context, rect); UIImage *img = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return img; } 

N’oubliez pas de #import

Je suppose que vous parlez d’un UIButton avec UIButtonTypeRoundedRect ? Vous ne pouvez pas changer la couleur d’arrière-plan de cela. Lorsque vous essayez de changer la couleur d’arrière-plan, vous modifiez plutôt la couleur du rectangle sur lequel le bouton est dessiné (ce qui est généralement clair). Il y a donc deux façons de faire. Soit vous sous-classe UIButton et -drawRect: sa méthode -drawRect: soit vous créez des images pour les différents états des boutons (ce qui est parfaitement -drawRect: ).

Si vous définissez les images d’arrière-plan dans Interface Builder, notez que IB ne prend pas en charge la définition d’images pour tous les états du bouton. Je vous recommande donc de définir les images dans un code comme celui-ci:

 UIButton *myButton = [UIButton buttonWithType:UIButtonTypeCustom]; [myButton setBackgroundImage:[UIImage imageNamed:@"normal.png"] forState:UIControlStateNormal]; [myButton setBackgroundImage:[UIImage imageNamed:@"disabled.png"] forState:UIControlStateDisabled]; [myButton setBackgroundImage:[UIImage imageNamed:@"selected.png"] forState:UIControlStateSelected]; [myButton setBackgroundImage:[UIImage imageNamed:@"higligted.png"] forState:UIControlStateHighlighted]; [myButton setBackgroundImage:[UIImage imageNamed:@"highlighted+selected.png"] forState:(UIControlStateHighlighted | UIControlStateSelected)]; 

La dernière ligne montre comment définir une image pour l’état sélectionné et mis en évidence (c’est celui que l’IB ne peut pas définir). Vous n’avez pas besoin des images sélectionnées (lignes 4 et 6) si vous n’avez pas besoin d’un état sélectionné.

Une autre possibilité:

  1. Créez un UIButton dans le générateur Interface.
  2. Donnez-lui un type ‘Custom’
  3. Maintenant, dans IB, il est possible de changer la couleur de fond

Cependant, le bouton est carré et ce n’est pas ce que nous voulons. Créez un IBOutlet avec une référence à ce bouton et ajoutez ce qui suit à la méthode viewDidLoad:

 [buttonOutlet.layer setCornerRadius:7.0f]; [buttonOutlet.layer setClipToBounds:YES]; 

N’oubliez pas d’importer QuartzCore.h

Sous-classe UIButton et substituer les méthodes setHighlighted et setSelected

 -(void) setHighlighted:(BOOL)highlighted { if(highlighted) { self.backgroundColor = [self.mainColor darkerShade]; } else { self.backgroundColor = self.mainColor; } [super setHighlighted:highlighted]; } -(void) setSelected:(BOOL)selected { if(selected) { self.backgroundColor = [self.mainColor darkerShade]; } else { self.backgroundColor = self.mainColor; } [super setSelected:selected]; } 

Ma méthode darkerShade est dans une catégorie UIColor comme celle-ci

 -(UIColor*) darkerShade { float red, green, blue, alpha; [self getRed:&red green:&green blue:&blue alpha:&alpha]; double multiplier = 0.8f; return [UIColor colorWithRed:red * multiplier green:green * multiplier blue:blue*multiplier alpha:alpha]; } 

UIButton coloré

Si vous ne souhaitez pas utiliser d’images et que vous souhaitez qu’elles ressemblent exactement au style Rected Round, essayez ceci. Placez simplement un UIView sur l’UIButton, avec un cadre identique et un masque de redimensionnement automatique, définissez l’alpha sur 0,3 et définissez l’arrière-plan sur une couleur. Ensuite, utilisez l’extrait de code ci-dessous pour découper les bords arrondis de la vue de superposition colorée. De même, décochez la case «Interaction utilisateur activée» dans IB sur UIView pour permettre aux événements tactiles de basculer vers l’UIButton situé en dessous.

Un effet secondaire est que votre texte sera également colorisé.

 #import  colorizeOverlayView.layer.cornerRadius = 10.0f; colorizeOverlayView.layer.masksToBounds = YES; 

Une autre possibilité (la meilleure et la plus belle imho):

Créez un UISegmentedControl avec 2 segments dans la couleur d’arrière-plan requirejse dans Interface Builder. Définissez le type sur “bar”. Ensuite, changez-le pour n’avoir qu’un seul segment. Le générateur d’interface n’accepte pas un segment, vous devez donc le faire par programmation.

Par conséquent, créez un IBOutlet pour ce bouton et ajoutez-le à viewDidLoad de votre vue:

 [segmentedButton removeSegmentAtIndex:1 animated:NO]; 

Maintenant, vous avez un beau bouton coloré shiny avec la couleur de fond spécifiée. Pour les actions, utilisez l’événement “valeur modifiée”.

(Je l’ai trouvé sur http://chris-software.com/index.php/2009/05/13/creating-a-nice-glass-buttons/ ). Merci Chris!

Eh bien, je suis convaincu à 99% que vous ne pouvez pas simplement changer la couleur de fond d’un UIButton. Au lieu de cela, vous devez changer les images de fond vous-même, ce qui, à mon avis, est douloureux. Je suis stupéfait de devoir le faire.

Si je me trompe ou s’il y a un meilleur moyen sans avoir à définir des images de fond, faites-le moi savoir

 [random setBackgroundImage:[UIImage imageNamed:@"toggleoff.png"] forState:UIControlStateNormal]; [random setTitleColor:[UIColor darkTextColor] forState:UIControlStateNormal]; [random setBackgroundImage:[UIImage imageNamed:@"toggleon.png"] forState:UIControlStateNormal]; [random setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal]; 

Par suggestion @EthanB et @karim en faisant un rectangle rempli, je viens de créer une catégorie pour que l’UIButton y parvienne.

Il suffit de déposer dans le code de la catégorie: https://github.com/zmonteca/UIButton-PLColor

Usage:

 [button setBackgroundColor:uiTextColor forState:UIControlStateDisabled]; 

Facultatif pour les États à utiliser:

 UIControlStateNormal UIControlStateHighlighted UIControlStateDisabled UIControlStateSelected 

Vous pouvez également append un calquet au bouton – vous pouvez faire beaucoup de choses avec celles-ci, y compris une superposition de couleurs. Cet exemple utilise un calque de couleur unie que vous pouvez également graduer facilement. Soyez conscient si des couches supplémentaires obscurcissent celles en dessous

 +(void)makeButtonColored:(UIButton*)button color1:(UIColor*) color { CALayer *layer = button.layer; layer.cornerRadius = 8.0f; layer.masksToBounds = YES; layer.borderWidth = 4.0f; layer.opacity = .3;// layer.borderColor = [UIColor colorWithWhite:0.4f alpha:0.2f].CGColor; CAGradientLayer *colorLayer = [CAGradientLayer layer]; colorLayer.cornerRadius = 8.0f; colorLayer.frame = button.layer.bounds; //set gradient colors colorLayer.colors = [NSArray arrayWithObjects: (id) color.CGColor, (id) color.CGColor, nil]; //set gradient locations colorLayer.locations = [NSArray arrayWithObjects: [NSNumber numberWithFloat:0.0f], [NSNumber numberWithFloat:1.0f], nil]; [button.layer addSublayer:colorLayer]; } 

ajoutez une deuxième cible pour UIButton pour UIControlEventTouched et modifiez la couleur d’arrière-plan UIButton . Puis changez-le dans la cible UIControlEventTouchUpInside ;

Pour les boutons professionnels et agréables, vous pouvez vérifier ce composant de bouton personnalisé . Vous pouvez l’utiliser directement dans vos vues et vues de table ou modifier le code source pour qu’il réponde à vos besoins. J’espère que cela t’aides.

Ce n’est pas aussi élégant que sous-classer UIButton, mais si vous voulez juste quelque chose de rapide – ce que j’ai fait était de créer un bouton personnalisé, puis une image de 1 x 1 par pixel avec la couleur que je souhaite voir apparaître. du bouton à cette image pour l’état mis en évidence – fonctionne pour mes besoins.

Je sais que cela a été demandé il y a longtemps et il y a maintenant un nouveau système UIButtonTypeSystem. Mais les questions les plus récentes sont marquées comme des doublons de cette question. Voici donc ma nouvelle réponse dans le contexte d’un bouton du système iOS 7: utilisez la propriété .tintColor .

 let button = UIButton(type: .System) button.setTitle("My Button", forState: .Normal) button.tintColor = .redColor() 

[myButton setBackgroundColor:[UIColor blueColor]]; [myButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];

Il est possible de changer de cette façon ou d’aller sur Storyboard et de changer de fond sur les options du côté droit.

Swift 3:

  static func imageFromColor(color: UIColor, width: CGFloat, height: CGFloat) -> UIImage { let rect = CGRect(x: 0, y: 0, width: width, height: height); UIGraphicsBeginImageContext(rect.size) let context = UIGraphicsGetCurrentContext()! context.setFillColor(color.cgColor) context.fill(rect) let img = UIGraphicsGetImageFromCurrentImageContext()! UIGraphicsEndImageContext() return img; } let button = UIButton(type: .system) let image = imageFromColor(color: .red, width: button.frame.size.width, height: button.frame.size.height) button.setBackgroundImage(image, for: .normal)