Why does a UICollectionViewCell with a UIButton have a monochrome/tinted image? - ios

I create a UICollectionView and add a single cell who's only subview is a UIButton. That button has its title and image set. I've verified that the image data is correct in the debugger.
When the button is drawn on screen I see the text and the image however the image looks as if it has been filled with the tint color, obscuring all of the image other than its shape.
What am I missing here to have this show up as a normal button should?
Update
It turns out this is not specific to UICollectionView but rather all UIButtons in iOS7.
iOS 7 makes all images in buttons behave as template images using the alpha channel of the image in concert with the tint color to produce the image (much like the images in a tab bar). There's a new renderingMode property on UIImage which is defaulted to "automatic" which lets the context decide (which is template style for buttons)
This can be circumvented using the new imageWithRenderingMode: method on UIImage:
UIImage* myImage = [UIImage imageNamed:#"Foo.png"];
myImage = [myImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
[button setImage:myImage forState:UIControlStateNormal];

The easiest way to avoid this is to use a different UIButtonType. It's UIButtonTypeSystem on IOS 7 that has this behaviour, so you could use a custom button instead:
UIButton *button = [UIButton buttonWithType: UIButtonTypeCustom];
[button setImage:myImage forState:UIControlStateNormal];

When the UIButton's background color lightText in this way, it will not close the button image.
UIButton.backgroundColor = UIColor.lightText

Related

Custom keyboard buttons iOS

I am trying to setup a highlighted state for keyboard buttons, but have some difficulties with it:
I can't set backgroundImage to be beneath the spaceButton Image, so it won't overlap shift_1 like on the image below (button is tapped).
I can't set up layer margins, so that there would be a space from the bottom and other buttons, and at the same time that spacing would function as that button.
Below is my code:
[self.spaceButton setImage:[UIImage imageNamed:#"shift_1"] forState:UIControlStateNormal];
[self.spaceButton setBackgroundImage:[KeyboardViewController imageFromColor:[UIColor colorWithWhite:0.4 alpha:0.5]]
forState:UIControlStateHighlighted];
self.spaceButton.layer.cornerRadius = 7.0;
self.spaceButton.layer.masksToBounds = YES;
I would be very thankful if anyone could help me.
You would have two ways:
By Image : Just add transparent pixel at bottom,left,right in image and create new image then set that image as in background image of button.
By imageEdgeInsets : Set button imageEdgeInsets and use to image property for set image(Highlighted/Normal state).

How to disable UIButton Tint Color?

I know my case may be rare but how do you disable the UIButton tint colour in this case?
I have a customised UIButton which has attributedTitle to help display the button pattern in different colour and alpha.
In my customised button .m file I have set something like this
[self setBackgroundImage:[self imageWithColor:[UIColor grayColor]] forState:UIControlStateSelected];
which will make the background colour to gray when the button is selected
However the real result looks like this:
Some how the text colour gets turned into white which I think is because of the tint effect on UIButtons.
Is that possible for me to have the background as grey while the text still remain the colour as set in the attributed title on selected state of the button?
Thanks
yourbutton = [UIButton buttonWithType:UIButtonTypeCustom];
(or)
If u placed button in storyboard....Choose button type as custom instead of system.
You can override setImage:forState: in UIButton subclass and change rendering mode to .alwaysOriginal.
override func setImage(_ image: UIImage?, for state: UIControlState) {
let newImage = image?.withRenderingMode(.alwaysOriginal)
super.setImage(newImage, for: state)
}
Simple, just head to the image in your assets, and set its rendering mode to "Original Image", check image below:
Follow this steps to get result:
First set UITabBar background color to clear
Now put this line in viewDidLoad method of the first page:
[[UITabBar appearance] setTintColor:SETYOURCOLOR];
Hope it will help you.

UIButton is faded when pushed

I've set my UIButton normal state to one image and it's highlighted state to another. The button normal is fine but when I push the button down it sets it to a gray faded version of the image it's supposed to be. In the image below the top grayed out button is being pressed and the other buttons are in their normal state.The buttons are programmatically made.
UIButton *button;
UIImage *bluenormalImage = [UIImage imageNamed:#"bluebuttonnormal.png"];
UIImage *bluepressedImage = [UIImage imageNamed:#"bluebuttonpushed.png"];
[button setBackgroundImage:bluenormalImage forState:UIControlStateNormal];
[button setBackgroundImage:bluepressedImage forState:UIControlStateHighlighted];
OK, I didn't realise the text wasn't part of the image. Do this instead:
From what I can see you need to properly initialise the button as a custom type. The highlight issue occurs when the button type is system.
Change your button variable line to the following:
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
If you initialise it later, you can do the following before you set the background image.
UIButton *button
button = [UIButton buttonWithType:UIButtonTypeCustom];

Set image of uiButton in custom table cell

I have a uitbutton within a custom table cell. I am trying to set the buttons image with
[cell.thumbImage setImage:[UIImage imageNamed: #"full_breakfast.jpg"] forState:UIControlStateNormal];
It is displaying a blue button instead of the image like so:
Am I doing this wrong? When i remove the uibutton setImage it returns to the normal button. This SHOULD be fairly simple so sorry if it is.
In iOS7 there is new button type called UIButtonTypeSystem NS_ENUM_AVAILABLE_IOS(7_0), // standard system button
Check your .xib file and change button type to Custom, or programatically you can do this:
[UIButton buttonWithType:UIButtonTypeSystem];

Drawing a UIButton/UIBarButtonItem to use parent bar's tintColor?

I've got a bit of a dilemma. It's not a dealbreaker, but I'm interested in a decent answer if there is one.
I've been using a UIButton with a custom subview inside of a UIBarButtonItem (as the bar button item's customView). My custom subview is not a UILabel nor is it a UIImage, which is why I'm doing what I'm doing. This UIBarButtonItem is an item on my navigation bar, and the navigation bar has a tintColor set. I want the UIButton to have that rounded-rect appearance of UIBarButtonItemStyleBordered, which means it should also take on the tintColor of its parent bar.
Current solutions out there have implemented extracting png files from UIKit for UINavigationBarDefaultButton.png and family. This would look great if I weren't setting a tintColor property; instead the button remains that "iOS navy blue", when I want, say, bright orange (not the color I'm using but you get my drift). Which brings me to my dilemma: what's the best way to make a UIButton look and act like that UIBarButtonItem style, including taking on the tintColor property? I can set that property myself on the button; it's no big deal.
Would I want to draw that UIButton's background in CoreGraphics? Is there a framework/library out there that implements this already? If I'm dreaming the impossible, just tell me. I'm not that awesome with doing CoreGraphics by hand yet, but it's definitely not outside the realm of possibility.
If this can't be done, I know I can always take the cool custom UIView I'm attempting to finagle in and just save it off as an image (and thus use UIImage inside of a UIBarButtonItem), but I'd like to see if this is possible.
This is what I'm dealing with (below). The back button looks awesome, but only because I'm not messing with it. I'd like that rightBarButtonItem to use my tintColor that I have set, but in order to give it that UIBarButtonItemStyleBordered appearance with a customView set, I'm forced to make the button use png files for its background. Below is what you see, even with tintColor set on the UIBarButtonItem (since it's using a png).
I did find this question/answer on Stack Overflow, that gets me close enough that I can wing the rest. It's a well-detailed post about how to tint a UIImage with a UIColor; I've pulled it out into a function and I've posted a gist for that right here.
Combined with that, I've defined a category method on UIButton that lets me create a button with that background image, tinted, and I plop that into an empty UIBarButtonItem.
+ (id)buttonWithBarStyleAndTintColor:(UIColor *)tintColor customView:(UIView *)customView {
UIImage *defaultNormal = [UIImage imageNamed:#"UINavigationBarDefaultButton.png"];
UIImage *defaultPressed = [UIImage imageNamed:#"UINavigationBarDefaultButtonPressed.png"];
UIImage *back = [TintImageWithTintColor(defaultNormal, tintColor)
stretchableImageWithLeftCapWidth:5.0
topCapHeight:0.0];
UIImage *pressed = [TintImageWithTintColor(defaultPressed, tintColor)
stretchableImageWithLeftCapWidth:5.0
topCapHeight:0.0];
UIButton *button = [self buttonWithType:UIButtonTypeCustom];
button.frame = CGRectMake(0, 0, 34.0f, 30.0f);
[button addSubview:customView];
customView.userInteractionEnabled = NO;
customView.frame = CGRectCenterRectInRect(customView.frame, button.frame);
[button setBackgroundImage:back forState:UIControlStateNormal];
[button setBackgroundImage:pressed forState:UIControlStateSelected];
[button setBackgroundImage:pressed forState:UIControlStateHighlighted];
return button;
}
You can try and set the UIButton type to custom and make sure its color is clear, same for your custom view, that way the only visible view will be the UIBarButtonItem tint color.
Also if you are willing to invest, there is this tool called PaintCode that does the code for CoreGraphics for you.

Resources