I have a bar with Bar Items, my .png image has green color, but when i add it to storyboard it's displaying as blue.
How can i make it display the image as it is?
Use tintColor of UIBarButton to set the desired color for the image.
If its absolutely necessary to use original image colors, use this to set the image:
[aBarButton setImage:[[UIImage imageNamed:#"xyz.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
The docs are a little ambiguous about this
The images displayed on the bar are derived from this image. If this
image is too large to fit on the bar, it is scaled to fit. Typically,
the size of a toolbar and navigation bar image is 20 x 20 points. The
alpha values in the source image are used to create the images—opaque
values are ignored.
Essentially what this is saying is the image you supply will not be what is actually displayed. Instead the system uses the alpha mask of the image and the tintColor of the item to generate the final display.
add image programmatically
[button setImage:[[UIImage imageNamed:#"imageName.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] forState:UIControlStateNormal];
if its not work then try this:-
UIImage *myImage = [UIImage imageNamed:#"myImageFile.png"];
myImage = [myImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIBarButtonItem *menuButton = [[UIBarButtonItem alloc] initWithImage:myImage style:UIBarButtonItemStylePlain target:self action:#selector(menuObject:)];
self.navigationItem.leftBarButtonItem = menuButton;
if its not work then try this:-
#define setTurqoiseColor [UIColor colorWithRed:68.0f/255.0f green:181.0f/255.0f blue:223.0f/255.0f alpha:1.0]
UIBarButtonItem *menuButton = [[UIBarButtonItem alloc] initWithImage:buttonImage style:UIBarButtonItemStyleBordered target:self action:#selector(toggleMenu)];
menuButton.tintColor = setTurqoiseColor;
To set tint color of bar item global, in your App Delegate, add these lines of code
UIBarButtonItem *barButtonAppearance = [UIBarButtonItem appearance];
[barButtonAppearance setTintColor:[UIColor redColor]]; // set to your color
[[UIBarButtonItem appearance] setTintColor:[UIColor redColor]];
You have to set your UITabBar tintColor.
If you would like to add a custom color / gradient you can set your tabBarItem image and selectedImage property as follow:
customTabBarItem.selectedImage = UIImage(named: "customSelectedImage")!.imageWithRenderingMode(.AlwaysOriginal)
customTabBarItem.image = UIImage(named: "customUnselectedImage")!.imageWithRenderingMode(.AlwaysOriginal)
Related
How come the icon info.png stays blue and don't comes with the original color of that image? I am using the following code below:
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:#"info.png"]
style:UIBarButtonItemStylePlain
target:self
action:#selector(info:)];
By default, image in UINavigationBar's bar button items is rendered using template mode. You can set it to original.
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithImage:[[UIImage imageNamed:#"info.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]
style:UIBarButtonItemStylePlain
target:self
action:#selector(info:)];
Swift 3:
let image : UIImage? = UIImage.init(named: "heart.png")!.withRenderingMode(.alwaysOriginal)
I know this is too late to answer this question but I see there is a very simple way to solve this issue instead of doing some changes in the code
using Xcode
Go to the Assets --Select Image --- check Render as and select Original image instead of default property .
You can it from assets as well. Go to Assets.xcassets >> Select the image that is being used as barbutton item image. Tap on attribute inspector in right side panel. Choose render as to orignial image. It will be default earlier. You will now see colored image.
Swift 4:
let image = UIImage(named: "imageName")?.withRenderingMode(.alwaysOriginal)
navigationItem.leftBarButtonItem = UIBarButtonItem(image: image, style: .plain, target: self, action: #selector(leftBarButtonPressed))
For Swift 2.1+ it would look like this:
let image : UIImage? = UIImage(named:"myImage.png")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
or simply
let image : UIImage? = UIImage(named:"myImage.png")!.imageWithRenderingMode(.AlwaysOriginal)
Because the color of barButtonItems in your app is related to the tintColor property on the application's window.
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
self.window.tintColor = [UIColor redColor];
return YES;
}
Ok, got it... I set the image to it's original state first.
UIImage *image = [[UIImage imageNamed:#"info.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithImage:image
style:UIBarButtonItemStylePlain
target:self
action:#selector(info:)];
Change the bar button item tint color from the storyboard. Or color from the image in storyboard.
The color should be your expected color as hex or rgb.
I want to set image in bar button item like below.
I added this image to Assets.xcassets and when i tried to set image, it changes color automatically.
how can I set image as it is in bar button item?
Well, you have to edit your image first. Make it transparent (PNG) if it's not, and objects must be be white within the image, in your case it's black now. Then in your code change the tint color like this:
let myImage = UIImage(named: "myImage")?.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate)
myImage.tintColor = UIColor.blackColor()
I think you need to change the rendering mode of image to always original.
It is taking template image of your image.
let img:UIImage = UIImage(named: "Bitcoin")!
img.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
try changing the rendering mode of the image before setting it to bar button.
for more info on Image Rendering Mode refer this
for Objective C....
UIImage *img = [UIImage imageNamed:#"Bitcoin"];
UIImage *original = [img imageWithRenderingMode:(UIImageRenderingModeAlwaysOriginal)];
:)
Try to change the Tint colour.
UIImage* image3 = [UIImage imageNamed:#"search_button.png"];
CGRect frameimg = CGRectMake(15,5, 25,25);
UIButton *someButton = [[UIButton alloc] initWithFrame:frameimg];
[someButton setImage:image3 forState:UIControlStateNormal];
[someButton addTarget:self action:#selector(Search_btn:)
forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *searchButton =[[UIBarButtonItem alloc] initWithCustomView:someButton];
self.navigationItem.leftBarButtonItem =mailbutton;
Before iOS 7 I used
[[UITabBar appearance] setTintColor:[UIColor redColor]];
But now it only paint the selected item, I have read some suggestions but I can not fin how to do it, I used this too:
[self.tabBarItem setFinishedSelectedImage:[UIImage imageNamed:#"openbookwp4.png"] withFinishedUnselectedImage:[UIImage imageNamed:#"openbookwp4.png"]];
this put the icon I want, with the color I want, but only after I selected that tab for example, when I open the app the tab looks normal, but after I press the second tab and return to the first, the second tab now has the color I want. It is hard to explain without images, but I can not post images...
This code works on iOS 7.
[[UITabBarItem appearance] setTitleTextAttributes:#{NSFontAttributeName : [UIFont fontWithName:#"HelveticaNeue-Bold" size:10.0f],
NSForegroundColorAttributeName : [UIColor colorWithRed:.5 green:.5 blue:.5 alpha:1]
} forState:UIControlStateNormal];
Set foreground color as you like.
To affect also the non selected tabbar icons:
[[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIColor greenColor], UITextAttributeTextColor, nil]
forState:UIControlStateNormal];
If it does not work the only way is with images for selected and unselected states:
// set selected and unselected icons
UITabBarItem *item = [self.tabBar.items objectAtIndex:0];
// this way, the icon gets rendered as it is (thus, it needs to be green in this example)
item.image = [[UIImage imageNamed:#"unselected-icon.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
// this icon is used for selected tab and it will get tinted as defined in self.tabBar.tintColor
item.selectedImage = [UIImage imageNamed:#"selected-icon.png"];
In my case the problem was that I defined the tab bar items in viewDidLoad only. If you do this, it is clear that the images are only set once the view of the corresponding tab has been loaded, but not at first (when only the first tab is selected).
My solution was to define the custom tab items in the view controller's init method, then the unselected images are visible even when the controller's view has not been loaded yet.
Following on from Nikos Answer
For swift 2.* it would look like this
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.whiteColor()], forState:.Normal)
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.whiteColor()], forState:.Selected)
let Item1 = self.items![0]
Item.image = UIImage(named: "Icon1")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
let Item2 = self.items![1]
Item2.image = UIImage(named: "Icon2")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
let Item3 = self.items![2]
Item3.image = UIImage(named: "Icon3")!.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
Just trying to add a button to a navigation bar from an image.
code:
UIBarButtonItem *newConvoButton = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:#"convos_new.png"] style:UIBarButtonItemStyleBordered target:self action:#selector(newConvoInit:)];
self.navigationItem.rightBarButtonItem = newConvoButton;
result:
(It should be just the dark image without the blue button in the background.)
This is likely overkill for what you want. But I have a good feeling that this will make your life a whole lot easier. The following will give you just an image without any UIBarButtonItem attributes.
UIImage *menuImage = [UIImage imageNamed:#"navBarMenuButton.png"];
UIButton *leftButton = [UIButton buttonWithType:UIButtonTypeCustom];
leftButton.frame = CGRectMake(0, 0, menuImage.size.width, menuImage.size.height);
[leftButton setBackgroundImage:menuImage forState:UIControlStateNormal];
aController.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:leftButton];
This method implements a custom UIButton, which given the frame of the UIImage you're using, will give you nothing else but the image of your choice added to your UINavigationBar.
A bonus is that you don't have to worry about re-sizing anything in case the image ever changes in the future because the frame inherits from the UIImage.
Best of luck!
Im customizing my navbars so they all have a logo in them. I want to add the logo right around here:
I know navbars have a background image property but that would stretch it to the whole navbar. I just want it there! :)
So far Ive tried this:
UIImage *gradientImage44 = [[UIImage imageNamed:#"NavBar25High"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
UIImage *gradientImage32 = [[UIImage imageNamed:#"NavBar25High"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
// Set the background image for *all* UINavigationBars
[[UINavigationBar appearance] setBackgroundImage:gradientImage44 forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundImage:gradientImage32 forBarMetrics:UIBarMetricsLandscapePhone];
But thats for gradients because as I mentioned, it uses the image as a background image :(
I would allocate an ImageView using CGRectMake to the specific location you want it and add that image view to the view of the UINavigationController.
Like this:
Declare the image
UIImage *myImage =[UIImage imageNamed:#"header.png"];
Allocate the image view
myImageView_tools = [[UIImageView alloc] initWithFrame:CGRectMake(97.5, 20, 125, 45)];
Set the image as the image of the imageview
myImageView_tools.image = myImage;
Add this to your navbar.
[nameofyournavbar.view addSubview:myImageView_tools];
In my code I happened to add it to the RootViewController instead of the NavigationBar but I would imagine it would work just the same.
How about adding the image as the custom view of a UIBarButtonItem. Maybe using a UIBarButtonSystemItemFixedSpace item with a specified width.