Scroll a view with 20 text boxes horizontally using UIScrollView

Question

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.

Alternatively you can have a look at UICollectionView as they will be far more efficient than using plain UISCrollViews, especially if you plan to grow larger than 20 items, which are probably already too many. http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UICollectionView_class/Reference/Reference.html — Javier Quevedo, Aug 08 '13 at 07:52

score 2 · Answer 1 · answered Aug 08 '13 at 08:22

2

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.

answered Aug 08 '13 at 08:22

hpp

619
3
13

1

Thank you so much.it is great help for me. – sudheer Aug 08 '13 at 08:59
did my code helped you or the above code? u have rated the above code ? – hpp Aug 08 '13 at 09:33
I got another problem.Now i ave 15 columns.The vertical scroll is not working.Please Help me. – sudheer Aug 12 '13 at 06:12
Check the contentSize of your scrollView, it is probably too small on the vertical component. Have you looked at the documentation of the scrollView? That normally helps! – Javier Quevedo Aug 14 '13 at 08:52

score 1 · Accepted Answer · edited May 23 '17 at 12:05

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!

I creted a view with 20 textboxex in ipad.Now i want to scroll that view.Can it possible.Please give me a sample code — sudheer, Aug 08 '13 at 08:25
@sudheer please include some of your code so that we can tune the code above to suite your particular case. — Javier Quevedo, Aug 09 '13 at 11:05
I got another problem.Now i ave 15 columns.The vertical scroll is not working.Please Help me — sudheer, Aug 12 '13 at 06:16
Can you please post your code? It's a bit difficult without seeing it :) — Javier Quevedo, Aug 12 '13 at 08:15
@Sudheer, if you want people to help on Stack Overflow, it's important to a) respond to their questions (in this case, what code have you written), and b), to show appreciation of their help (or not), by up voting or down voting (up arrow and down arrow). — ICL1901, Aug 13 '13 at 08:40
I guess that @sudheer has already fixed the problem and doesn't seem to want to be bothered with it anymore, David :( — Javier Quevedo, Aug 14 '13 at 08:51

Scroll a view with 20 text boxes horizontally using UIScrollView

2 Answers2