iPhone SDK FirstRun.png – Displaying Special ‘one off’ info in an app
19/02/2010In making MicroCRM, I wanted to display some temp information to the user when a table list was empty. I wanted to make it as clear as possible a ‘lead’, ‘job’ or ‘invoice’ needs to be added first.
This is not a new concept in iPhone/Mac apps, but I want to share my implementation.
1. Firstly, I made the picture I wanted to display in my app. Then it was added to my Xcode project. Below is the actual artwork the app uses.
2. The following code is placed in (void)viewWillAppear: for the ViewController I wanted to place the image. (I have commented it well to help the reader).
//de.009 - FirstRun Image if ArrayCount is 0
[firstRunImage removeFromSuperview];
int InvoiceCount = [appDelegate.Array count]; //get number of Invoices<br />
NSString *arraycount = [NSString stringWithFormat:@"%d", InvoiceCount];<br />
NSLog (@"Leads Page Loaded: %@ Entries",arraycount); //Log code for number of items in array
if (InvoiceCount==0) { //If there are no invoices<br />
NSLog (@"Adding First Run Image"); //Log code<br />
firstRunImage=[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"img-FirstRun.png"]]; //Allocate UIImageView to hold the image, and define the image<br />
firstRunImage.frame = CGRectMake(0,0,320,100); //Define Frame Size<br />
[self.view addSubview:firstRunImage]; //Add ImageView to current view<br />
} else {<br />
[firstRunImage removeFromSuperview]; //Otherwise remove it<br />
[firstRunImage release], firstRunImage=nil; //release memory<br />
}
See it in action
And thats it. I have the same code for all three sections of my app. To get the app, goto http://microcrmapp.com and follow the app store link.
Other implementations of a similar idea are found in many different apps. Apple’s own included apps, the facebook app and so on. There is a particularly common UI element that seems to be an imitation of apple’s own included ‘no data/history/updating’ page (see below). This is becoming more and more common place and it does seem to be a nice way to show the user ‘theres nothing!’.
I have even found a way to implement this, its using the amazing TapkuLibrary. I’ll let you work it all out for yourself now and it may even become a new post in the future





No comments yet.