titlelabel guidelines color buttons objective-c iphone cocoa-touch uibutton

objective-c - guidelines - menu ios



¿Es posible cambiar un color de fondo UIButtons? (16)

Este me tiene perplejo.

¿Es posible cambiar el color de fondo de un UIButton en Cocoa para iPhone? Intenté establecer el color de fondo pero solo cambia las esquinas. setBackgroundColor: parece ser el único método disponible para tales cosas.

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


Bueno, estoy 99% positivo de que no puedes ir y cambiar el color de fondo de un UIButton. En cambio, tienes que ir y cambiar las imágenes de fondo, lo que creo que es un dolor. Estoy sorprendido de que tuviera que hacer esto.

Si me equivoco o si hay una mejor manera sin tener que establecer imágenes de fondo, házmelo saber

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


Esto no es tan elegante como sub-clasificar UIButton, sin embargo, si solo quieres algo rápido, lo que hice fue crear un botón personalizado, luego una imagen de 1px por 1px con el color que quisiera que fuera el botón, y establecer el fondo del botón a esa imagen para el estado resaltado - funciona para mis necesidades.


Esto se puede hacer programáticamente haciendo una réplica:

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;

editar: por supuesto, tendrías que #import <QuartzCore/QuartzCore.h>

editar: para todos los lectores nuevos, también debes considerar algunas opciones agregadas como "otra posibilidad". para su consideración.

Como esta es una respuesta anterior, recomiendo leer comentarios para solucionar problemas


Otra posibilidad (el mejor y más hermoso imho):

Cree un UISegmentedControl con 2 segmentos en el color de fondo requerido en Interface Builder. Establezca el tipo a ''bar''. Luego, cámbialo por tener solo un segmento. El constructor de interfaces no acepta un segmento, por lo que debes hacerlo de forma programática.

Por lo tanto, crea un IBOutlet para este botón y agrégalo a viewDidLoad de tu vista:

[segmentedButton removeSegmentAtIndex:1 animated:NO];

Ahora tiene un hermoso botón brillante de color con el color de fondo especificado. Para acciones, use el evento ''value changed''.

(He encontrado esto en http://chris-software.com/index.php/2009/05/13/creating-a-nice-glass-buttons/ ). Gracias Chris!


Otra posibilidad:

  1. Crea un UIButton en el constructor de Interfaz.
  2. Dale un tipo ''personalizado''
  3. Ahora, en IB, es posible cambiar el color de fondo

Sin embargo, el botón es cuadrado, y eso no es lo que queremos. Cree un IBOutlet con una referencia a este botón y agregue lo siguiente al método viewDidLoad:

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

No te olvides de importar QuartzCore.h


Para botones profesionales y atractivos, puede verificar este componente de botón personalizado . Puede usarlo directamente en sus vistas y tablas o modificar el código fuente para que se ajuste a sus necesidades. Espero que esto ayude.


Por sugerencia de @EthanB y @karim haciendo un rectángulo lleno de respaldo, acabo de crear una categoría para UIButton para lograr esto.

Solo ingrese el código de Categoría: https://github.com/zmonteca/UIButton-PLColor

Uso:

[button setBackgroundColor:uiTextColor forState:UIControlStateDisabled];

Opcional para los estados a usar:

UIControlStateNormal UIControlStateHighlighted UIControlStateDisabled UIControlStateSelected


Sé que esto fue pedido hace mucho tiempo y ahora hay un nuevo UIButtonTypeSystem. Pero las preguntas más recientes se marcan como duplicados de esta pregunta, así que esta es mi respuesta más reciente en el contexto de un botón del sistema iOS 7, use la propiedad .tintColor .

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


Subclase UIButton y anulación setHighlighted and setSelected methods

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

Mi método darkerShade está en una categoría de UIColor como esta

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


Supongo que estás hablando de un UIButton con UIButtonTypeRoundedRect ? No puedes cambiar el color de fondo de eso. Cuando intenta cambiar su color de fondo, está cambiando el color del rectángulo en el que se dibuja el botón (que generalmente es claro). Entonces hay dos maneras de ir. O subclase UIButton y sobrescriba su método -drawRect: o cree imágenes para los diferentes estados de los botones (lo cual está perfectamente bien por hacer).

Si configura las imágenes de fondo en Interface Builder, debe observar que IB no admite la configuración de imágenes para todos los estados que el botón puede tener, por lo que recomiendo configurar las imágenes en un código como este:

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 última línea muestra cómo establecer una imagen para el estado seleccionado y resaltado (ese es el que IB no puede establecer). No necesita las imágenes seleccionadas (líneas 4 y 6) si su botón no necesita un estado seleccionado.


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)


También puede agregar un CALayer al botón; puede hacer muchas cosas con estas, incluida una superposición de colores, este ejemplo utiliza una capa de color simple, también puede graduar fácilmente el color. Tenga en cuenta que aunque las capas añadidas oscurecen a los que están debajo

+(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]; }


Tengo un enfoque diferente,

[btFind setTitle:NSLocalizedString(@"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;

Desde 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; }

No te olvides de #import <QuartzCore/QuartzCore.h>


agregue un segundo objetivo para UIButton para UIControlEventTouched y cambie el color de fondo UIButton . A continuación, cámbielo de nuevo en el destino UIControlEventTouchUpInside ;


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

Es posible cambiar de esta manera o continuar con Storyboard y cambiar el fondo de las opciones en el lado derecho.


Si no desea utilizar imágenes y desea que se vea exactamente como el estilo Rectángulo redondeado, intente esto. Simplemente coloque un UIView sobre el UIButton, con un cuadro idéntico y máscara de cambio de tamaño automático, establezca el alfa en 0.3 y configure el fondo en un color. A continuación, utilice el fragmento siguiente para recortar los bordes redondeados de la vista de superposición de color. Además, desmarque la casilla de verificación ''Interacción del usuario habilitada'' en IB en UIView para permitir que los eventos táctiles entren en cascada al UIButton que se encuentra debajo.

Un efecto secundario es que su texto también se coloreará.

#import <QuartzCore/QuartzCore.h> colorizeOverlayView.layer.cornerRadius = 10.0f; colorizeOverlayView.layer.masksToBounds = YES;