I have created .png icons 20 x 20 and when I set the image property in the nib they just appear grey blocks.
Any ideas?
UPDATE: Here is one of the icons!
The standard tabbar icons in iOS are rendered solely from the alpha channel. Colors are ignored completely. Instead of colors you can use different alpha values that lead to a different shade of gray (or blue if selected)
Make the background of your icons transparent.
Download these attached images and pass them to your designer and ask him to just create images like these (when you open them in PS you'll know the difference)
This happened to me in iOS 5, I got around it by setting UIImage Outlet property in the Xib to 'Custom' and then set the label programmtically so : imageOne = [UIImage imageNames#"Dog.png"];
Try saving the file as png interlaced. In photoshop at least it gives you an option of interlaced or normal.
Related
I have a couple of NSButtons which act like player controls (play, pause etc.)
When I assign image to them, that image looks blurry.
let playPauseButton: NSButton = {
let btn = NSButton(frame: .zero)
let image = NSImage(named: "pauseIcon")
btn.imageScaling = NSImageScaling.scaleNone
btn.image = image
btn.setAccessibilityLabel("Pause")
btn.isBordered = false
return btn
}()
The image can be viewed on:
https://www.dropbox.com/s/38tvh49ikc2m4x7/Play.pdf?dl=0
This image is .pdf, but I tried .png with 1x,2x and 3x, and it still looked blurry.
I also checked this question:
Images in NSButton and NSImageView Blurred
But it did not help me either.
The solution was very simple.
Open the asset catalog.
Select all your assets that are blurry.
Open the attribute inspector by pressing: command + option + 4.
Check the box that says "Preserve vector data".
Under that checkbox, look for the "Scale" and set it to "Single scale"
Please note that this only works if your designer exported icons as a PDF file. Also, it wont work if you just convert .png or .jpg to .pdf, the actual vector image must be exported to .pdf.
Here are a number of to try that have fixed blurry edges for me in the past.
Assuming you're running in Mojave and/or using layer backed views, be sure that the NSButton draws its own background color ( setDrawsBackground YES ). Otherwise what can happen with CoreAnimation CALayer is that the blending operation of the NSImage background alpha is substandard/wrong.
This shouldn't apply to an NSImage, but maybe its worth a shot: http://stackoverflow.com/questions/5722085/nsbezierpath-rounded-rectangle-has-bad-corners
[nsImage setScalesWhenResized:NO];
try different NSCompositingOperation NSCompositeCopy vs. NSCompositeSourceOver
So I've done a button for my iPad app, and I saw something strange. When I run my app in the iOS 5 simulator, it changes the color, and the lines of my button become discontinuous. But when I push it, the button comes back to the right color, and the lines are ok. I think it's something that Xcode does automatically with any button, and I don't find the way to cancel it. Thank you for helping!
PS: The button code is so simple:
IBOutlet UIButton *button;
This is what it should look like:
And this is how it looks in the simulator:
Both tams and JacobFennell have good points, but you should also note that graphics are often represented much differently on the simulator than on a real device. You should try running your app on a device and see if the problem persists; I have had many 'problems' with custom buttons which turned out just to be improper rendering on the part of the simulator.
Since you are using the Interface builder, make sure that you are setting the button type to custom and that you have changed the behavior for all of the states. Under the dropdown menu of where you can set the type they also have StateConfig, where you can configure the look and text of your button for all of its different states: highlighted, default, disabled...Check that those settings are correct as well.
Hope this helps!
Tams
Your button frame size doesn't seem to match the size of your image. Your art should match the (button/view) frame size pixel for pixel, otherwise you may get blurry images and scaling representation artifacts.
Else, you can change the view content mode (UIViewContentMode) of the frame from UIViewContentModeScaleToFill to UIViewContentModeTopLeft
I am trying to put an image that contains a text on UITabBarItem.
I went to our Graphics designer and asked him to create an image for me that contains a text "Summary".
He actually did. ( a png image).. but when I put inside the app, I saw a horrible look..
The Image:
How it look in the app:
To create an image for a tab bar or toolbar item, you or your designer must work in the image's alpha channel. The colors in the image don't matter at all, the OS only is interested in the alpha channel. In your case, the background of your image should be fully transparent instead of black.
It is absolutely possible for you to use custom colors and images instead of the ones provided to you by Apple's own UITabBarController. I used the code explained in this (really thorough) tutorial - works great.
I am trying to draw an image that has some transparent regions.
I load the image using
image = [UIImage imageNamed:#"testimage.png"];
and draw it using
[image drawAtPoint:CGPointMake(0,0)];
The UIView on which I draw the image is not opaque (and it has a transparent background color).
The problem is that everything works fine on the simulator, but when I run the app on my iPhone the transparent color becomes black! Can anyone pinpoint my error?
I had the same problem today with a picture of mine. I've created the picture my self in GraphicConverter.
My solution was to add an alpha channel to the picture. I did this with GraphicConverter using the command found in Picture => Alpha Channel => Create Alpha Channel with transparency . It could be that the command has a different name for you as I use the app with a german language setting.
Hope this helps.
The correct answer to this problem is the .PNG format you are saving your image with. If you save as PNG-8, you will run into this problem more often that not, since it only supports 1 transparent color. If you open your .PNG file and then re-save it as a 24-bit format, you will gain genuine transparency.
Reference this thread for discussion and clarification.
EDIT: Just to be clear, .PNG does not have an 'alpha channel', so Chris' answer is misleading. Just be sure to save in 24-bit format with transparency enabled.
I solved my problem by loading it into colorsync and then saving it.
I have 6 images, all the same size (65x65). When I create an imageview and add this image through the "image view attributes" in the interface builder, the picture is very small. Maybe 5x5. The pictures also show up small when viewing them in the resource folder however, when running the program, they are the right size. Is there some setting I need to change to get the images to show the full size/full resolution within the interface builder?
Thanks.
Make sure your UIImageView is active, then go to Layout -> Size to Fit (Command + '=' should also do the trick). This way the UIImageView will resize to fit the image and it'll look nice when looking at your stuff in IB.
Adjust the resolution of your image files to 72 dpi.