Tuesday, December 25, 2012

How To Make Gallery View in iOS

Keywords: Scroll view, gallery, ios, iphone, xcode, image view

How To Make Gallery View in iOS

Get contacts of all your emergency needs on single tap. Download Quick-Finder for iPhone

Code of this sample is available here
http://adf.ly/GS9Ya



1) Take a project of name GallerySample.

2) drag and drop 5 images in your resource folder with name of image1.jpeg,image2.jpeg,image3.jpeg,image4.jpeg and image5.jpeg.

3) Open ViewController.m and modified the code as follows (Modified code is in different color)


#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    
    UIScrollView *scrollView=[[UIScrollView alloc]initWithFrame:CGRectMake(0, 50, 320, 270)];
    // creating a scroll view
    
    
    [scrollView setPagingEnabled:YES];
    
    // enabled paging of scroll view
    
    [scrollView setShowsHorizontalScrollIndicator:NO];
    
    // disabled sliding bar
    
    NSArray *imageArray=[[NSArray alloc]initWithObjects:@"image1",@"image2",@"image3",@"image4",@"image5", nil];
    
    // creating an array having the name of all images which are to be shown in gallery
    
    
    
    for( int i=0; i< [imageArray count];i++)
    {
        
        NSString *imageName=[imageArray objectAtIndex:i];
    
        // getting the name of image from array
        
        NSString *fullImageName=[NSString stringWithFormat:@"%@.jpeg",imageName];
        
        // appending extention to the name of image to complete the image name
        
        int padding=25;
        // padding is given.
        
        CGRect imageViewFrame=CGRectMake(scrollView.frame.size.width*i+padding, scrollView.frame.origin.y, scrollView.frame.size.width-2*padding, scrollView.frame.size.height);
        
        // Getting frame of image so that all images are not overlapped to each other.
        // each frame is distict with other frame
        
        UIImageView *imageView=[[UIImageView alloc]initWithFrame:imageViewFrame];
        
        // Setting frame of imageView
        
        [imageView setImage:[UIImage imageNamed:fullImageName]];
        
        // setting image to the image view
        
        [imageView setContentMode:UIViewContentModeScaleAspectFit];
        
        // setting content mode of image view so that image looks good
        
        
        [scrollView addSubview:imageView];
        
        // adding image view to the scroll view

    }
    
    CGSize scrollViewSize=CGSizeMake(scrollView.frame.size.width*[imageArray count], scrollView.frame.size.height);
    
    // getting the content size of scroll view
    
    [scrollView setContentSize:scrollViewSize];
    // setting content size of scroll view
    
    [self.view addSubview:scrollView];
    
    // finally add scroll view to your view
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end


Now when you run the code you will get a gallery having 5 images , You can scroll to get all images.

You can download the sample code from here (Media fire link)
http://adf.ly/GS9Ya


1 comment: