Is it possible to change a UIButtons background color

Question

This one has me stumped   Is it possible at all to change the background color of a UIButton in Cocoa for iPhone   I ve tried setting the background color but it only changes the corners  setBackgroundColor  seems to be the only method available for such things    random setBackgroundColor  UIColor blueColor     random titleLabel setBackgroundColor  UIColor blueColor

User · Answer

You can also add a CALayer to the button - you can do lots of things with these including a color overlay  this example uses a plain color layer you can also easily graduate the colour   Be aware though added layers obscure those underneath    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

User · Answer

Well I m 99  percent positive that you cannot just go and change the background color of a UIButton  Instead you have to go and change the background images yourself which I think is a pain  I m amazed that I had to do this   If I m wrong or if theres a better way without having to set background images please let me know   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

User · Answer

Another possibility  the best and most beautiful imho    Create a UISegmentedControl with 2 segments in the required background color in Interface Builder  Set the type to  bar   Then  change it to having only one segment  Interface builder does not accept one segment so you have to do that programmatically   Therefore  create an IBOutlet for this button and add this to the viewDidLoad of your view    segmentedButton removeSegmentAtIndex 1 animated NO     Now you have a beautiful glossy  colored button with the specified background color  For actions  use the  value changed  event    I have found this on http   chris-software com index php 2009 05 13 creating-a-nice-glass-buttons    Thanks Chris

User · Answer

I assume you re talking about a UIButton with UIButtonTypeRoundedRect  You can t change the background color of that  When you try changing it s background color you re rather changing the color of the rect the button is drawn on  which is usually clear   So there are two ways to go  Either you subclass UIButton and overwrite its -drawRect  method or you create images for the different button states  which is perfectly fine to do    If you set the background images in Interface Builder you should notice that IB doesn t support setting images for all the states the button can have  so I recommend setting the images in code like this   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      The last line shows how to set an image for the selected  amp  highlighted state  that s the one IB can t set   You don t need the selected images  line 4  amp  6  if you re button dosn t need a selected state

User · Answer

Subclass UIButton and override 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       My darkerShade method is in a UIColor category like this  - UIColor   darkerShade      float red  green  blue  alpha     self getRed  amp red green  amp green blue  amp blue alpha  amp alpha      double multiplier   0 8f    return  UIColor colorWithRed red   multiplier green green   multiplier blue blue multiplier alpha alpha

User · Answer

This can be done programmatically by making a replica   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  of course  you d have to  import  lt QuartzCore QuartzCore h gt   edit  to all new readers  you should also consider a few options added as  another possibility   for you consideration   As this is an old answer  I strongly recommend reading comments for troubleshooting

User · Answer

Swift 3           static func imageFromColor color  UIColor  width  CGFloat  height  CGFloat  - gt  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

User · Answer

If you are not wanting to use images  and want it to look exactly like the Rounded Rect style  try this   Just place a UIView over the UIButton  with an identical frame and auto resize mask  set the alpha to 0 3  and set the background to a color   Then use the snippet below to clip the rounded edges off the colored overlay view   Also  uncheck the  User Interaction Enabled  checkbox in IB on the UIView to allow touch events to cascade down to the UIButton underneath    One side effect is that your text will also be colorized    import  lt QuartzCore QuartzCore h gt   colorizeOverlayView layer cornerRadius   10 0f  colorizeOverlayView layer masksToBounds   YES

User · Answer

I know this was asked a long time ago and now there s a new UIButtonTypeSystem  But newer questions are being marked as duplicates of this question so here s my newer answer in the context of an iOS 7 system button  use the  tintColor property    let button   UIButton type   System  button setTitle  My Button   forState   Normal  button tintColor    redColor

User · Answer

I have a different approach    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    From 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      Don t forget to  import  lt QuartzCore QuartzCore h gt

User · Answer

Per  EthanB suggestion and  karim making a back filled rectangle  I just created a category for the UIButton to achieve this    Just drop in the Category code  https   github com zmonteca UIButton-PLColor  Usage    button setBackgroundColor uiTextColor forState UIControlStateDisabled     Optional forStates to use   UIControlStateNormal UIControlStateHighlighted UIControlStateDisabled UIControlStateSelected

User · Answer

For professional and nice looking buttons  you may check this custom button component  You can use it directly in your views and tableviews or modify the source code to make it meet your needs  Hope this helps

User · Answer

Another possibility    Create a UIButton in Interface builder  Give it a type  Custom  Now  in IB it is possible to change the background color   However  the button is square  and that is not what we want  Create an IBOutlet with a reference to this button and add the following to the viewDidLoad method    buttonOutlet layer setCornerRadius 7 0f    buttonOutlet layer setClipToBounds YES     Don t forget to import QuartzCore h

User · Answer

myButton setBackgroundColor  UIColor blueColor     myButton setTitleColor  UIColor whiteColor  forState UIControlStateNormal    It s possible change this way or going on Storyboard and change background on options in right side

User · Answer

This isn t as elegant as sub-classing UIButton  however if you just want something quick - what I did was create custom button  then a 1px by 1px image with the colour I d want the button to be  and set the background of the button to that image for the highlighted state - works for my needs

User · Answer

add a second target for the UIButton for UIControlEventTouched and change the UIButton background color   Then change it back in the UIControlEventTouchUpInside target

[objective-c] Is it possible to change a UIButtons background color?

Examples related to objective-c

Examples related to iphone

Examples related to cocoa-touch

Examples related to uibutton