Vidhyanand
Vidhyanand

Reputation: 993

How to Dynamically Load Images Using UIScrollview

I am bit confused how to accomplish to load images dynamically using UIScrollview or other objects ...

![Dynamically displaying images coming from webservice][1]

In the above image it supports both horizontal and vertical scrolling of images. Can we do this using UIScrollview or other objects like UICollectionView?

Below is the general code for horizontal scrollview for displaying 7 images,

int x=10;
int y=20;

for (int i=1; i<=7; i++)
{
    UIView *bgView=[[UIView alloc]initWithFrame:CGRectMake(x, y, 80, 80)];
    bgView.tag=i;
    UIImageView *bgImgView=[[UIImageView alloc]initWithFrame:CGRectMake(1, 1, 55, 55)];
    bgImgView.tag=1;
    bgImgView.image=[UIImage imageNamed:[NSString stringWithFormat:@"img_%d.png",i]];
    [bgView addSubview:bgImgView];
    [self.videoscrollview addSubview:bgView];
    x=x+80;
}
self.scrollview.contentSize=CGSizeMake(7*80, 84);

Can we handle with one UIView and UIImageView like above method using UIScrollview for displaying images?

I want to handle UIViews with different sizes which are subviews to UIScrollview...

I googled but not found any related stuff. Any suggestions to deal with this?

Upvotes: 0

Views: 2140

Answers (4)

Vidhyanand
Vidhyanand

Reputation: 993

Thanks for your valuable answers. I fixed temporarily above issue using below code.

Bool isOddViewNo; //at .h file

isOddViewNo=YES; //at viewDidLoad

int x=10;
int y=10;

for (int i=0; i<=15; i++)
{
    if (isOddViewNo)
    {
        isOddViewNo=NO;
        UIView *oddView=[[UIView alloc]initWithFrame:CGRectMake(x, y, 90, 90)];
        UIImageView *oddImgView=[[UIImageView alloc]initWithFrame:CGRectMake(1, 1, 85, 85)];
        oddImgView.image=[UIImage imageNamed:[NSString stringWithFormat:@"img_%d.png",i]];
        [oddView addSubview:oddImgView];
        [self.scrollview addSubview:oddView];
        x+=90;
    }
    else
    {
        isOddViewNo=YES;
        UIView *evenView=[[UIView alloc]initWithFrame:CGRectMake(x, y, 150, 150)];
        UIImageView *evenImgView=[[UIImageView alloc]initWithFrame:CGRectMake(1, 1, 145, 145)];
        evenImgView.image=[UIImage imageNamed:[NSString stringWithFormat:@"img_%d.png",i]];
        [evenView addSubview:evenImgView];
        [self.scrollview addSubview:evenView];
        x+=150;
    }

    if ((i+1)%3==0)
    {
        //if added image is 4 th image
        y+=150;
        x=10;
    }

    if (y+150>self.scrollview.frame.size.height)
    {
        self.scrollview.contentSize=CGSizeMake(400, y+150);
    }
    else
    {
        self.scrollview.contentSize=CGSizeMake(320, self.scrollview.frame.size.height+150);
    }
}

![I am Displaying three views with different sizes in each row of UIScrollview. Which is scrollable both horizontally and Vertically. Here is the screen shot taken from simulator][1]

Upvotes: 0

Dipak Makwana
Dipak Makwana

Reputation: 29

Try this for dynamic image From NSBundle:

NSString * resourcePath = [[NSBundle mainBundle] resourcePath];
NSError * error;
NSArray * directoryContents = [[NSFileManager defaultManager] contentsOfDirectoryAtPath:resourcePath error:&error];
NSMutableArray *imageArray = [[NSMutableArray alloc]init];

for (int i=0; i<directoryContents.count; i++) {
    NSString *pathExtension = [[directoryContents objectAtIndex:i] pathExtension];
    if ([pathExtension isEqualToString:@"png"]  || [pathExtension isEqualToString:@"jpg"] ) {
        [imageArray addObject:[directoryContents objectAtIndex:i]];
    }
}
Now u have array of all images

for (int i=1; i<=imageArray.count; i++)
{
  UIView *bgView=[[UIView alloc]initWithFrame:CGRectMake(x, y, 80, 80)];
  bgView.tag=i;
  UIImageView *bgImgView=[[UIImageView alloc]initWithFrame:CGRectMake(1, 1, 55, 55)];
  bgImgView.tag=1;
  bgImgView.image=[UIImage imageNamed:[imageArray objectAtIndex:i]];
  [bgView addSubview:bgImgView];
 [self.videoscrollview addSubview:bgView];
  x=x+80;

} self.scrollview.contentSize=CGSizeMake(i*80, 84);

Upvotes: 0

Dushyant Singh
Dushyant Singh

Reputation: 721

For this, first you have to calculate and check for the visible area of scrollview i.e. contentOffset , then you have to load objects for that visible part and as you alloc new object you should store them in an array. As any image moves outside the visible area you should remove it from scrollview. This way it will take less memory and you could load many images without getting memory warning.

You could follow this article to get some hint how to add and remove objects from scrollView

http://www.raywenderlich.com/10518/how-to-use-uiscrollview-to-scroll-and-zoom-content

Upvotes: 0

Dhaval Bhadania
Dhaval Bhadania

Reputation: 3089

Assuming that your image names are Likes: images_1/2.../10.../n.(Make sure daynamic image coming from this imagename)

Try this one :

int x=10; int y=20;

for (int i=1; i<=7; i++)
{
      UIView *bgView=[[UIView alloc]initWithFrame:CGRectMake(x, y, 80, 80)];
      bgView.tag=i;
      UIImageView *bgImgView=[[UIImageView alloc]initWithFrame:CGRectMake(1, 1, 55, 55)];
      bgImgView.tag=1;

      NSString *image = [NSString stringWithFormat:@"images_%d.png",i];
      bgImgView.image = [UIImage imageNamed:image];

     [bgView addSubview:bgImgView];
     [self.videoscrollview addSubview:bgView];
     x=x+80;
 }

 self.scrollview.contentSize=CGSizeMake(7*80, 84);

check that it's working or not,may be it will work?

happy coding.

Upvotes: 1

Related Questions