In my FirstViewController I have write this code for switch background if device is iPhone4 or iPhone5:
Filename:
bg-for5-568#2x.png
bg-for4#2x.png
bg-for4.png
- (void)viewDidLoad
{
[super viewDidLoad];
UIImage *backgroundImage = [[UIImage alloc] init];
if([[UIScreen mainScreen]bounds].size.height == 568)
{
backgroundImage = [UIImage imageNamed:#"bg-for5-568h"];
}
else
{
backgroundImage = [UIImage imageNamed:#"bg-for4"];
}
self.view.backgroundColor = [[[UIColor alloc] initWithPatternImage:backgroundImage] autorelease];
[backgroundImage release];
}
When i lanch the app on my simulator, the background for iphone5 show double size, out of the view.
/* RESOLVED THANK YOU */
I am not sure if this is the solution for this problem as I am missing some infos, but:
At first: Strip the .png from your imageNamed: method. Since iOS4, you shouldn't do this anymore. The next thing is: What are the Names of your image? Note that an iPhone5 has a retina display, and your image should be named bg-for5-568h#2x.png but referred in the sourcecode as bg-for5-568h.
Besides that: In almost every case where your image isn't a photograph, what you are doing is a bad idea. And even if it is a photograph, simply use the bigger image for the iPhone 4 and 4S as well. It's not that much bigger, so the memory footprint isn't a problem here! Have a look on UIImageView's contentMode property. You can use this to adjust the position of the larger image. You also might want to check UIImageViews clipSubviews property to clip the image if it isn't fullscreen.
Trust me, in my company we had a loot of hooks for stuff like ~ipad, ~iphone, ~2x and even stretchable images. And all these hooks worked fine till the date, apple announced something similar or simply a new device. So I decided to not do these kind of hooks anymore. They seem to be very helpful in the first place, but the trouble you get when there is something new on the market isn't worth it!
You should append #2x suffix to all of your retina images.
In your case your image should be stored as "bg-for5-568h#2x.png".
Hope it will resolve the issue.
I would not advise doing this, what if Apple change their screensize again and you have to go back and rewrite all your code?
A simple fix is to use:
self.view.backgroundColor = [UIColor colorWithPatternImage:/* your image*/];
This could give you some issues with stretching or tiling.
I prefer using
UIImage* imageName = [[UIImage imageNamed:/*image name*/]resizableImageWithCapInsets:UIEdgeInsetsMake(top,left,bottom,right)];
In iOS 6 you can improve this further by defining if you want the image to stretch or tile. This allows you to create a border which won't change and then the centre of your image by default being tiled and filling the space of your imageview
Related
I've literally piled through hundreds go searches on google :(. I can't seem to figure out what I'm doing wrong when I create an image in photoshop (960 x 600, -40 for the status bar). The image comes out to this:
When it should look like this:
(note this is not the actually size, crappy thumbnail version :P. The size is as stated above)
This is my code:
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"MenuBkground.png"]];
Am I doing something wrong when I make the image? Is it in the code? Any ideas?
You're using colorWithPatternImage which basically means what it says. The image will repeat itself if the space is not entirely consumed by the image. If you want to have a true background image you should create the image as a subview.
UIImage* image = [UIImage imageNamed:#"MenuBKground.png"];
UIImageView* background = [[UIImageView alloc]initWithImage: image];
[self.view addSubview: background];
Another way if your using interface builder,
Drag an image view to your viewController.
Assign that as MenuBkground.png in the inspector (first drop down box)
On my iPhone app, I simply want to set a particular background image, which depends on whether it's an iPhone 5 or not.
So, I tried two approaches:
A) Using
self.view.backgroundColor = [UIColor colorWithPatternImage:backGroundimage];
B) Creating an UIImageView and setting up the image there. Code:
UIImageView *backgroundImageView = [[UIImageView alloc]initWithFrame:screenBounds];
[backgroundImageView setImage:[UIImage imageNamed:backGroundImage]];
[self.view addSubview:backgroundImageView];
But I am having issues with both of them:
Issues with Step A:
When I set the image through that way, I have to deal with the image scaling issues for different sizes of the screen. I use the following code to do the scalling:
UIGraphicsBeginImageContext(screenBounds.size);
[[UIImage imageNamed:backGroundImage] drawInRect:screenBounds];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
self.view.backgroundColor = [UIColor colorWithPatternImage:image];
Another issue from Step A is that the image appears quite blurry. It doesn't have the same sharpness to it.
Issues with Step B:
With this, the image looks really crisp and sharp - just the way it should look.
But when I switch to another view using the following code, strangely enough the UIImageView backgroundImageView still appears on the second one. The code I use to switch views is:
[self presentViewController:secondViewController animated:YES completion:nil];
I even tried [backgroundImageView removeFromSuperview], but that doesn't solve anything either.
So what am I doing wrong? And how can I set up a picture as my background which is dependent on the size of the iphone?
Plan B is a good plan. Presenting another view controller should and will definitely hide your image view. If it isn't happening, then it's a problem with the creation of secondViewController, unrelated to the background image on the presenting VC.
Before presenting secondViewController, log it:
NSLog(#"presenting %#", secondViewController);
I'll bet a dollar that it's nil. If I'm right, let's have a look at how you initialize secondViewController. That's the problem, unrelated to the background image view.
Okay, I finally fixed this issue, although the cause of this issue is still puzzling to me.
To fix this, I had to create an IBOutlet property for UIImageView and hook it up on the XIB file.
The reason I was programmatically creating the UIImageView is because the size of the UIImageView depends on what size iPhone they are using. But for the IBOutlet (let's call it as UIImageViewOutlet, I simply used [self.UIImageViewOutlet setFrame:] to get the size and location that I wanted.
I also discovered that one of the buttons that I was programmatically creating, was still visible in the secondViewController. I ended up creating an Outlet on the XIB file for that one as well and used setFrame on it to position it properly.
If anyone who knows the reason of this problem, I will be very grateful.
Anyone ever seen the problem of [UIColor initWithPatternImage] ignoring the alpha values of the PNG? If so, what's the best fix?
I am using a png as a background layer to my array of button objects and it contains several pre-set alpha values per pixel in the image that is to be used as a texture background. It loads fine as a pattern/texture-color, but it comes up with all key transparent area as opaque black.
It is important that I get the right alpha values so that the button images shows correctly. The button frames do not include the alpha shadows from the background as that is not the "clickable" portion of the button. Additionally, my button object's images and background images also makes use of transparency, so it really needs to have a clear background directly behind each button to let the proper true current color settings come through (lowest layer UIView will have its background color set to the current user's selected color). Setting just the single alpha value for the UIView layer containing this texture does not work for my needs either.
Any help would be appreciated. My current workaround would be to use fully-blown, repeatedly-programmed layout of several UIImageView using the png, instead of a single UIView with the pattern fill.
Here is a snippet of code, but it's pretty standard for turning a UIImage into a UIColor for use as a pattern/texture color:
UIView *selectorView = [[UIView alloc] initWithFrame:CGRectMake(0,0,320,320)];
UIColor *background = [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:#"SelectorViewBackground.png"]];
selectorView.backgroundColor = background;
[mainView addSubview:selectorView]; // pattern background layer. Add UIButtons on top of this selectorView layer
[self addSubview:mainView]; // current user selected color set in mainView.
[selectorView release];
[background release];
I had the same problem with setting a background on a UIView with some transparancy,
this is how I solved it:
theView.backgroundColor = [UIColor clearColor];
theView.layer.backgroundColor = [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:#"the_image_with_transparancy.png"]].CGColor;
This is probably related to:
Tiled Background Image: Can I do that easily with UIImageView?
Basically, try setting:
[view setOpaque:NO];
[[view layer] setOpaque:NO];
No I've never had an issue with this. I use code like the above all the time for apps (though often I use it in conjunction with a layer instead of a view but that shouldn't make a difference with transparency being recognized) and always have had transparency work fine.
I'd look into your PNG file. I've noticed iOS sometimes being finicky with certain PNG options/types (like an 8 bit PNG with 8 bit transparency). Make sure your PNG is saved as 24 bit with 8 bit transparency (32 bit total).
Also, stupid question, but have you verified there isn't anything black in the view/layer hierarchy behind your PNG? Sometimes it's the stupid things like that
For those who might need the work-around code where the background patterns can be laid out as rows in a UIScrollView, here it is (adjusted to remove confidentiality concerns, should work if variables properly set prior to call).
Note that there should be ways to reuse just the one allocated instance of UIImageView multiple times to either save memory or load times but time-to-market is my No. 1 driver right now. Enjoy the journey :)
UIImageView *selectorView;
for (int i = 0; i < numRows; ++i) {
selectorView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"SelectorViewBackground.png"]];
selectorView.frame = CGRectMake(0, i * patternHeight, patternWidth, patternHeight);
[mainView addSubview:selectorView];
[selectorView release];
}
If I create a PNG image in Photoshop and lower the opacity so it's 85% opaque, how can I maintain that same level of transparency when I add it to my iOS app?
I'm trying to set the background image of a UILabel to be this image, but the background image for the UILabel is fully opaque in my iOS app. Here's my code...
[lbl setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:#"labelBackground.png"]]];
Am I missing something or is this not possible?
Thanks so much for your wisdom!
If I were you, I'd put an UIImageView containing the image behind your UILabel. Then make sure your UILabel and UIImageView backgroundColors are both set to [UIColor clearColor]. That's how I do it anyway.
Have you tried lbl.opaque = NO;?
From my experience, iOS preserves opacity for PNG images.
I think I have an idea of what MAY be wrong (and pardon me for making any wrong assumptions)...
In photoshop, when saving a PNG image, there's an option to "Save Transparency" or something like that. Make sure that is checked before you save the PNG.
If this is not the problem, you can always use:
UIImageView.opacity = 85.0f/100.0f;
Let me know if this solves your problem :)
I ran into some background issues just like you, but I learned that most UIView subclasses have a backgroundView property which is accessed like this:
[aView backgroundView];
or
aView.backgroundView = someView;
UIImageViews keep the opacity of images. With these two things in mind you can just do:
UIImageView *imageView = [UIImageView initWithImage:[UIImage imageNamed:#"YourImage.png"]];
myLabel.backgroundColor = [UIColor clearColor];
myLabel.backgroundView = imageView;
I hope you find this useful.
Current I am trying to show a simple table in my iPhone application where I use UITableViewCell's with the style UITableViewCellStyleValue1 (image to the left, detail-label right-alligned). The cells all have the default height (50.0f). Before I add an image to the cell, I resize the image to be 40x40, so that it is not the total height of the cell (I think that looks ugly).
I do this with this code:
cell.imageView.image = [UIImage imageNamed:#"icon.png"];
cell.imageView.image = [RootViewController imageWithImage:cell.imageView.image scaledToSize:CGSizeMake(40, 40)];
This is all very nice and works flawlessly. But I want to accomplish this also on the iPhone 4 (with the higher resolution screen). The problem is, that everything is scaled without problems on the iPhone 4 but the images appear very pixelated.
The reason for this is ofcourse that everything on the screen is blown up to scale to the new resolution, also the images, so the images should probably be something like 80x80. But when I resize them to 80x80 (originals are 120x120) they appear way to big, because of the scaling thing.
Is there a way to actually make my images not the complete height of a tablecell, but I want them in the higher resolution on the iPhone 4. Should I create a complete new View for this?
Oops, after the first reply I realised that my own written function was missing:
+ (UIImage*)imageWithImage:(UIImage*)image scaledToSize:(CGSize)newSize
{
UIGraphicsBeginImageContextWithOptions(newSize, NO, [[UIScreen mainScreen] scale]);
[image drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
UIImage* newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
As you can see, after the first reply, I tried to get this to work with the method UIGraphicsBeginImageContextWithOptions but somehow this results in an empty image.
I assume you wrote "imageWithImage:scaledToSize:", right?
I further assume you use "UIGraphicsBeginImageContext(yourSize)" within this call. Replace that with "UIGraphicsBeginImageContextWithOptions(yourSize, NO, 2.0)" in case your platform is iPhone 4.
The "2.0" defines the scale factor for points (you define the size in points not in pixels). On pre-retina-display a point is 1x1 pixel. On retina display a point is 2x2 pixels.
Edit:
Make sure you have a high-res version of "icon.png" in your resources called "icon#2x.png". This is automatically loaded in case it is a retina display.