I'm trying to assign a custom image to UITabBarItem in storyboard. Unfortunately, it shows me an box instead of an image.
Here's my PNG image
Storyboard:
How it appear in simulator:
As it turned out in order do display an actual image following code should be executed.
[self.activityItem setImage:[[UIImage imageNamed:#"activity.png"]
imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
Note the Rendering Mode of UIImage. You can find more about it UITabBar Reference Thanks to # Vladislav Kovalyov
Go to Assets folder. Select your tab image. On the right side under Attributes you will find "Render As". Select "Original Image".
Related
I have an UITabBar and set 2 images for a tab(active item, deactive item). On deactive item tab icon shown properly as:
Image here
but when those item is active, icon not shown properly:
Image here
Can anyone help me to fix it? I was that it will colour just borders of the icon, not entirely
Check this screenshot: At right side of the screen see 'Rendered as' text and select drop down and use Original image. Your problem would be solved. Hope this helps..
You need to use UIImageRenderingMode for that.
UIImage *imgNormal=[UIImage imageNamed:#"normal.png"];
imgNormal=[imgNormal imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIImage *imgSelected=[UIImage imageNamed:#"active.png"];
imgSelected=[imgSelected imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
tabBarItem.image = imgNormal;
tabBarItem.selectedImage = imgSelected;
Hope it helps :).
I am trying to replace the bar button items in my toolbar with images. I was able to select image in the attribute inspector. But now the text is replaced with image. Is there anyway i can keep both text and image (text should be below image)
What i have is this.
Please click to see image
What i am looking for is something like this
Please click to see image
Thanks for helping.
You can place the image in the selected image attribute
And you can place the text in the bar item title attribute
Something like this
This can be done when you do to the navigation controller for that particular tab.. Like in your case navigation controller for item 1
Hope that helps
The bar item images I prepared are about 35*35
and I use the Sketch to export the [1x & 2x] size images;
(I can't insert any images for instances at here because of my zero reputation//Sorry about this!)
Then it displays a blue square :<
the function and title of Item is OK
BUT just the icons are wrong
Could someone tells me how to fix it!
Appreciate!!!
I figure it out!
There is nothing wrong with your code or setting
It's about your IMAGEs
You can just look at the apps on your phone.(almost)Any tab bar item icons are in gray.
So the Icon will just display their UN Hollow parts in gray!!
[Additionally,according to official API,they wrote like this:
By default, unselected and selected images are automatically created from the alpha values in the source images. To prevent system coloring, provide images with UIImageRenderingModeAlwaysOriginal.
]
Consequently the solution is : USE Sketch to make your instance's icon heart-part to be hollow
You need to add #3x image too.
In Xcode 6, you now have the ability to set the icon for a tab item for its selected and unselected states. Please see the descriptions in the images below:
and
The only problem is that the image for the SELECTED states does not show. It just shows blank. Anyone else have this issue? Please see the screenshots below of the results:
and
Thanks!!!
So the way to go around this:
Set the tab with the default, unselected icon image you want to use in the "BAR ITEM" section in the Attributes Inspector:
Click on the Identity Inspector, and under "USER DEFINED RUNTIME ATTRIBUTES," click the + to add a new value.
KEYPATH: selectedImage (IT HAS TO BE THIS!!!)
TYPE: Image
VALUE: The name of your selected/highlighted icon image. I use Images.xcassets for my image assets.
Run your app. You'll notice that the image changes to the selected (not just highlighted version of it.
Works like a charm.
I want to add some info about the colored tab icon.
To change tab selection color:
Select the tabItem.
Set "tintColor" attribute with your prefer color.
I am trying to customize a bar button item. I dragged it in the navigation bar and I can display text and predefined identifiers.
However it does not display custom images (44x44 & 22x22 px).
Any ideas what might be wrong?
I think may be you did not give the Path Extention. It will be "10-medical.png" or other path extention instead png like jpg gif etc.