Images Display in GridView on IPhone

This is the GridView application. In this application we will see how to programatically images display in Gridview on iPhone .
This is the GridView application. In this application we will see how to programatically  images display in Gridview on iPhone .
Step 1: Open a Xcode, Create a View base application. Give the application name “Button_Example”.
Step 2: Xcode automatically creates the directory structure and adds essential frameworks to it. You can explore the directory structure to check out the content of the directory.
Step 3: We need to add one NSObject class in the project. So select the project -> New File -> Cocoa Touch -> Objective-C class and give the class name “Item”.
Step 4: We need to add one image in the project. Give the image name “icon2.png”.
Step 5: Open the “Button_ExampleViewController”file, we need to add UITableViewDelegate  and UITableViewDataSource , define UITableView and NSMutableArray class and one buttonPressed: method and import the Item.h class. So make the following changes.
#import <UIKit/UIKit.h>
#import “Item.h”@interface Button_ExampleViewController : UIViewController <UITableViewDelegate, UITableViewDataSource> {
        IBOutlet UITableView *tableView;
        NSMutableArray *sections;
@property (nonatomic, retain) UITableView *tableView;
@property (nonatomic, retain) NSMutableArray *sections;

Step 6: Double click the Button_ExampleViewController.xib file and open it to the Interface Builder.First drag the TableView from the library and place it to the view window. Select tableview from the view window and bring up connection inspector and connect dataSource to the File’s Owner and delegate to the File’s Owner icon. Now save the .xib file, close it and go back to the Xcode.
Step 7: In the Button_ExampleViewController.m file, make the following changes:

#import “Button_ExampleViewController.h”
#import “Item.h”@implementation Button_ExampleViewController
@synthesize tableView,sections;
// Implement loadView to create a view hierarchy programmatically, without using a nib.
- (void)loadView {
        [super loadView];
        sections = [[NSMutableArray alloc] init];
        for(int s=0;s<1;s++) { // 4 sections
                NSMutableArray *section = [[NSMutableArray alloc] init];
                for(int i=0;i<12;i++) {  // 12 items in each section
                        Item *item = [[Item alloc] init];
              “New Screen”;
                        item.title=[NSString stringWithFormat:@“Item  %d”, i];
                        [section addObject:item];                      
                [sections addObject:section];
        - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
                return [sections count];
        - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
                return 1;
        - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
                NSMutableArray *sectionItems = [sections objectAtIndex:indexPath.section];
                int numRows = [sectionItems count]/4;
                return numRows * 80.0;
        - (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {
                NSString *sectionTitle = [NSString stringWithFormat:@“Section   %d”, section];
                return sectionTitle;
        - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
                static NSString *hlCellID = @“hlCellID”;
                UITableViewCell *hlcell = [tableView dequeueReusableCellWithIdentifier:hlCellID];
                if(hlcell == nil) {
                        hlcell =  [[[UITableViewCell alloc]
                                                initWithStyle:UITableViewCellStyleDefault reuseIdentifier:hlCellID] autorelease];
                        hlcell.accessoryType = UITableViewCellAccessoryNone;
                        hlcell.selectionStyle = UITableViewCellSelectionStyleNone;
                int section = indexPath.section;
                NSMutableArray *sectionItems = [sections objectAtIndex:section];
                int n = [sectionItems count];
                int i=0,i1=0;
                        int yy = 4 +i1*74;
                        int j=0;
                        for(j=0; j<4;j++){
                                if (i>=n) break;
                                Item *item = [sectionItems objectAtIndex:i];
                                CGRect rect = CGRectMake(18+80*j, yy, 40, 40);
                                UIButton *button=[[UIButton alloc] initWithFrame:rect];
                                [button setFrame:rect];
                                UIImage *buttonImageNormal=[UIImage imageNamed:item.image];
                                [button setBackgroundImage:buttonImageNormal    forState:UIControlStateNormal];
                                [button setContentMode:UIViewContentModeCenter];
                                NSString *tagValue = [NSString stringWithFormat:@“%d%d”, indexPath.section+1, i];
                                button.tag = [tagValue intValue];
                                //NSLog(@”….tag….%d”, button.tag);
                                [button addTarget:self action:@selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
                                [hlcell.contentView addSubview:button];
                                [button release];
                                UILabel *label = [[[UILabel alloc] initWithFrame:CGRectMake((80*j)-4, yy+44, 80, 12)] autorelease];
                                label.text = item.title;
                                label.textColor = [UIColor blackColor];
                                label.backgroundColor = [UIColor clearColor];
                                label.textAlignment = UITextAlignmentCenter;
                                label.font = [UIFont fontWithName:@“ArialMT” size:12];
                                [hlcell.contentView addSubview:label];
                        i1 = i1+1;
                return hlcell;
        -(IBAction)buttonPressed:(id)sender {
                int tagId = [sender tag];
                int divNum = 0;
                int section = [sender tag]/divNum;
                section -=1; // we had incremented at tag assigning time
                int itemId = [sender tag]%divNum;
                NSLog(@“…section = %d, item = %d”, section, itemId);
                NSMutableArray *sectionItems = [sections objectAtIndex:section];
                Item *item = [sectionItems objectAtIndex:itemId];
                NSLog(@“..item pressed…..%@, %@”, item.title,;
// Implement viewDidLoad to do additional setup after loading the view, typically from a nib.
- (void)viewDidLoad {
    [super viewDidLoad];
- (void)didReceiveMemoryWarning {
        // Releases the view if it doesn’t have a superview.
    [super didReceiveMemoryWarning];
        // Release any cached data, images, etc that aren’t in use.
- (void)viewDidUnload {
        // Release any retained subviews of the main view.
        // e.g. self.myOutlet = nil;
- (void)dealloc {
    [super dealloc];

Step 8: Open the Item.h file and make the following changes:

#import <Foundation/Foundation.h>@interface Item : NSObject {
        NSString *title;
        NSString *link;
        NSString *image;
@property (nonatomic, copy) NSString *title;
@property (nonatomic, copy) NSString *link;
@property (nonatomic, copy) NSString *image;

Step 9: Now make the changes in the Item.m file:

#import “Item.h” @implementation Item
 @synthesize title, link, image;

Step 10: Now Save it and compile it in the Simulator.

You can Download SourceCode from here Button_Example

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>