I'm having problems adding subviews to a scrollview sequentially.
I've got a JSON response coming back from the server which I parse into an array of Business objects, and I send off to the function updateCarousel, which looks like this:
-(void) updateCarousel: (NSArray *)response{
if(response && response.count>0){
int i=0;
self.scrollView.hidden=NO;
[self.scrollView setNeedsDisplay];
self.pageControl.hidden=NO;
[self.scrollView setContentOffset:CGPointMake(0, 0) animated:NO];
for (Business *business in response){
if (i >= MAX_INITAL_SEARCH_RESULTS)
break;
CGRect frame;
frame.origin.x = self.scrollView.frame.size.width * i;
frame.origin.y = 0;
frame.size = scrollView.frame.size;
CardView *cardView = [[CardView alloc] initWithBusinessData:business andFrame:frame];
//I've tried the following code with and without wrapping it in a GCD queue
dispatch_queue_t addingQueue = dispatch_queue_create("adding subview queue", NULL);
dispatch_async(addingQueue, ^{
[self.scrollView addSubview:cardView];
});
dispatch_release(addingQueue);
cardView.backgroundColor = [UIColor colorWithWhite:1 alpha:0];
i++;
self.scrollView.contentSize = CGSizeMake(i*(self.scrollView.frame.size.width), self.scrollView.frame.size.height);
self.pageControl.numberOfPages=i;
}
}else{
self.scrollView.hidden=YES;
self.pageControl.hidden=YES;
NSLog(#"call to api returned a result set of size 0");
}
The result - despite the many things I've tried - is always the same: the scrollView adds the subviews all at once, not as they are processed through the loop. I don't understand how this is possible. If I add a sleep() at the end of the loop, it somehow waits for the whole loop to be over before it shows the subviews as added. How does it even know how long the results array is? I'm at my wits' end, please help.
I assume you are not using any extra threads to process the data.
What you experience is the application is stuck executing your method. Even though you add your subviews one by one (with a sleep between them), no other piece of code is executed to handle your adding.
1. You can use another thread to load the data and add subviews but this needs to be synchronized to the main thread (more complicated).
2 You can break your method in multiple calls. Between 2 calls of your load method, other pieces of code are allowed to execute and this means the scrollview will be able to process/display your subviews one by one.
You will need to change your loading method to something like this:
- (void)updateCarouselStep:(NSNumber*)loadIndex
{
if (response && response.count > 0)
{
// Here add only a subview corresponding to loadIndex
// Here we schedule another call of this function if there is anything
if (loadIndex < response.count - 1)
{
[self performSelector:#selector(updateCarouselStep:) withObject:[NSNumber numberWithInt:(loadIndex+1) afterDelay:0.5f];
}
}
}
This is just one basic solution to the problem. For example, you need to take into consideration what happens if you update response data before you finish loading the previous one.
Related
I am developing an IOS 10.x application using UICollectionView and would like to change the image of specific cells, at regular interval.
The code below shows the current implementation. Even though it should change the cell background image every half of second, it changes the images immediately disregarding the NSThread SleepAt interval of 0.5 seconds.
I suspect something about the main thread handling or the ReloadItem method but hasn't reached a clear conclusion. Any insight is very welcome! Thank you.
NSNumber* originalCardSelected;
int position;
for (int i = 0; i < [opponentOriginalCardArray count]; i++) {
originalCardSelected = [opponentOriginalCardArray objectAtIndex:i];
position = [self convertLevelDataPositionToCellViewPosition:[originalCardSelected intValue]];
NSMutableArray *tmpBackgroundAssets = [self getNewAssetBackgroundBasedOnBackgroundType:playbackBackground Index:position];
self.backgroundAssets = tmpBackgroundAssets;
dispatch_async(dispatch_get_main_queue(), ^{
[collectionViewRoot reloadItemsAtIndexPaths:[collectionViewRoot indexPathsForVisibleItems]];
});
[NSThread sleepForTimeInterval:0.5];
}
You should use performBatchUpdates(_:completion:) methods and add your for loop inside it.
Remember to not keep strong references inside the block to avoid retain cycles.
EDIT:
and in the completion block, you can check if finished and add your NSThread methods
I've read many many SO solutions about UICollectionView with paging. I myself also work with those solutions:
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
CGFloat pageWidth = self.collectionView.frame.size.width;
self.lbPaging.text = [NSString stringWithFormat:#"%d/%d", self.collectionView.contentOffset.x / pageWidth, totalPage];
}
OR
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
CGFloat pageWidth = self.collectionView.frame.size.width;
self.lbPaging.text = [NSString stringWithFormat:#"%d/%d", self.collectionView.contentOffset.x / pageWidth, totalPage];
}
Yeah, this work fine most the time. But now I experienced something unexpected:
When user scroll fast enough, it'll get past the method above, which may cause the paging malfunction (like 15/13 at the last page, or showing 3/5 even though it's the first page).
Precisely for us developer or tester, to reproduce this bug, keep your finger touch on the scroll view and start to scroll. When you're nearly out of the edge (where normally, you'll release your finger), touch the other side of the edge and keep scrolling. It's easier to reproduce on real device.
So I'm asking if anyone know a proper way to display the page navigation? Well, without UIPageViewController (I'd like to display the numeric page, not the dots).
EDIT
I don't know if this problem is critical or not, but I think maybe it is, because I'm performing loading data when scrolling to next page. Recently, I've got crash at this (it's really hard to debug, like at which step it got crash):
[self.collectionView performBatchUpdates:^{
NSMutableArray *arrayWithIndexPaths = [NSMutableArray array];
for (NSInteger index = 0; index < next2page.count; index++ ) {
[arrayWithIndexPaths addObject:[NSIndexPath indexPathForRow:(index + offset) inSection:0]];
}
[self.collectionView insertItemsAtIndexPaths:arrayWithIndexPaths];
} completion:nil];
Exception is something like this: Fail to insert items to index path in section 0 (has only 69 row, insert to indexPath:73)
hello i have create button in UICollectionView like load more data and function is given below:-
- (void)viewDidLoad {
//declare page inedex initial base 0.
self.pageIndex = 0;
[self loadMoreData];
}
after you call load more data function page index will increase here i want my page index like 0,20,40 so i have create self.pageIndex+= 20 u can change according to your want
-(void)loadMoreData
{
self.isFromMoreData = TRUE;
self.pageIndex+= 20;
NSLog(#"loadMoreData %d and self.index %d",self.pageIndex,self.index);
[self loadDataIntoCollectionView];//this function calls api
}
******************another way is given below*******************************
use UIRefreshControl.
UIRefreshControl *refreshControl = [[UIRefreshControl alloc] init];
refreshControl = refreshControl;
refreshControl.backgroundColor = [UIColor whiteColor];
refreshControl.tintColor = [UIColor grayColor];
[refreshControl addTarget:self action:#selector(loadMoreData) forControlEvents:UIControlEventValueChanged];
self.myCollectionView.pagingEnabled = YES;
[self.myCollectionView addSubview:refreshControl];
self.myCollectionView.alwaysBounceVertical = YES;
and call the same function loadMoreData that i have declare above.
Hope this help you...
please referred my image
am trying to place a ScrollView in my app that has 1000,000 record, this scrollView will load when the app launches, so the app is not running until the million 1000 000 record which takes a lot of time, i was wondering is there any way to show the app and the scrollView while records are loading (show the scrollView while adding its records), below the code am using:
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
[self loadIt];
}
- (void)loadIt{
float startX = 0;
float startY = 0;
[_bigScroll setContentSize:CGSizeMake(320, 312500)];
_bigScroll.pagingEnabled = NO;
for (counter=0; counter<999999; counter++)
{
UIButton *tester=[[UIButton alloc] initWithFrame:CGRectMake(startX, startY, 10, 10)];
if (counter % 2 == 0) {
[tester setBackgroundColor:[UIColor whiteColor]];
}
else
{
[tester setBackgroundColor:[UIColor grayColor]];
}
[_bigScroll addSubview:tester];
[tester release];
if (startX == 320) {
startX = 0;
startY += 10;
}
else
startX += 10;
NSLog(#"counter = %d", counter);
}
}
Please advice.
Is there any way to show the app and the scrollView while records are loading ?
Try to use [self performSelector:#selector(loadIt) withObject:nil]; or
[self performSelector:#selector(loadIt) withObject:nil afterDelay:0.2];
It will not block your UI until the execution of this method.
You are loading lots of records. Actually you should not load all records at at time. You should use mechanism something like tableview is using i.e.load only those record which are in visible area of scrollview. Don't load new rows until the scroll and you should reuse row or views so speedup the scrolling.
Apple's documentation for UIScrollView is very clear that the scrolled view should be tiled, with your application providing tiles as the view scrolls.
The object that manages the drawing of content displayed in a scroll view should tile the content’s subviews so that no view exceeds the size of the screen. As users scroll in the scroll view, this object should add and remove subviews as necessary.
This is necessary both for performance and memory usage: the scrollable view is backed by a CALayer, which in turn is backed by a bitmap. The same is true for each of the UIButton objects created.
Whilst it is not surprising that this takes a long time, it's more of a mystery that your app hasn't been terminated for using too much memory.
Both UITableView and UICollectionView are examples of views that tile their content. You may find you can use one of these to implement you requirements, and if not, follow the model they use.
You don't need to create 1000,000 views . You can create views dynamically and remove the previous views those are not visible at the screen space. So at the time of scrolling you can create new views and remove the views those are out of visible area of screen.
This will help you to save memory otherwise whether you are using ARC in your project if you load that much number of views in memory there will surely a chance of crash , ARC will not help you in that case.
once try this Change the code in the
-viewdidload()
{
[self loadIt];//change this to
[self performSelectorInBackground:#selector(loadIt) withObject:nil];
}
I'm trying to increase the scrolling performance of my UIScrollView. I have a lot of UIButtons on it (they could be hundreds): every button has a png image set as background.
If I try to load the entire scroll when it appears, it takes too much time. Searching on the web, I've found a way to optimize it (loading and unloading pages while scrolling), but there's a little pause in scrolling everytime I have to load a new page.
Do you have any advice to make it scroll smoothly?
Below you can find my code.
- (void)scrollViewDidScroll:(UIScrollView *)tmpScrollView {
CGPoint offset = tmpScrollView.contentOffset;
//322 is the height of 2*2 buttons (a page for me)
int currentPage=(int)(offset.y / 322.0f);
if(lastContentOffset>offset.y){
pageToRemove = currentPage+3;
pageToAdd = currentPage-3;
}
else{
pageToRemove = currentPage-3;
pageToAdd = currentPage+3;
}
//remove the buttons outside the range of the visible pages
if(pageToRemove>=0 && pageToRemove<=numberOfPages && currentPage<=numberOfPages){
for (UIView *view in scrollView.subviews)
{
if ([view isKindOfClass:[UIButton class]]){
if(lastContentOffset<offset.y && view.frame.origin.y<pageToRemove*322){
[view removeFromSuperview];
}
else if(lastContentOffset>offset.y && view.frame.origin.y>pageToRemove*322){
[view removeFromSuperview];
}
}
}
}
if(((lastContentOffset<offset.y && lastPageToAdd+1==pageToAdd) || (lastContentOffset>offset.y && lastPageToAdd-1==pageToAdd)) && pageToAdd>=0 && pageToAdd<=numberOfPages){
int tmpPage=0;
if((lastContentOffset<offset.y && lastPageToAdd+1==pageToAdd)){
tmpPage=pageToAdd-1;
}
else{
tmpPage=pageToAdd;
}
//the images are inside the application folder
NSString *docDir = [NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES) objectAtIndex:0];
for(int i=0;i<4;i++){
UIButton* addButton=[[UIButton alloc] init];
addButton.layer.cornerRadius=10.0;
if(i + (tmpPage*4)<[imagesCatalogList count]){
UIImage* image=[UIImage imageWithContentsOfFile:[NSString stringWithFormat: #"%#/%#",docDir,[imagesCatalogList objectAtIndex:i + (tmpPage*4)]]];
if(image.size.width>image.size.height){
image=[image scaleToSize:CGSizeMake(image.size.width/(image.size.height/200), 200.0)];
CGImageRef ref = CGImageCreateWithImageInRect(image.CGImage, CGRectMake((image.size.width-159.5)/2,(image.size.height-159.5)/2, 159.5, 159.5));
image = [UIImage imageWithCGImage:ref];
}
else if(image.size.width<image.size.height){
image=[image scaleToSize:CGSizeMake(200.0, image.size.height/(image.size.width/200))];
CGImageRef ref = CGImageCreateWithImageInRect(image.CGImage, CGRectMake((image.size.width-159.5)/2, (image.size.height-159.5)/2, 159.5, 159.5));
image = [UIImage imageWithCGImage:ref];
}
else{
image=[image scaleToSize:CGSizeMake(159.5, 159.5)];
}
[addButton setBackgroundImage:image forState:UIControlStateNormal];
image=nil;
addButton.frame=CGRectMake(width, height, 159.5, 159.5);
NSLog(#"width %i height %i", width, height);
addButton.tag=i + (tmpPage*4);
[addButton addTarget:self action:#selector(modifyImage:) forControlEvents:UIControlEventTouchUpInside];
[tmpScrollView addSubview:addButton];
addButton=nil;
photos++;
}
}
}
lastPageToAdd=pageToAdd;
lastContentOffset=offset.y;
}
Here's a few recommendations:
1) First, understand that scrollViewDidScroll: will get called continuously, as the user scrolls. Not just once per page. So, I would make sure that you have logic that ensures that the real work involved in your loading is only triggered once per page.
Typically, I will keep a class ivar like int lastPage. Then, as scrollViewDidScroll: is called, I calculate the new current page. Only if it differs from the ivar do I trigger loading. Of course, then you need to save the dynamically calculated index (currentPage in your code) in your ivar.
2) The other thing is that I try not to do all the intensive work in the scrollViewDidScroll: method. I only trigger it there.
So, for example, if you take most of the code you posted and put it in a method called loadAndReleasePages, then you could do this in the scrollViewDidScroll: method, which defers the execution until after scrollViewDidScroll: finishes:
- (void)scrollViewDidScroll:(UIScrollView *)tmpScrollView {
CGPoint offset = tmpScrollView.contentOffset;
//322 is the height of 2*2 buttons (a page for me)
int currentPage = (int)(offset.y / 322.0f);
if (currentPage != lastPage) {
lastPage = currentPage;
// we've changed pages, so load and release new content ...
// defer execution to keep scrolling responsive
[self performSelector: #selector(loadAndReleasePages) withObject: nil afterDelay:0];
}
}
This is code that I've used since early iOS versions, so you can certainly replace the performSelector: call with an asynchronous GCD method call, too. The point is not to do it inside the scroll view delegate callback.
3) Finally, you might want to experiment with slightly different algorithms for calculating when the scroll view has actually scrolled far enough that you want to load and release content. You currently use:
int currentPage=(int)(offset.y / 322.0f);
which will yield integer page numbers based on the way the / operator, and the float to int cast works. That may be fine. However, you might find that you want a slightly different algorithm, to trigger the loading at a slightly different point. For example, you might want to trigger the content load as the page has scrolled exactly 50% from one page to the next. Or you might want to trigger it only when you're almost completely off the first page (maybe 90%).
I believe that one scrolling intensive app I wrote actually did require me to tune the precise moment in the page scroll when I did the heavy resource loading. So, I used a slightly different rounding function to determine when the current page has changed.
You might play around with that, too.
Edit: after looking at your code a little more, I also see that the work you're doing is loading and scaling images. This is actually also a candidate for a background thread. You can load the UIImage from the filesystem, and do your scaling, on the background thread, and use GCD to finally set the button's background image (to the loaded image) and change its frame back on the UI thread.
UIImage is safe to use in background threads since iOS 4.0.
Don't touch a line of code until you've profiled. Xcode includes excellent tools for exactly this purpose.
First, in Xcode, make sure you are building to a real device, not the simulator
In Xcode, choose Profile from the Product menu
Once Instruments opens, choose the Core Animation instrument
In your app, scroll around in the scroll view you're looking to profile
You'll see the real time FPS at the top, and in the bottom, you'll see a breakdown of all function and method calls based on total time ran. Start drilling down the highest times until you hit methods in your own code. Hit Command + E to see the panel on the right, which will show you full stack traces for each function and method call you click on.
Now all you have to do is eliminate or optimize the calls to the most "expensive" functions and methods and verify your higher FPS.
That way you don't waste time optimizing blind, and potentially making changes that have no real effect on the performance.
My answer is really a more general approach to improving scroll view and table view performance. To address some of your particular concerns, I highly recommend watching this WWDC video on advanced scroll view use: https://developer.apple.com/videos/wwdc/2011/includes/advanced-scrollview-techniques.html#advanced-scrollview-techniques
The line that is likely killing your performance is:
addButton.layer.cornerRadius=10.0;
Why? Turns out the performance for cornerRadius is AWFUL! Take it out... guaranteed huge speedup.
Edit: This answer sums up what you should do quite clearly.
https://stackoverflow.com/a/6254531/537213
My most common solution is to rasterize the Views:
_backgroundView.layer.shouldRasterize = YES;
_backgroundView.layer.rasterizationScale = [[UIScreen mainScreen] scale];
But it works not in every situation.. Just try it
In an application I'm developing, I have a horizontal UIScrollView that is used as a sort of table view.
Adding the subviews to it blocked the main thread, so I decided to use GCD instead, and create the views in a background thread and add them to the UIScrollView instance in the main queue.
The relevant code is this:
NSUInteger numberOfItems = [_dataSource numberOfItemsInBandView:self];
CGFloat __block nextX = 0.0;
dispatch_queue_t bgQueue = dispatch_queue_create("bandview", NULL);
for (NSUInteger i = 0; i < numberOfItems; i++) {
dispatch_async(bgQueue, ^{
UIView *itemView = [_dataSource bandView:self viewForItemAtIndex:i];
itemView.frame = CGRectMake(nextX, 0, itemView.frame.size.width, itemView.frame.size.height);
dispatch_async(dispatch_get_main_queue(), ^{
[_scrollView addSubview:itemView];
_scrollView.contentSize = CGSizeMake(nextX, self.frame.size.height);
});
nextX += itemView.frame.size.width;
});
}
dispatch_release(bgQueue);
_scrollView is a UIScrollView instance (properly initialized).
What I expected is to see the subviews be added to the UIScrollView one by one, but instead, what I'm experiencing is that everything runs asynchroniously, and then the scrollbars refreshes with all its subviews added at once (which is not what I expect).
Can anyone spot what I'm missing here?
UI changes need to happen on the main thread. Performing UI changes in a background thread (async gcd queue) will result in undefined/undesirable behavior as you are seeing. It seems unlikely that adding subviews is the main cause of the problem. The issue likely lies in the way the data is retrieved for the subviews. A solution would be to add all of the subviews then retrieve the data for them asynchronously, and then update them as the operation completes. Also consider not adding views that will not be visible to the user, and add them dynamically as the user scrolls similar to how a UITableView works.
Another thing worth pointing out is that you have created a serial queue (bandview) to dispatch the UIView creation requests into, but this also means that each creation request will happen in linear order vs being created in the most concurrent fashion possible. You might try dispatching the creation requests onto one of the global concurrent queues if that's not the desired behavior.