Как установить цвет фона кнопки на iPhone?

Question

Как мне установить собственный цвет фона кнопки?

Интерфейсный Разработчик, похоже, не имеет интерфейса для этого.

Это доступно только программно? Если да, можете ли вы привести пример, пожалуйста?

Answer 1

Я прочитал ваш вопрос на Требуется (как я) программный способ установить цвет кнопки. Это явное упущение из UIKit, и я не смог заставить работать недокументированную кнопку UIGlassButton.

Я решил это с одним сегментом UISegmentedControl, что позволяет вам установить tintColor:

UISegmentedControl * btn = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObject:name]];
btn.momentary = YES;
btn.segmentedControlStyle = UISegmentedControlStyleBar;
btn.tintColor = color;
[btn addTarget:self action:@selector(action:) forControlEvents:UIControlEventValueChanged];

Обратите внимание, что свойства momentary и segmentedControlStyle имеют значение, и что вместо имени NSString * можно использовать изображение.

Растягиваемое изображение с заглушками работает хорошо, если вы можете использовать ограниченный набор консервированных изображений, но это не соответствует требованию! Например.,

buttonImage   = [[UIImage imageNamed:@"button.png"] stretchableImageWithLeftCapWidth:26 topCapHeight:16];

Answer 2

Я обнаружил, что мне нужно использовать растягиваемое изображение для достижения этой цели. Пример Apple UICatalog имеет одну или несколько цветных кнопок, которые нарисованы таким образом. Вы можете использовать их шаблон изображения и перекрасить его в соответствии с вашими потребностями кнопки.

Я не уверен, что сделаю это в Интерфейсном Разработчике, но мне удалось создать кнопку и использовать изображение для ее содержимого, используя следующий код:

downloadButton = [[UIButton alloc] initWithFrame:CGRectMake(36, 212, 247, 37)];

downloadButton.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
downloadButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;

[downloadButton setTitle:NSLocalizedStringFromTable(@"Download", @"Localized", nil) forState:UIControlStateNormal]; 
[downloadButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[downloadButton setFont:[UIFont boldSystemFontOfSize:14.0]];

UIImage *newImage = [[UIImage imageNamed:@"greenButton.png"] stretchableImageWithLeftCapWidth:12.0f topCapHeight:0.0f];
[downloadButton setBackgroundImage:newImage forState:UIControlStateNormal];

[downloadButton addTarget:self action:@selector(downloadNewItem) forControlEvents:UIControlEventTouchDown];

downloadButton.backgroundColor = [UIColor clearColor];
[downloadDisplayView addSubview:downloadButton];

Answer 3

Установка цвета фона вида для кнопки с закругленными углами не изменит цвет фона кнопки. Попробуйте сделать кнопку настраиваемой кнопкой (первый раскрывающийся список в инспекторе), а затем установить цвет фона. Вы получите желаемый эффект:)

Answer 4

Кажется, что цвет кнопки все еще является проблемой. Следующая категория полностью устанавливает фоновое изображение кнопки с помощью метода экземпляра, который принимает параметр UIColor. Нет необходимости создавать файлы фоновых изображений кнопок. Сохраняет поведение кнопки на основе UIControlState. И он держит закругленные углы.

Заголовочный файл UIButton + ColoredBackground.h

#import <UIKit/UIKit.h>

@interface UIButton (ColoredBackground)

- (void)setBackgroundImageByColor:(UIColor *)backgroundColor forState:(UIControlState)state;

@end

и содержание UIButton + ColoredBackground.m

#import "UIButton+ColoredBackground.h"
#import <QuartzCore/QuartzCore.h>

@implementation UIButton (ColoredBackground)

- (void)setBackgroundImageByColor:(UIColor *)backgroundColor forState:(UIControlState)state{

    // tcv - temporary colored view
    UIView *tcv = [[UIView alloc] initWithFrame:self.frame];
    [tcv setBackgroundColor:backgroundColor];

    // set up a graphics context of button's size
    CGSize gcSize = tcv.frame.size;
    UIGraphicsBeginImageContext(gcSize);
    // add tcv's layer to context
    [tcv.layer renderInContext:UIGraphicsGetCurrentContext()];
    // create background image now
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    // set image as button's background image for the given state
    [self setBackgroundImage:image forState:state];
    UIGraphicsEndImageContext();

    // ensure rounded button
    self.clipsToBounds = YES;
    self.layer.cornerRadius = 8.0;

    [tcv release];

}

@end

Новый метод вызывается только для каждого экземпляра UIButton, например:

[myButton setBackgroundImageByColor:[UIColor greenColor] forState:UIControlStateNormal];

Answer 5

http://github.com/dermdaly/ButtonMaker

Вы можете генерировать изображение UIbutton с помощью этого приложения ... и можете установить его в качестве фонового изображения для вашей кнопки

Answer 6

Установите тип кнопки «пользовательский» в палитре атрибутов кнопки. Это даст вам квадратную кнопку с тем цветом, который вы выбрали для фона.

Если вам нужна кнопка, которая больше похожа на традиционную кнопку, но имеет другой цвет, вам нужно зайти в какое-то программное обеспечение для редактирования изображений и создать его (я использую Photoshop для пользовательских кнопок).

Answer 7

Эта ссылка предоставляет элегантное решение вашей проблемы ... http://www.cimgf.com/2010/01/28/fun-with-uibuttons-and-core-animation-layers/

Answer 8

Чтобы кнопка была закругленной, как насчет использования

view.layer.cornerRadius = 8;

здесь описано

Как создать UILabel с круглыми углами на iPhone?

Answer 9

Я немного изменил версию кода @Patch. Проблема для меня заключалась в том, что старая версия растягивала угол поворота как-то грязно при переключении из портретного в ландшафтный режим. Так что я сделал эту версию, используя stretchableImageWithLeftCapWidth: метод topCapHeight.

#import "UIButton+ColoredBackground.h"
#import <QuartzCore/QuartzCore.h>

#define kCornerRadius 8.0f
#define kStrokeColor [UIColor blackColor]
#define kStrokeWidth 1.0f

@implementation UIButton (ColoredBackground)

- (void)setBackgroundImageByColor:(UIColor *)backgroundColor forState:(UIControlState)state{


CGSize gcSize = CGSizeMake(2*kCornerRadius +1, self.bounds.size.height);
UIGraphicsBeginImageContext(gcSize);
CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeOverlay);



CGColorSpaceRef rgb = CGColorSpaceCreateDeviceRGB();

UIColor *gradientStart = [UIColor colorWithRed:0.80 green:0.80 blue:0.80 alpha:0.2];
UIColor * gradientEnd = [UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.2];
NSArray *colors = [NSArray arrayWithObjects:(id)gradientStart.CGColor, (id)gradientEnd.CGColor, nil];
CGFloat locations[2] = { 0.0f, 1.0f };
CGGradientRef _gradient = CGGradientCreateWithColors(rgb, (__bridge CFArrayRef)colors, locations);
CGColorSpaceRelease(rgb);
CGContextDrawLinearGradient(UIGraphicsGetCurrentContext(), _gradient, CGPointMake(0.0, kStrokeWidth), CGPointMake(0.0, self.bounds.size.height-kStrokeWidth), 0);

UIBezierPath *outsideEdge = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0.0, 0.0, gcSize.width, gcSize.height) cornerRadius:kCornerRadius];
[backgroundColor setFill];
[kStrokeColor setStroke];
outsideEdge.lineWidth = kStrokeWidth;
[outsideEdge stroke];
[outsideEdge fill];

// Create the background image
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();    
UIGraphicsEndImageContext(); 

// Set image as button's background image (stretchable) for the given state
[self setBackgroundImage:[image stretchableImageWithLeftCapWidth:kCornerRadius topCapHeight:0.0] forState:state];

// Ensure rounded button
self.clipsToBounds = YES;
self.layer.cornerRadius = kCornerRadius;



}

@end

Использование не изменилось. Теперь это выглядит более четко по краям, и я также добавил градиент, чтобы сделать его более пластичным. но вы также можете удалить это.

Answer 10

Вот вариант решения @ user200212 (http://stackoverflow.com/a/8547424).. Он использует класс UIBezierCurve, чтобы заполнить кнопку и нарисовать черную границу 1px вокруг нее:

UIButton + ColoredBackground.h

//  UIButton+ColoredBackground.h

#import <UIKit/UIKit.h>

@interface UIButton (ColoredBackground)

- (void)setBackgroundColor:(UIColor *)backgroundColor forState:(UIControlState)state;
+ (UIColor *) silverColor;

@end

UIButton + ColoredBackground.m

//  UIButton+ColoredBackground.m
#import "UIButton+ColoredBackground.h"
#import <QuartzCore/QuartzCore.h>

@implementation UIButton (UIButton_ColoredBackground)

- (void)setBackgroundColor:(UIColor *)backgroundColor forState:(UIControlState)state{

    CGSize gcSize = self.bounds.size;
    UIGraphicsBeginImageContext(gcSize);

    // Create a Bezier Path around the button, and fill it with the background color
    UIBezierPath *outsideEdge = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:8.0f];
    [backgroundColor setFill];
    [[UIColor blackColor] setStroke];
    outsideEdge.lineWidth = 1.0;
    [outsideEdge fill];
    [outsideEdge stroke];

    // Create the background image
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();    

    UIGraphicsEndImageContext(); 

    // Set image as button's background image for the given state
    [self setBackgroundImage:image forState:state];

    // Ensure rounded button
    self.clipsToBounds = YES;
    self.layer.cornerRadius = 8.0;
}

@end

Использование:

[myButton setBackgroundImageByColor:[UIColor greenColor] forState:UIControlStateNormal];