如何创建像iPhone Facebook应用程序一样的登录屏幕？

Question

The Facebook app for the iPhone has a great username/password setup where it almost looks like it is a uitableview with UITextField's inside the two rows, is this how it is done? Or would it be something different to this altogether?

If it is a tableview, how can I access the textfields inside the tableview once the user hits the Login button? Is there a quick way to iterate over the cells in a tableview?

A simple one, I know, but I didnt want to implement an elaborate tableview if I didnt need to...

Answer 1

The source : https://github.com/c99koder/lastfm-iphone

Edited: It's possible you customize the UITableViewCell and put a UITextField inside. However, there is an even easy way to achieve this, since the login / signup page would almost always be static. See below.

LastFM for iPhone used a similar login / signup page design. And they open-sourced their code. Take a look at the nib file and you will know how LastFM did this. :-)

• Screenshot 1: original
• Screenshot 2: after I removed some of the background png files.

Answer 2

Create a tableview controller and go to the xib file -> attributes inspector->tableview and select "group styled" instead of plain. Then u can customize the tableview cells in the code by adding the textfields for username and password. Then create a new UIView and set the view to the tableview's footer view for the login button.

For more explanation regarding the same, go through the answer for this question.

Table view in iPhone in grouped style

Answer 3

It looks like it's not using a UITableView at all (otherwise, you'd be able to scroll the page up and down). It's just two UITextField s over custom backgrounds (or with custom backgrounds).

Now, if you wanted to use a UITableView , what you could do is store as variables the UITextField s within the UITableViewCell s. Then, when the person clicks a login button, you just get the text value from the UITextField s.

But, again, if you wanted to emulate the Facebook look, you don't need to bother with the UITableView .

Hope this helps!

Answer 4

Alright, now that I understand your question (thanks @Jonathan!), yes it does look like it is a tableview using custom UITableViewCells with a UITextField.

After creating the custom cell with a UITextField you can assign your view controller as the UITextField delegate and access the values at various points through the delegate methods:

– textFieldShouldBeginEditing:
– textFieldDidBeginEditing:
– textFieldShouldEndEditing:
– textFieldDidEndEditing:

As an example, in your textFieldShouldReturn: , you can grab a reference to the indexPath of that cell with :

NSIndexPath *indexPath = [self.loginTable indexPathForCell:(MemberLoginCell*)[[textField superview] superview]];

And then to the cell with:

MemberLoginCell *cell = (MemberLoginCell*)[self.loginTable cellForRowAtIndexPath:indexPath];

Or simply grab the textField.text value and assign it to an NSString that can be passed to your LOGIN method as required.

Answer 5

I know there's already an accepted answer, but I created a facebook-type login page, using a UITableView. The code is here on github