how to show images as a gridview like format in uiscrollview in ios? - xcode

Question

its just a week that am into ios devlopement and am facing some problem that i cant show the images in scrolview with gridview format...i dont know how to set the frame size to show images in proper gridview format..
here is my code
that add 5 images in scrollview
for(int i=1;i<6;i++)
{
UIImageView *image = [[UIImageView alloc] initWithFrame:CGRectMake(x+0, 0, 320, 460)];
[image setImage:[UIImage imageNamed:[NSString stringWithFormat:#"e1%d.png",i]]];
[scr addSubview:image];
x+=320;
UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(handleSingleTap:)];
tapGesture.numberOfTapsRequired = 1;
tapGesture.delegate = self;
image.userInteractionEnabled = YES;
[image addGestureRecognizer:tapGesture];
}
scr.pagingEnabled=YES;
scr.contentSize = CGSizeMake(320*5, 300);
[self.view addSubview:scr];
but all 5 images shows in one horizontal line but i want to show in every line 2 images.

Answer 1

here is the solution, i've implemented it in my app. Here is my code sv_port is my scrollView. Download SDWebImageDownloader class files and import it in your project. Add
relevant framework in your project. like imageIO.framework, QuartzCore
if your images are not fetching from url, then u dont need to use asyncImage view., so dont need to download SDWebImageDownloader.
Now, in your .m add
#import "UIImageView+WebCache.h"
#import "SDImageCache.h"
#import "SDWebImageCompat.h"
//function for adding image in your scrollview
-(void)populateImages
{
int x=6,y=6;
for(UIView * view in sv_port.subviews)
{
if([view isKindOfClass:[UIImageView class]])
{
[view removeFromSuperview]; view = nil;
}
if([view isKindOfClass:[UIButton class]])
{
[view removeFromSuperview]; view = nil;
}
}
for(int p=0;p<[Manufacturer count];p++)
{
UIButton *btnImageButton = [UIButton buttonWithType:UIButtonTypeCustom];
btnImageButton.frame = CGRectMake(x,y,70,70);
[btnImageButton setTag:p];
[btnImageButton addTarget:self action:#selector(nextview:) forControlEvents:UIControlEventTouchUpInside];
UIActivityIndicatorView *spinny = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
spinny.frame=CGRectMake(btnImageButton.frame.origin.x+25,btnImageButton.frame.origin.y+25, 20, 20);
spinny.backgroundColor=[UIColor clearColor];
[spinny startAnimating];
[sv_port setScrollEnabled:YES];
[sv_port addSubview:spinny];
UIImageView *asyncImageView = [[[UIImageView alloc] initWithFrame:btnImageButton.frame] autorelease];
asyncImageView.backgroundColor=[UIColor clearColor];
CALayer *layer;
layer = asyncImageView.layer;
layer.borderWidth = 0.5;
layer.cornerRadius = 5;
layer.masksToBounds = YES;
[asyncImageView setImageWithURL:[NSURL URLWithString:[NSString stringWithFormat:#"%#", yourUrl] ] placeholderImage:[UIImage imageNamed:nil] options:0 andResize:CGSizeMake(btnImageButton.frame.size.width,btnImageButton.frame.size.height) withContentMode:UIViewContentModeScaleAspectFit];
asyncImageView.contentMode = UIViewContentModeScaleAspectFit;
[sv_port addSubview:btnImageButton];
[sv_port addSubview:asyncImageView];
int imgCntPort=0;
imgCntPort=(sv_port.frame.size.width/(asyncImageView.frame.size.width));
//NSLog(#"imgport %d",imgCntPort);
if((p+1)%imgCntPort==0)
{
x=5;
y=y+80;
}
else
{
x=x+80;
}
}
sv_port.contentSize = CGSizeMake(0, y);
glob_x =0; glob_y =y;
}
By this code you will get 4 images in a row., By the change co-Ordiante of x and y you can maintain number of images per row to display.
Hope this helps. Thanks