-- XCODE 5, iOS 7 --
I want to create an instruction manual for my application with 7 pictures sized 280 x 342, with a UIPageControl with 7 dots below it. I want to have it so the user swipes to the right and it navigates through the images i've made, showing the user how to play my game.
I've been searching for hours and can't find anything, I even tried asking on here already but wasn't given much help.
If anyone could direct me to a tutorial that explains how to do this, or write out the code and show me it would be much appreciated.
Thanks.
Ballpark:
-(void)setupPagingScrollView
{
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0,0,280,342)];
[self addSubview:scrollView];
[scrollView setDelegate:self]
[scrollView setPagingEnabled:YES];
control = [[UIPageControl alloc] initWithFrame:yourPagingButtonsFrame];
[control setNumberOfPages:[imagePanes count]];
[self addSubview:control];
}
-(void)scrollViewDidScroll:(UIScrollView *)inScrollView
{
UIPageControl *control;
int currentPage = inScrollView.contentOffset.x / inScrollView.bounds.size.width;
[control setCurrentPage:currentPage];
}
You need to create a scrollview with paging enabled (this is what you will add your images to). Then you need to create a UIPageControl. Then when the scrollview scrolls (or when the scrollview ends scrolling, your choice there) you change the UIControl's page number based on the scroll position.
You can also set the UIPageControl's delegate to yourself so that you can listen for tab button clicks from it and adjust your scrollview accordingly, but I use it as a display of information only, not to receive user input.
Put the images side by side in a scrollview. Put a UIPageControl on top and set the number of pages to 7. Then use
-(void)scrollViewDidScroll:(UIScrollView *)scrollView {
CGFloat pageWidth = scrollView.bounds.size.width;
NSInteger pageNumber = floor((scrollView.contentOffset.x - pageWidth / 2) / pageWidth) + 1;
self.pageControl.currentPage = pageNumber;
}
Related
Here,when button taps label count is increments & decrements.While label count increments images will be added by respective count.here my code for incrementing label count
if (counter >= 9 )
return;
[_count setText:[NSString stringWithFormat:#"%d",++counter]];
but i need to display while incrementing the label count then automatically increments images one by one.like this
Can you please help me how can i implement,thank you.
Add a UIScrollView in place of where you want to show images. When click on '+' button, call following method by passing the 'counter' value.
-(void)addImage:(int) count {
UIScrollView * scView = [[UIScrollView alloc] init];
scView.frame = CGRectMake(30, 60, self.view.frame.size.width, 60);
UIButton * btn;
UIImageView * imgV;
float imgWidth = 44;
for(int i=0;i<count;i++) {
imgV = [[UIImageView alloc] init];
imgV.frame = CGRectMake(i*imgWidth, 0, imgWidth, 44);
imgV.image = [UIImage imageNamed:#"gitar"];
[scView addSubview:imgV];
}
[scView setContentSize:CGSizeMake(imgWidth*count, 50)];
[scView setBackgroundColor:[UIColor redColor]];
[self.view addSubview:scView];
}
- (IBAction)descrese:(id)sender {
counter -= 1;
[self addImage:counter];
}
- (IBAction)btnTap:(id)sender {
counter += 1;
[self addImage:counter];
}
This adds as many images as you want in horizontal scroll view.
use a uiscrollview with cells of images, that simple.
Use UIScrollView.
As number of elements is increasing/decreasing:
1) increse/deacrease UIScrollView size respectively
2) add/remove elements
I guess, the screenshot was taken from MMT app. They're using this feature in their app. I believe, they might have developed a separate control to handle this thing, where they can only pass few arguments like image to show (people), count etc.
You can also develop such kind of UI with following way:
Create a custom view, take a UICollectionView inside it, take argument of image to show and number of rows count, fixed the cell size in layouts. Add a method which will reloads UI (inside logic: reloading UICollectionView) to refresh content when user taps on [ + ] or [ - ] button. Why, we're not taking UIScrollView, with it we can't reuse contents. I believe this step will need you to create everything programmatically.
When user taps on [ + ], you should increase width of our custom view, inside
you should override layoutSubview method to update frame of UICollectionView as well. You may require to refresh(reload) cells inside UICollectionView.
Do reverse when user taps [ - ].
You may require to set some logic so user can't add more/less numbers when selection.
This is just an idea, you may require to check each cases which the reference app has having.
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
So what I am after is a way to put a UIButton on top of a UIScrollView and a UIWebView under it. The reason I want it this way is that I need the button to "scroll away" as the user scrolls the page I load into the UIWebView.
In order for this to work, I need to get the height of the content of the web page I load and then set the height of the web view to match this. If I can do this, I then intend to set the contentSize of the UIScrollView to match the heights of the button and web view.
I understand that somehow this is supposed to happen in the - (void)webViewDidStartLoad:(UIWebView *)webView method, which is confirmed on many threads on stackoverflow (for example this one). I also know that Apple says you shouldn't put a UiWebView in a UIScrollView, since the scrolling actions may interfere. Disabling scroll for the web view should avoid the problem though.
There are many threads discussing this matter, but none of them seem to work for me. Can it be because I am running on iOS7?
I am in big desperation here, help is much appreciated!
You can get height using following code :
NSString *heightStrig = [webView stringByEvaluatingJavaScriptFromString:#"(document.height !== undefined) ? document.height : document.body.offsetHeight;"];
float height = heightStrig.floatValue;
complete code :
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
CGRect frame = webView.frame;
NSString *heightStrig = [webView stringByEvaluatingJavaScriptFromString:#"(document.height !== undefined) ? document.height : document.body.offsetHeight;"];
float height = heightStrig.floatValue + 10.0;
frame.size.height = height;
webView.frame = frame;
}
You can get the height of the content loaded into a UIWebView as follows:
- (void)webViewDidFinishLoad:(UIWebView *)webView {
CGFloat contentHeight = webView.scrollView.contentSize.height;
}
And then adjust the frame of the web view accordingly.
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 have to implement 20 text boxes horizontally. How can I add a scroll bar to see all text boxes when I scroll to the left.
please try following code:
UIScrollView *scrlView=[[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 320, 50)];
scrlView.scrollEnabled=YES;
int x=5;
int y=5;
for (int i=0;i<20;i++ ) {
UITextField *txtField=[[UITextField alloc] initWithFrame:CGRectMake(x,y , 100,40 )];
txtField.tag=i;
txtField.delegate=self;
[scrlView addSubview:txtField];
x+=105;
}
scrlView.contentSize=CGSizeMake(x, 50);
[self.view addSubview:scrlView];
i hope this code will help you.
You can find plenty of questions about this topic (i.e., Calculate the contentsize of scrollview), but nonetheless here is my solution:
You want to use the UIScrollView for the task. Using it is rather simple in fact.
First you need to initialise and display the UIScrollView somewhere in your screen. I am going to assume that you are in a UIViewController, and that you want to create a scroll view of 300px width and 200px height. For this, you can do the following:
UIScrollView *aScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 300, 200)];
[[self view] addSubview:aScrollView];
[aScrollView setScrollEnabled:YES];
Now its time to place the content inside of it.
The key idea here to take into consideration is the following. While the 'UIScrollView' has a size itself, it also has an internal size for it's content, which is essentially the are that is scrollable.
Let's suppose that you have 20 items, each of which has a size of '40px width', and '200px height'. I am also going to suppose that you will want to leave a space of 10px between each text box. Thus, the total scrollable width for the area that we want to have inside the 'UIScrollView' is the following: (20 (items) * (40 (size of each item) + 10 (distance between each item))) -10. We shall then do the following:
[aScrollView setContentSize:CGSizeMake((20*(40 + 10))-10), 200];
All right, we are almost done. Now all we have to do is add each of the text items to the scroll view. Instead of doing it one by one, I am going to assume that you have them inside a collection such as a NSArray (probably an NSMutableArray).
NSArray *textFields; // the array with the collection of text boxes
int x = 0;
for (UITextField *aTextField in textFields){
[aTextField setFrame:CGRectMake(x, 0, 40, 200)];
[[self view] addSubview:aTextField];
x += 40 + 10; // incrementing the X coordinate to correctly place the next item
}
That's it!