Where do I start to create a "Contact Info" page/table? - iphone

I want to create a view in my app where the user can contact me. At first glance I can see it's a grouped table view, but I'm unsure about the top part?
How do I get the Logo/Thumbnail there along side the big text and small text?
- I'm assuming it's a custom tableview cell?
Also, what about adding the buttons into a table cell? all evenly spaced apart? Would this also be through a custom table view cell? (designed in IB)
One last thing, is how would I put these two cells in with the rest?

My guess is that the green image and the three buttons on top (call, email, visit website) are all subviews of the table's header view. You can easily do that, if you go to Interface Builder and drag a UIView to the top part of your UITableView.
Then, you will need custom cells for the next part of the interface. One easy way is to make them all in IB and then create outlets and hook them to your table. Read the Table View Programming Guide for iOS regarding more alternatives for custom cells. If you need more customization, start from this excellent article. Finally, regarding the bluish rounded background of number "20", have a look at this SO question. Good luck!

Related

how to create a sectioned TableView for profile in iPhone

I saw this picture on Internet:
the section with the add Photo Frame and two rows (First, Last)...
How do you achieve a design like that!!!
I only know how to make rows (static and dynamic) in xCode using the full width of the screen but not in a single section but not making such a divisiĆ³n and adding a frame out of the other two rows
my designs are like this
Any help I'll appreciate
thanks in advance
It's not really clear that the example you've given is actually embedding the first, last part into a table view. It could just as easily be a single cell that has embedded views with borders to look like rows. Here are a few ways I see to accomplish the view you've given.
Have them be actual rows - but use a custom cell layout that offsets the 'First' and 'Last' labels to be further to the right. Then create a UIImageView for the profile that sits on top of the UITableView cells, but inside of it. Basically insert it as the first subview of the UITableView. It should cover the top left of those top two cells. You can do this since those cells have a static known hight and you've set the left offset. Another option would be just inserting it into your top cell, but having it overflow the bounds and setting clipsToBounds = NO.
Make the entire top view a custom UIView that uses CALayers or CoreGraphics to manually draw the lines and layout such that it looks like part of the table view. Set that as the TableView header, or the first section Header.
There are a lot more things you can do like changing frame layout as well.
you can achieve this with the use of xib read carefully and if you don't understand anything you can ask me again it's bit tricky
in you xib create a UIView and design for your photo and firstname, lastname cells with the use of textfields image views and all and then take a UITableView.
now drag your UIView and drop it on your UITableView so that it will be considered as your table header and your first section now will be as you designed like photo with firstname and lastname fields.
i've done this in manier projects of mine so hope this way you can also do this thing and ask me if you need any help.

How to lock a view as the user scrolls

I am new-ish to iphone development and I am trying to figure out how I can fix a view after it has reached a the top of the screen when a user scrolls a window. Then the view would unlock when the window is scrolled down again to go back to its original position. Ive seen this on on a few apps like instagram (with the user name separators).
Does this design pattern have a specific name?
An example (not iPhone though) can be seen on http://mashable.com/ -- Look at "The New Stuff", "The Next Big Thing", and "What's Hot" bar. See how it locks as you scroll down
My solution for you is
create a UITableView
create a UIView separately which will be used as fixed table header
setup the table's tableHeaderView property to conform the UIView's frame
as UITableView is inherited from UIScrollView you can rely on scrollViewDidScroll method in which I properly adjust my fixed header as Y coordinate changes when scrolling the table.
There can be other similar solution for this too but a strenght of this particular solution is that you can manipulate the fixed header's gui element throughout the scrolling easily.
An example is always better than writing down the details so I created for you (and hopefully for others here at SO) a sample project (of course quick'n dirty), which you can find here at github:
https://github.com/codedad/SO_Fixed_TableHeader_iOS
If I'm correct, you're trying to achieve something like the UITableView in the Contacts app?
It uses the sections of the UITableView for the sorted letters and displays them always on top.
Have a look a this question and create custom section headers.

Left area of section in iPhone TableView

I have a section where I would like to customize the left area of a section a TableView - a bit like viewForHeaderInSection.
I have thought at using a cell for the section instead, but it would be a lot of nitty-gritty.
If I understand your question correctly, you want to customise the left-hand-side of some, or every cell in a UITableView? Then you need to make create your own custom table view cells. I normally make these cells in Interface Builder; this post helped me out. See also the Customizing Cells section of Apple's Table View Programming Guide for iOS.
I read your question to mean that there is one custom element to the left of a bunch of cells. The only way I know of offhand is to use a cell as you describe and then have a left view and a tableview inside of it.

UITableView like Contact App

I try to create an UITableView similar to the Standard Contact App, when selecting a contact (i.e. grouped style). But how do I get some controls at the top or at the bottom of the cells, which scroll with the rest? In the Contact App you have at the top the picture together with the name and at the bottom three buttons. Are these just special customized Cells? Or can you have controls directly there?
Thanks for your help!
Regards
Matthias
I played with table header/footer views. You can create them in IB and assign them to
self.table.tableHeaderView = yourHeaderView;
self.table.tableFooterView = yourFooterView;
Needless to say, that you customize them as your wish.
Another option is to customize a table cell view for the section 0 if you have a grouped style table. You can add there a picture and a button, whatever you want.
In both cases all your elements will scroll with the table view.
Is that what you asked for?
When I did this functionality, I used a combination of UIViews and UITableViewCell.
As a header I inserted UIView, and it placed the UIButton (with picture) and UITableViewCell. After laying a transparent UIView and subscribe to UIControlEventTouchUpInside, which highlight the cell ([self.tableHeaderCell setHighlighted:YES];)

Create a view like Tweetie's User Profile view

I'm just wondering if anyone has any idea on how you can create a view that looks like the user profile view in apps like Tweetie, where there are seemingly multiple tables with a couple of normal (straight up and down tables) and then two rows of six cells, which in Tweeties case have the number of followers, following etc.
I'm trying to make a similar view for my app, but can't seem to find out the best way to create it. Any tutorials, advice etc. would be appreciated.
Thanks.
P.S. Here's a picture of the view which I'm trying to recreate.
alt text http://technopedia.info/wp-content/uploads/2009/09/tweetie22.jpg
To get the same effect as Tweetie's split cell, create a custom cell and add a Segmented Control and create title and detail labels
It is a grouped tableview using custom cells. The image you show has two visible sections, and the top of a third. It also has a custom table header view. The second section has two cells built from four UILabels and a dividing line graphic in the middle. You can create this in a nib, or by hand.
You can even change the grey pin-stripe background if you want.