Display a serial of UIImageViews using the UIImage objects of a NSArray - iphone

I can not find out a easy way. Anyone help? Thanks!

Put your image name into array instead of images, that's much better memory-wise.
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 320, 460)];
CGFloat currentOffset = 0;
for (int i = 0; i < [imageArray count]; i++) {
UIImageView *tmpImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:[imageArray objectAtIndex:i]]];
currentOffset += tmpImageView.frame.size.width;
//currentOffset += tmpImageView.frame.size.height; // for vertical
tmpImageView.frame = CGRectOffset(tmpImageView.frame, currentOffset, 0);
//tmpImageView.frame = CGRectOffset(tmpImageView.frame, 0, currentOffset); // for vertical
[scrollView addSubview:tmpImageView];
[tmpImageView release];
}
scrollView.contentSize = CGSizeMake(currentOffset, scrollView.frame.size.height);
//scrollView.contentSize = CGSizeMake(scrollView.frame.size.width, currentOffset); // for vertical
Then add that scrollView to shichever view you want and release it.
As you can see this will put all your images one next to other horizontally. If you want to do it vertically, simply uncomment all the commented lines and delete the line before each of those commented lines.

This is how one would solve this problem with iOS4. iOS5 adds an easier way to do this but you'll need to look at the doc since it's still under NDA.
UIImageView *imageView = [[[UIImageView alloc] initWithFrame:CGRectZero] autorelease];
imageView.animationImages = [NSArray arrayWithObjects:
[UIImage imageNamed:#"one.png"],
[UIImage imageNamed:#"two.png"],
[UIImage imageNamed:#"three.png"],
[UIImage imageNamed:#"four.png"],
nil];

Related

iOS - UIScrollView doesn't update its content and some UIViews disappear after reload

I have UITableViewController with UIScrollView inside UIView as its header.
UIScrollView is used to display slideshow of images:
UITableView
-UITableViewHeaderView
-UIView
-UIScrollView
-UIImageView
...
-UIPageControl
Every image has a subview with its title and description:
UIImageView
-UIView
-UILabel
-UILabel
When I need to update my tableView a delegate method is called which reloads data in a tableView and calls addImages method:
- (void)eventsUpdated
{
if ([self respondsToSelector:#selector(setRefreshControl:)])
[self.refreshControl endRefreshing];
[self.tableView reloadData];
[self addImages];
}
Here is how I add my images:
- (void)addImages
[self.scrollView.subviews makeObjectsPerformSelector:#selector(removeFromSuperview)];
for (int i = 0; i < images.count; i++) {
CGRect frame;
frame.origin.x = self.scrollView.frame.size.width * i;
frame.origin.y = 0;
frame.size = self.scrollView.frame.size;
UIImageView *subview = [self createImageViewForEvent:[images objectAtIndex:i] inFrame:frame];
subview.frame = frame;
[self.scrollView addSubview:subview];
}
self.scrollView.contentSize = CGSizeMake(scrollView.frame.size.width*images.count, scrollView.frame.size.height);
pageControll.currentPage = 0;
pageControll.numberOfPages = images.count;
}
- (UIImageView *)createImageViewForEvent:(Event *)event inFrame:(CGRect)frame
{
UIImage *image;
NSString *imageName = [event.imageName lastPathComponent];
NSString *bundleFilePath = [[NSBundle mainBundle] pathForResource:[imageName stringByDeletingPathExtension] ofType:[imageName pathExtension]];
image = [UIImage imageWithContentsOfFile:bundleFilePath];
UIImageView *output = [[UIImageView alloc] initWithImage:image];
output.frame = frame;
UIView *descriptionView = [[UIView alloc] initWithFrame:CGRectMake(0, frame.size.height*0.7, frame.size.width, frame.size.height*0.3)];
descriptionView.backgroundColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.5];
descriptionView.alpha = 1.0;
UILabel *header = [[UILabel alloc] initWithFrame:CGRectMake(10, 5, frame.size.width-20, 12)];
header.textColor = [UIColor colorWithRed:210/256.0 green:217/256.0 blue:231/256.0 alpha:1.0];
header.font = [UIFont fontWithName:#"Helvetica" size:17];
header.backgroundColor = [UIColor clearColor];
header.lineBreakMode = UILineBreakModeTailTruncation;
header.numberOfLines = 1;
UILabel *description = [[UILabel alloc] initWithFrame:CGRectMake(10, 22, frame.size.width-20, 28)];
description.textColor = [UIColor colorWithRed:255/256.0 green:255/256.0 blue:255/256.0 alpha:1.0];
description.font = [UIFont fontWithName:#"Helvetica" size:12];
description.backgroundColor = [UIColor clearColor];
description.lineBreakMode = UILineBreakModeTailTruncation;
description.numberOfLines = 2;
header.text = event.title;
[descriptionView addSubview:header];
description.text = event.shortDesription;
[descriptionView addSubview:description];
[output addSubview:descriptionView];
return output;
}
After first launch everything works fine, but if I try to reload my tableView and call addImages again, all UILabels disappear, only UIImageView and UIView are visible.
UPD:
What I have noticed, is that my UILabels appear after some time, approximately after 30 seconds. I have never experienced something similar before
UPD 2:
After I reload my tableView and scrollview, scrollView's content is not updated right away, only after I start scrolling
I reproduced a sample project from the code you posted, and didn't find any refreshing issues on the labels nor on any other component. This leads me to think the problem is not in the code you posted, but rather somewhere else.
Usually when you see such a delay, it is because some code that should not be running in parallel, is running in parallel.
I would suggest you check how and when you perform your call to eventsUpdated. You must make sure that call is performed on the main thread, and only once your array of events has finished updating. To check that, you can add add the following line in eventsUpdated:
NSLog(#"Current: %#, main: %#", [NSThread currentThread], [NSThread mainThread]);
Please post the log! :-)
I would suggest you also add to your question the code from the method that calls eventsUpdated, as it could also be of help.
At first, never do something like
[scrollView.subviews makeObjectsPerformSelector:#selector(removeFromSuperview)];
Scroll view has some internal views (scroll indicators, for example), so you're removing them which may dealloc them and cause strange crashes any time later.
As for your problem - try calling bringSubviewToFront: of your UIImageView to get your labels infront of everything else

Image In Scroll View

I am using the following code to try and display an image in a UIScrollView.
[self.jarView addSubview:imgView];
It does not work. However, it works when I add the subview to my normal view. My UIScrollView is called jarView and imgView is a UIImageView.
Thanks
This works fine for me:
UIScrollView *scrollview;
scrollview= [[UIScrollView alloc] initWithFrame:CGRectMake(,,,)];// set scroll view size
view = [[UIView alloc] initWithFrame:CGRectMake(y1,x1,y2,x2)]; //set the view size
UIImage *image1 = [UIImage imageNamed:imageName];
image=[[UIImageView alloc]initWithImage:image1];// take image size according to view
[view addSubview:image];
[scrollview addSubview:view];
[view release];
At last define how much scrollview is scroll:
scrollview.contentSize = CGSizeMake(width,height);
Make sure that your scrollView.contentSize property value is set correctly (width and height should be > 0).
Here I am posting my answer. Try it.
You can load all the images to an array. And you can design a view having one image view and try the below code:
array name: examplearray and view name :exampleview
-(void)updateImagesInScrollView
{
int cnt = [examplearray count];
for(int j=0; j< cnt; ++j)
{
NSArray *nibContents = [[NSBundle mainBundle] loadNibNamed:#"exampleview"
owner:self
options:nil];
UIView *myView = [nibContents objectAtIndex:0];
exampleview * rview= (exampleview *)myView;
/* you can get your image from the array and set the image*/
rview.imageview.image = yourimage;
/*adding the view to your scrollview*/
[self.ScrollView addSubview:rview];
}
/* you need to set the content size of the scroll view */
self.ScrollView.contentSize = CGSizeMake(X, self.mHorizontalScrollView.contentSize.height);
}
I am giving you my sample code. In this code i add multiple images on scroll view and this work fine for me:
UIScrollView *scrollview;
- (void)anyFunction
{
scrollview = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 30, 320, 50)];
NSInteger viewcount = [cat_Products count]; // if you have four content your view count is 4..(four)..in my case i fetch it from database
CGFloat y2 = 0;
UIView *view;
UIImageView *imageView;
NSString *imageName;
for(int i = 0; i< viewcount; i++)
{
CGFloat y = i * 64;
y2 = y2 + 64;
view = [[UIView alloc] initWithFrame:CGRectMake(y, 0, y2, 50)];
imageName = [[NSString alloc] initWithFormat:#"c%i", (i + 1)]; // my image name is c1, c2, c3, c4 so i use this
UIImage *image1 = [UIImage imageNamed:imageName];
imageView = [[UIImageView alloc] initWithImage:image1];
[view addSubview:imageView];
[scrollview addSubview:view];
[view release];
[imageView release];
[imageName release];
}
scrollview.contentSize = CGSizeMake(viewcount*64,0); //viewcount*64 because i use image width 64..and second parameter is 0..because i not wants vertical scrolling...
[myView addSubview:scrollview];
[scrollview release];
}
I hope this helps.

how to pushViewController to another view with images in a scrollview

I have a scrollview of images, I will like to tab them and will pushed to another view.
once i tab on the image, the whole view should push to another view.
From this View to another view
Detail view
Sorry for not asking the question clearly.
my scrollview
-(void)pictureScrolling
{
//init scrollview in location on screen
scrollview = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 100, 320, 290)];
scrollview.backgroundColor = [UIColor redColor];
//pass image filenames
NSMutableArray *fileNames = nearbyFrog.imageFiles; //[[[NSMutableArray alloc] init] autorelease];
//setup the array of uiimageviews
NSMutableArray *imgArray = [[NSMutableArray alloc] init];
UIImageView *imageView;
//loop through the array imgNames to add file names to imgArray
for (NSString *imageName in fileNames) {
imageView = [[UIImageView alloc] init];
imageView.image = [UIImage imageNamed:imageName];
imageView.contentMode = UIViewContentModeScaleAspectFit;
[imgArray addObject:imageView];
[imageView release];
}
CGSize pageSize = scrollview.frame.size;
NSUInteger page = 0;
for (UIView *viewForScrollView in imgArray) {
[scrollview addSubview:viewForScrollView];
viewForScrollView.frame = CGRectMake(pageSize.width * page++ +10, 0, pageSize.width -20 , pageSize.height);
// making use of the scrollView's frame size (pageSize) so we need to;
// +10 to left offset of image pos (1/2 the gap)
// -20 for UIImageView's width (to leave 10 gap at left and right)
}
//add scroll view to view
[self.view addSubview:scrollview];
scrollview.contentSize = CGSizeMake(pageSize.width * [imgArray count], pageSize.height);
//scrollview.contentSize = CGSizeMake(320 *viewcount + 20, 290 );
scrollview.showsHorizontalScrollIndicator =NO;
[scrollview setPagingEnabled:YES];
scrollview.delegate =self;
//paging function for scrollview
CGRect frame = [[UIScreen mainScreen] applicationFrame];
self.pageControl = [[[UIPageControl alloc] initWithFrame:CGRectMake(0, 100, 100, 50)] autorelease];
self.pageControl.center = CGPointMake(frame.size.width/2, frame.size.height-60);
self.pageControl.numberOfPages = [fileNames count];
[self.view addSubview:self.pageControl];
//handle Touch Even
[pageControl addTarget:self action:#selector(changePage:) forControlEvents:UIControlEventValueChanged];
[imgArray release];
}
anybody knows how to do it or can show me a tutorial?
Thanks
I think this is the best way to implement it
Create your own Custom UIImageView class. This is required to store an additional property which will help you identify which image for clicked.
Create a delegate for that class which is called with the single tap event is raised in the UIImageView
Add the Images inside the scrollview using this custom class. The delegate of this class will tell you which image was tapped. You can use this to push a new view controller passing the image details (if necessary).
You can find some sample code in the ThumbImageView class in the scrollviewSuite sample
http://developer.apple.com/library/ios/#samplecode/ScrollViewSuite/Introduction/Intro.html#//apple_ref/doc/uid/DTS40008904-Intro-DontLinkElementID_2

How to remove overlapping uiimageview?

I tried to change the image in the imageview but I can't seem to do that.
My code shown below creates a new subview for each image to display. However, the images just overlap and shows the overlapped images at the end which is not supposed to be.
.m:
for (int i = 0; i < [imageArr count]; i++) {
NSArray *imageNameArr = [[imageArr objectAtIndex:i] componentsSeparatedByString:#"."];
check=line;
NSString *msg = [textView.text stringByAppendingString:[NSString stringWithFormat:#"Opening image: %#\n",[imageArr objectAtIndex:i]]];
[textView performSelectorOnMainThread:#selector(setText:) withObject:msg waitUntilDone:NO];
line=line+1;
NSString *imagePath = [NSString stringWithFormat:#"%#/%#",jName,[imageArr objectAtIndex:i]];
NSString *imageFile = [NSHomeDirectory() stringByAppendingPathComponent:imagePath];
NSLog(#"------------------------------");
NSLog(#"ImageFile: %#\n",imageFile);
NSLog(#"Interger value: %i\n",i);
UIImage *myImage = [UIImage imageWithContentsOfFile:imageFile];
UIImageView *imageView = [[UIImageView alloc] initWithImage:myImage];
imageView.contentMode = UIViewContentModeScaleAspectFit;
[scrollView addSubview:imageView];
[imageView release];
.....
.....
}
How to show the images individually, without overlapping?
put this line out of for loop:
UIImageView *imageView = [[UIImageView alloc] initWithImage:myImage];
[scrollView addSubview:imageView];
and use it like:
UIImageView *imageView = [[UIImageView alloc] init];
[scrollView addSubview:imageView];
and use:
[imageView setImage:[UIImage imageWithContentsOfFile:fullImgNm]];
Inside for loop.
You create the imageview out of loop and change the source(Image) for that imageview inside the loop.
You do this before loop starts,
UIImageView *imageView = [[UIImageView alloc] init];
[scrollView addSubview:imageView];
and add the image like this inside the loop,
[imageView setImage:[UIImage imageWithContentsOfFile:imageFile]];

Do something to selected image in scroll view

I try to make following: Horizontal list of images, that I can select and do something with it. For example flip image around x axis. I know how to rotate image. I created scrollview and load it with images. I added event handler when I tap on image. But I don't know how to do something with tapped image. How to code method to do something with tapped image?
- (void)viewDidLoad {
[super viewDidLoad];
img1 = [UIImage imageNamed:#"imgTest.jpg"];
img2 = [UIImage imageNamed:#"imgTest2.jpg"];
arrayOfImages = [[NSMutableArray alloc] init];
[arrayOfImages addObject:img1];
[arrayOfImages addObject:img2];
[arrayOfImages addObject:img1];
[arrayOfImages addObject:img2];
scrollView = [[UIScrollView alloc] init];
scrollView.scrollEnabled = YES;
scrollView.pagingEnabled = YES;
scrollView.directionalLockEnabled = YES;
scrollView.showsVerticalScrollIndicator = NO;
scrollView.showsHorizontalScrollIndicator = NO;
scrollView.delegate = self;
scrollView.backgroundColor = [UIColor blueColor];
scrollView.autoresizesSubviews = YES;
scrollView.frame = CGRectMake(0, 0, 320, 128);
[self.view addSubview:scrollView];
UIImage *imageToAdd;
int x = 0;
int y = 0;
for(imageToAdd in arrayOfImages)
{
UIImageView *temp = [[UIImageView alloc] initWithImage:imageToAdd];
temp.frame = CGRectMake(x, y, 128, 128);
temp.userInteractionEnabled = YES;
x += 135;
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(imageTapped:)];
[temp addGestureRecognizer:tap];
[scrollView addSubview:temp];
}
...
- (void)imageTapped:(UIGestureRecognizer *)sender
{
// how to get reference on selected item in scrollview???
}
A gesture recognizer has a view property that returns the view associated with the recognizer. Since you know that it'll be a UIImageView you can simply cast it and use it as in:
UIImageView *iv = (UIImageView *)[sender view];
And your image can then be queried via:
UIImage *image = [iv image];
If you need to know the index in your array, there are two ways: either simply use [arrayOfImages indexOfObject:image];, or you can assign tags (numbers) to views and use them. A tag is not used by Apple, it's only here so we developers can "mark" views in some way. For example:
NSInteger counter = 0;
for(imageToAdd in arrayOfImages)
{
UIImageView *temp = [[UIImageView alloc] initWithImage:imageToAdd];
count.tag = counter++;
...
}
Then, in your imageTapped:, you can query the index via tag:
NSInteger index = [imageView tag];