Loading images into a UIScrollView - ios

I'm hoping somebody can help me out here, I'm not sure what else to do. I have a UIScrollView that loads a set of 44 images, and then allows the user to page through them. My code was working, then suddenly it stopped. I have no idea what I have changed so any help would be much appreciated:
The previous view is a UITableView, it passes a string along with the name of the cell that was selected. Here is the ViewDidLoad Method from the ScrollView:
- (void)viewDidLoad
{
[super viewDidLoad];
UIBarButtonItem *rightButton = [[UIBarButtonItem alloc] initWithTitle:#"Answer"
style:UIBarButtonItemStyleBordered
target:self
action:#selector(answerPressed:)];
self.navigationItem.rightBarButtonItem = rightButton;
if([questionSetName isEqualToString:#"Limitations"]){
[self limitationsView];
}
}
Here is the limitationsView:
-(void)limitationsView{
UIScrollView *scroll = [[UIScrollView alloc] initWithFrame:CGRectMake(0, -44, self.view.frame.size.width, self.view.frame.size.height)];
scroll.pagingEnabled = YES;
NSArray *unsortedArray = [[NSBundle mainBundle] pathsForResourcesOfType:#"png" inDirectory:#"Images/Limitations"];
NSMutableArray *limitationImages = [[NSMutableArray alloc] init];
for (int x = 0; x<[unsortedArray count]; x++) {
NSString *fileName = [[unsortedArray objectAtIndex:x] lastPathComponent];
[limitationImages insertObject:fileName atIndex:x];
}
NSArray *sortedArray = [limitationImages sortedArrayUsingFunction:finderSortWithLocal
context:(__bridge void *)([NSLocale currentLocale])];
for(int i = 0; i< [sortedArray count]; i++){
CGFloat xOrigin = i * self.view.bounds.size.width;
UIImageView *limitationImageView = [[UIImageView alloc] initWithFrame:CGRectMake(xOrigin, 0, self.view.frame.size.width, self.view.frame.size.height)];;
[limitationImageView setImage:[UIImage imageNamed:[sortedArray objectAtIndex:i]]];
limitationImageView.contentMode = UIViewContentModeScaleAspectFit;
[scroll addSubview:limitationImageView];
}
scroll.contentSize = CGSizeMake(self.view.frame.size.width * [sortedArray count], self.view.frame.size.height);
[self.view addSubview:scroll];
}
When I get to the end of the LimitationsView method the sortedArray contains all 44 images, and the proper names, if I try and set the background color of the scrollview I can successfully do that. but my images are not loading and I am at a loss as to why?

I would suggest using
NSLog(#"image:%#",[UIImage imageNamed:[limitationsArray objectAtIndex:i]]);
to see if the image is null at that point. If that's the case, then there is a problem with the strings you are storing in that array i.e., they are not identical to the actual names of your images

Related

Nested UIScrollView not paging for Internal UIScrollView

I am trying to build a screen which has 2 UIScrollViews, 1 Main Scroll View which is used as a container and to scroll vertically (this is working fine).
Inside the Main Scroll View, is a second scroll view, which is used for display different images. This needs to be scrolled horizontally so it will page to other images which will also update content details displayed in the Main Scroll View.
When attempting to get these two features to work together, the paging functionality does not work, however if it is outside the main scroll view it will work but will not scroll with the rest of the content.
The Image Scroll View is being detected in the events as well, but doesn't show any ability to scroll.
Below are my 3 functions which are performing the work.
- (void)viewDidLoad
{
[super viewDidLoad];
// Set up the Image Scroll View
ImageScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0,0, screenWidth, homeImage)];
ImageScrollView.scrollEnabled = YES;
ImageScrollView.userInteractionEnabled=YES;
[ImageScrollView setPagingEnabled:YES];
[ImageScrollView setAlwaysBounceVertical:NO];
ImageScrollView.delegate = self;
// Set up the image array
NSArray *imagesArray = [NSArray arrayWithObjects:#"staff1big.png", #"staff2big.png", #"staff3big.png", nil];
// Create each image subview
for (int i = 0; i < [imagesArray count]; i++)
{
CGFloat xOrigin = i * ImageScrollView.frame.size.width;
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(xOrigin, 0, ImageScrollView.frame.size.width, ImageScrollView.frame.size.height)];
[imageView setImage:[UIImage imageNamed:[imagesArray objectAtIndex:i]]];
[ImageScrollView addSubview:imageView];
}
// Set the Content Size and Offset
[ImageScrollView setContentSize:CGSizeMake(ImageScrollView.frame.size.width * [imagesArray count], ImageScrollView.frame.size.height)];
[ImageScrollView setContentOffset:CGPointMake(screenWidth*currentIndex, 0)];
// Get the staff object
dataSource = [DataSource dataSource];
NSArray *staffArray = [dataSource getStaff];
// Setup the Pager Control
self.pageControl = [[UIPageControl alloc] init];
NSInteger placement = (screenWidth/2)-50;
self.pageControl.frame = CGRectMake(placement, homeImage-30, 100, 20);
self.pageControl.numberOfPages = [staffArray count];
self.pageControl.currentPage = currentIndex;
[self setStaff:staffArray[currentIndex]];
// Add the Main Scroll View
MainScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, screenWidth, screenHeight)];
MainScrollView.delegate = self;
MainScrollView.scrollEnabled = YES;
MainScrollView.userInteractionEnabled=YES;
// Add each object to the correct scroll view
[ImageScrollView addSubview:self.pageControl];
[MainScrollView addSubview:ImageScrollView];
[MainScrollView addSubview:lineView];
[self setDisplayContent]; // note the MainScrollView is added to the self.view in this method along with setting the content size to screenWidth and height is determine by the generated content.
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
CGFloat pageWidth = ImageScrollView.frame.size.width;
float fractionalPage = ImageScrollView.contentOffset.x / pageWidth;
NSInteger page = lround(fractionalPage);
currentIndex = page;
self.pageControl.currentPage = page;
[self displayContent];
}
- (void)displayContent
{
int i = currentIndex;
if (i < 0)
{
i = 0;
} else if (i > 2) {
i = 2;
}
[self setStaff:allStaff[i]];
// remove all from view
for(UIView *subview in [MainScrollView subviews]) {
[subview removeFromSuperview];
}
NSArray *imagesArray = [NSArray arrayWithObjects:#"staff1big.png", #"staff2big.png", #"staff3big.png", nil];
for (int i = 0; i < [imagesArray count]; i++)
{
CGFloat xOrigin = i * ImageScrollView.frame.size.width;
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(xOrigin, 0, ImageScrollView.frame.size.width, ImageScrollView.frame.size.height)];
[imageView setImage:[UIImage imageNamed:[imagesArray objectAtIndex:i]]];
[ImageScrollView addSubview:imageView];
}
[ImageScrollView setContentSize:CGSizeMake(ImageScrollView.frame.size.width * [imagesArray count], ImageScrollView.frame.size.height)];
[ImageScrollView setContentOffset:CGPointMake(screenWidth*currentIndex, 0)];
// Get the staff
dataSource = [DataSource dataSource];
NSArray *staffArray = [dataSource getStaff];
self.pageControl = [[UIPageControl alloc] init];
NSInteger placement = (screenWidth/2) - 50;
self.pageControl.frame = CGRectMake(placement, homeImage-30, 100, 20);
self.pageControl.numberOfPages = [staffArray count];
self.pageControl.currentPage = currentIndex;
[self setStaff:staffArray[currentIndex]];
[ImageScrollView addSubview:self.pageControl];
[MainScrollView addSubview:ImageScrollView];
[MainScrollView addSubview:lineView];
[self setDisplayContent];
}
I do need to refactor some of the code to make more efficient, but at this stage I am just trying to get the horizontal paging to scroll horizontally.
If anyone would possibly be able to help point me in the right direction as to how to fix this issue, it would be greatly appreciated.
Here is a visual of the UI that I am trying to keep but have the image scroll horizontal.
Staff Display

UIpagecontrol Need Animation Rigth to Left

Using UIControlpage in my application. load the image and display in page control successfully. but i want to display the images animation like right to left move. Using timer call page control and increase the array count.
//// using NSTimer to call function to show the animation.
[NSTimer scheduledTimerWithTimeInterval:5.0
target:self
selector:#selector(loadNextController)
userInfo:nil
repeats:YES];
ScrollViewPage = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 20, frameX, frameY)];
ScrollViewPage.pagingEnabled = YES;
ScrollViewPage.backgroundColor=[UIColor redColor];
ScrollViewPage.delegate = self;
ScrollViewPage.backgroundColor = [UIColor clearColor];
ScrollViewPage.contentSize = CGSizeMake(frameX, frameY);
ScrollViewPage.showsHorizontalScrollIndicator = NO;
ScrollViewPage.pagingEnabled = YES;
pageControl = [[UIPageControl alloc] init];
pageControl.frame = CGRectMake(100,self.view.frame.size.height-100,self.view.frame.size.width-200,100);
pageControl.numberOfPages = [_pageImages count];
pageControl.currentPage = 0;
[self.view addSubview: ScrollViewPage];
for(int i = 0; i < [_pageImages count]; i++)
{
NSURL *url = [NSURL URLWithString:[_pageImages objectAtIndex:i]];
NSData *data = [[NSData alloc] initWithContentsOfURL:url];
UIImage *tmpImage = [UIImage imageWithData:data];
_backgroundImageView = [[UIImageView alloc] initWithImage:tmpImage];
_backgroundImageView.frame = CGRectMake(frameX * i, 0.0, frameX, frameY);
[ScrollViewPage addSubview:_backgroundImageView];
}
ScrollViewPage.contentSize = CGSizeMake(frameX*[_pageImages count], frameY);
pageControl.backgroundColor=[UIColor orangeColor];
[self.view addSubview:pageControl];
[pageControl addTarget:self action:#selector(pageTurn:) forControlEvents:UIControlEventValueChanged];
///// Here call the timer function
- (void)loadNextController
{
pageControl.currentPage = (pageControl.currentPage+1)%self.pageImages.count;
ScrollViewPage.contentOffset = CGPointMake(pageControl.currentPage * self.view.bounds.size.width, 0);
}
Here i need to show left to right move in uipagecontrol. help me..
In general you should always write what is your current result, what is the expected result and what have you tried.
I can only guess the issue you are facing is there are no animations.
The scroll view has a method setContentOffset:animated which you can use to animate the transition. Another approach is to use UIView animateWithDuration and sett the offset in the method block.
Try any or both of these...
[ScrollViewPage setContentOffset:CGPointMake(pageControl.currentPage * self.view.bounds.size.width, 0) animated:YES];
Or
[UIView animateWithDuration:0.2 animations:^{
ScrollViewPage.contentOffset = CGPointMake(pageControl.currentPage * self.view.bounds.size.width, 0);
}];
EDIT: Loop images.
To loop images you really only need 2 images on the scroll view at the time. I will show you the concept with 3 and you can try and play around with it.
NSArray *allImages;
NSInteger currentIndex = 0;
UIScrollView *scrollView;
UIImageView *imageViews[3];
- (void)begin {
scrollView.contentSize = CGSizeMake(scrollView.frame.size.width*3.0, scrollView.frame.size.height); // always have 3 images at the time
scrollView.contentOffset = CGPointMake(scrollView.frame.size.width, 0.0); // put to center
for(int i=0; i<3; i++) {
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(scrollView.frame.size.width*i, 0.0, scrollView.frame.size.width, scrollView.frame.size.height)];
[scrollView addSubview:imageView];
imageView[i] = imageView;
}
[self layoutForIndex:currentIndex];
}
- (void)nextImage {
currentIndex++;
[self layoutForIndex:currentIndex];
scrollView.contentOffset = CGPointZero;
[scrollView setContentOffset:CGPointMake(scrollView.frame.size.width, 0.0) animated:YES]
}
- (void)layoutForIndex:(NSInteger)index {
if(allImages.count > 0) { // we need at least one image to do something
for(int i=0; i<3; i++) {
// do the circling
NSInteger imageIndex = index-1+i;
while(imageIndex < 0) imageIndex+=allImages.count;
while(imageIndex >= allImages.count) imageIndex-=allImages.count;
imageViews[i].image = imageViews[imageIndex];
}
}
}
But in general for what you are doing you do not even need a scroll view. On next you can simply add another image view next to the current one and then use the UIView animation to reposition both of the image views.

i want show different images continuously without user touch the button

when the user touch the button the below code show the image.i want show different images like "bear,cat,cow,dog" continuously without user touch the button.can any one help me.
NSMutableArray *dashBoy = [NSMutableArray array];
for (i = 1; i<= 12; i++)
{
butterfly = [NSString stringWithFormat:#"bear_%d.png", i];
if ((image = [UIImage imageNamed:butterfly]))
[dashBoy addObject:image];
}
[stgImageView setAnimationImages:dashBoy];
[stgImageView setAnimationDuration:4.0f];
[stgImageView setAnimationRepeatCount:2];
[stgImageView startAnimating];
You could do as below:-
Firstly, create a UIImageView property like below,
#property (nonatomic,weak) IBOutlet UIImageView *imageView; //Also connect it with storyboard or xib.
Then you could write down IBAction as follow:-
- (IBAction)startTap:(id)sender {
[self.imageView setAnimationDuration:1.0f]; //You could change the duration for making animation fast or slow.
[self.imageView setAnimationImages:imageArray]; //imageArray is NSArray of images of which you want to show slide show.
[self.imageView startAnimating]; //simply to start animation.
}
- (IBAction)stopTap:(id)sender {
[self.imageView stopAnimating]; //To stop animation.
}
try this..
create two instance objects like
NSMutableArray * imagesArray; and UIImageView *animationImageView;
-(void)viewDidLoad
{
NSArray *imageNames = #[#"img1.png", #"img2.png", #"img3.png", #"img4.png",#"img5.png"];
imagesArray = [[NSMutableArray alloc]init];
NSMutableArray *images = [[NSMutableArray alloc] init];
for (int i = 0; i < imageNames.count; i++)
{
[imagesArray addObject:[UIImage imageNamed:[imageNames objectAtIndex:i]]];
}
animationImageView = [[UIImageView alloc] initWithFrame:CGRectMake(60, 95, 86, 193)];
animationImageView.animationImages = imagesArray;
animationImageView.animationDuration = 0.5; // set your own
[self.view addSubview:animationImageView];
}
and to start and stop two UIButton Actions
-(IBAction)startAnimation:(UIButton*)sender
{
[animationImageView startAnimating];
}
-(IBAction)stopAnimation:(UIButton*)sender
{
[animationImageView stopAnimating];
}

iOS - Horizontal UIScrollView with multiple UITableViews

UIScrollView scrolls Horizontally and UITableView scrolls vertically inside that but unable to load different data when scroll horizontally.
have one scrollview which scrolls horizontally on screen and inside of that i have added multiple tableview and want to display different different datas on tableview when swipe. i have tried this but with no luck :(
NSArray *arr1 = [[NSArray alloc] initWithObjects:#"1",#"2",#"3", nil];
NSArray *arr2 = [[NSArray alloc] initWithObjects:#"4",#"5",#"6", nil];
NSArray *arr3 = [[NSArray alloc] initWithObjects:#"7",#"8",#"9", nil];
NSArray *arr4 = [[NSArray alloc] initWithObjects:#"10",#"11",#"12", nil];
arrData = [[NSMutableArray alloc] initWithObjects:arr1,arr2,arr3,arr4, nil];
int width=0;
for (int i = 0; i<[arrData count]; i++) {
tblData = [[UITableView alloc] initWithFrame:CGRectMake(width, 20, 300, 245) style:UITableViewStylePlain];
tblData.dataSource = self;
tblData.delegate = self;
[tblData setBackgroundColor:[UIColor clearColor]];
tblData.separatorColor = [UIColor blackColor];
[scrHorizontal addSubview:tblData];
width+=300;
}
[self.scrHorizontal setContentSize:CGSizeMake(([arrData count])*300, self.scrHorizontal.frame.size.height)];
here 4 pages inside scrollview which includes 4 tableviews i want to display 1,2,3 on first table and 4,5,6 on second table when swipe scrollview and so on...
please help me thanks in advance.
I have seen your code , you can do with tag,
set tag to tableview in loop
for (int i = 0; i<[arrData count]; i++) {
tblData = [[UITableView alloc] initWithFrame:CGRectMake(width, 20, 300, 245) style:UITableViewStylePlain];
tblData.tag=i;
tblData.dataSource = self;
tblData.delegate = self;
[tblData setBackgroundColor:[UIColor clearColor]];
tblData.separatorColor = [UIColor blackColor];
[scrHorizontal addSubview:tblData];
width+=300;
}
now in cellForRowAtIndexPath method just use it
like
NSArray *arr = [arrData objectAtIndex:tableView.tag];
cell.textLabel.text = [arr objectAtIndex:indexPath.row];
check it ScrollViewDemo
Hope it Helps.

How to randomize images in a page scrollview

I have 12 images, stored in an array...
I use this to output the image.
scrollView = [[UIScrollView alloc] init];
CGRect scrollFrame;
scrollFrame.origin.x = 0;
scrollFrame.origin.y = 0;
scrollFrame.size.width = WIDTH_OF_SCROLL_PAGE;
scrollFrame.size.height = HEIGHT_OF_SCROLL_PAGE;
scrollView = [[UIScrollView alloc] initWithFrame:scrollFrame];
scrollView.bounces = YES;
scrollView.pagingEnabled = YES;
scrollView.showsHorizontalScrollIndicator = NO;
scrollView.delegate = self;
scrollView.userInteractionEnabled = YES;
NSMutableArray *slideImages = [[NSMutableArray alloc] init];
[slideImages addObject:#"KODAK1.png"];
[slideImages addObject:#"KODAK2.png"];
[slideImages addObject:#"KODAK3.png"];
[slideImages addObject:#"KODAK4.png"];
[slideImages addObject:#"KODAK5.png"];
[slideImages addObject:#"KODAK6.png"];
[slideImages addObject:#"KODAK7.png"];
[slideImages addObject:#"KODAK8.png"];
[slideImages addObject:#"KODAK9.png"];
[slideImages addObject:#"KODAK10.png"];
[slideImages addObject:#"KODAK11.png"];
[slideImages addObject:#"KODAK12.png"];
srandom(time(NULL));
int x = arc4random() % 12;
for ( int i = 0 ;i<[slideImages count]; i++) {
//loop this bit
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:[slideImages objectAtIndex:i]]];
imageView.frame = CGRectMake((WIDTH_OF_IMAGE * i) + LEFT_EDGE_OFSET, 0 , WIDTH_OF_IMAGE, HEIGHT_OF_IMAGE);
[scrollView addSubview:imageView];
[imageView release];
}
[scrollView setContentSize:CGSizeMake(WIDTH_OF_SCROLL_PAGE * ([slideImages count] +0), HEIGHT_OF_IMAGE)];
[scrollView setContentOffset:CGPointMake(0, 0)];
[self.view addSubview:scrollView];
[self.scrollView scrollRectToVisible:CGRectMake(WIDTH_OF_IMAGE,0,WIDTH_OF_IMAGE,HEIGHT_OF_IMAGE) animated:YES];
[super viewDidLoad]
How can i output random images in the UIView? as in there are 12 images, but each time i run the application, the app will start at a random image, but i will still be able to scroll through the images. i hope you guys understand my question.
You could "shuffle" the NSMutableArray each time you create it:
NSMutableArray *slideImages = [[NSMutableArray alloc] init];
...
[slideImages shuffle];
...
So each time you will be initializing the UIScrollView with a different order.
shuffle is not part of the SDK. For an sample implementation, please have a look to this:
#implementation NSMutableArray (Shuffling)
- (void)shuffle
{
static BOOL seeded = NO;
if(!seeded)
{
seeded = YES;
srandom(time(NULL));
}
NSUInteger count = [self count];
for (NSUInteger i = 0; i < count; ++i) {
// Select a random element between i and end of array to swap with.
int nElements = count - i;
int n = (random() % nElements) + i;
[self exchangeObjectAtIndex:i withObjectAtIndex:n];
}
}
#end
Import the header file containing you category declaration:
#interface NSMutableArray (Shuffling)
- (void)shuffle;
#end
wherever you want to use shuffle.

Resources