I would like to apply a texture to my iPhone app similar to the tab bar in GameCenter.app. Is there a good tutorial somewhere that explains this? I am hoping for a method that will translate easily to other controls as well. Thanks!
A simple way to add texture for backgrounds is to use the built in colorWithPatternImage.
UIImage *image = [UIImage imageNamed:#"backgroundPattern"];
[self setBackgroundColor:[UIColor colorWithPatternImage:image]];
If you have a toolbar you should be able to use your "Patternized UIView" with UIBarButtonItem, one of its initializers take a UIView.
Related
I have been looking around but couldn't find anything good about this.
I would like to customize the default UIRefeshControl with different loader, etc. So far I can only change tintColor & attributedTitle properties and most code I found are just basically creating a new "pulltorefresh" effect but what I want is to just use the UIRefreshControl and customize it a bit.
Is this possible?
You can't add different loader without accessing private APIs, but you can add background image:
UIImageView *rcImageView =
[[UIImageView alloc] initWithImage:
[UIImage imageNamed: #"refreshControl.png"]];
[self.refreshControl insertSubview:rcImageView atIndex:0];
assuming self is an instance of UITableViewController subclass.
Image size you need is 320x43px (#2x 640x86px), the middle area (approximately 35px) will be covered by the loader animation.
I show application logo there...
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.
What are the best references to read (online resources or books) to read about the approaches and techniques for integrating custom images, graphics, icons for iOS apps? (What are the best strategy to manage custom images for iOS development?)
Uh, ok, not sure if you need super high level OpenGL graphics performance but if you're making ordinary iPhone apps (not games), then maybe these starter knowledge can guide you.
This is from my own limited experience but there are two types of graphics that I distinguish: graphics that are packaged with the app and graphics that are loaded through some network or file on the device.
For graphics that are packaged with the app, these tend to be the buttons and backgrounds for the look and feel of an app.
With these kind of graphics, to display an image to your application, the general idea is you create a UIImageView then add it as a subview of your View Controller's view. You then tell your image view object the image you want to display.
// create the image view object to display the image
UIImageView *myImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0,100,100)];
// tell the image view object the image you want to display
[myImageView setImage:[UIImage imageNamed:#"mybutton.png"]];
// add the image view object to your view controller's view
[self.view addSubview:myImageView];
[myImageView release];
As for network images, I usually get the URL of the image I want to display, then use a image caching library such as SDWebImage to load the image like so:
NSURL *url = [[NSURL alloc] initWithString:#"http://www.mysite.com/images/myphoto.png"];
[myImageView imageWithURL:urlOfImage placeholder:[UIImage imageNamed:#"placeholder.png"]];
[url release];
How you get the URL path to your image from the network is a different matter though. If you're loading through a web service, you usually have to fetch it from the JSON or XML output.
Is this a UIButton? If it is, how is the background red done? Obviously, it is not
red UIColor? Is there same tool or utility included with Xcode to allow making buttons
like this?
You can generate similar buttons with private class UIGlassButton.
I saw it first here http://pastie.org/830884 by #schwa.
Run an app with this code in your iOS simulator to create a custom button (or in the device, save to $(APP)/Documents and enable iTunes file sharing).
Class theClass = NSClassFromString(#"UIGlassButton");
UIButton *theButton = [[[theClass alloc] initWithFrame:CGRectMake(10, 10, 120, 44)] autorelease];
// Customize the color
[theButton setValue:[UIColor colorWithHue:0.267 saturation:1.000 brightness:0.667 alpha:1.000] forKey:#"tintColor"];
//[theButton setTitle:#"Accept" forState:UIControlStateNormal];
[self.view addSubview:theButton];
UIGraphicsBeginImageContext(theButton.frame.size);
CGContextRef theContext = UIGraphicsGetCurrentContext();
[theButton.layer renderInContext:theContext];
UIImage *theImage = UIGraphicsGetImageFromCurrentImageContext();
NSData *theData = UIImagePNGRepresentation(theImage);
[theData writeToFile:#"/Users/<# your user #>/Desktop/button.png" atomically:NO];
UIGraphicsEndImageContext();
Once you obtain the png, use it as button background.
Alternatively, you can build the buttons programmatically (by Jeff Lamarche).
I wrote a couple of classes to generate buttons for a calculator I wrote. The classes generate the buttons based upon either standard colors or with RGB input RGB values. The buttons are in my BindleKit project on Github: https://github.com/bindle/BindleKit
My answer to Change UIButton background color describes how to use the classes and where to find the source.
To see examples of the buttons, compile the BKCatalog app in the Github project or look at the screenshot https://github.com/bindle/BindleKit/blob/master/screenshots/BKCatalog-BKButtons.png
You need to create a background image for the button.
Then add the image to the button:
- (void)setImage:(UIImage *)image forState:(UIControlState)state
Also for resizable buttons see:
- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets
You can use programs like Graphics Converter, Photoshop and others.
And under iOS 5, you have UIAppearance.
You can make a button like that with core animation layers.
http://www.cimgf.com/2010/01/28/fun-with-uibuttons-and-core-animation-layers/
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.