Implement a UIScrollView with different sections (i.e. Yahoo! Weather app) - ios

I'm trying to figure out an optimal way to implement a UIScrollView similar to that of the Yahoo! Weather app.
As per image (http://i.stack.imgur.com/hj1xG.png) there's one section for 'Precipitation', one for 'Details', etc.
Each of these sections is also movable up and down. It would also be ideal to be able to have a dynamic height (according to the length of the content that goes into one section) without the following section to overlap/be too far down, and to have the possibility to exclude and now show one or more section if certain conditions are not met.
Being a total amateur in Xcode and Objective-C programming, my approach would be just going with a single UIView and put elements in it, hiding/showing them when needed, simulating the division of the different sections with a UIImage with a background, and defining each element's position programmatically. I'm sure there's a better way to this painfully long and limited approach.
Thank you for your help!

I think you should give UITableView a try.
UITableView inherits from UIScrollView : UIView : UIResponder : NSObject
If you set the tableView.pagingEnabled = YES; you would get the desired effect.
Ray Wenderlich has an example here. Although the tutorial is on something else it starts by creating a paging enabled table view.
Hope this helps

Better to use Custom UITableView with custom cell as uitableview has a method like -
-(BOOL)tableView:(UITableView *)tableView canMoveRowAtIndexPath:(NSIndexPath *)indexPath
{
return YES;
}
- (void)tableView:(UITableView *)tableView moveRowAtIndexPath:(NSIndexPath *)fromIndexPath toIndexPath:(NSIndexPath *)toIndexPath
{
//Even if the method is empty you should be seeing both rearrangement icon and animation.
}
So you could easily have that sorting effects of Yahoo Weather app along with scroll up/down effect.

Related

iOS Jump to next cell in UITableView when cell scrolled

I would like to implement a UITableView with cells that are full screen. When the user moves the cell up a portion, I would like to jump to the next cell as opposed to allowing it to scroll naturally.
I can't see a great deal of questions or answers out there on this, and perhaps it's because it's a daft idea, but the client wants to see it and the designer has designed it as such so I really must try.
Does anyone have ANY suggestions on how to implement this?
Thanks. (and thanks for pointing out my ignorance in not saying thanks!)
If your cells are going to be the same size as your tableView's height, set the pagingEnabled property to YES. This will make it snap to a full cell on each vertical swipe. I would ensure that the height is exactly full-screen if you do this, otherwise you'll end up with some weird offsets as you scroll.
- (void)viewDidLoad
{
[super viewDidLoad];
// or somewhere similar
self.tableView.pagingEnabled = YES;
}
...
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
return self.tableView.frame.size.height;
}
It actually isn't a terrible idea- you could achieve similar functionality with a paging scroll-view, but this has the advantage of not needing to have all of your data loaded at once.
Edit: I also had to make sure to disable automaticallyAdjustsScrollViewInsets on the controller, otherwise I had an undesired initial offset for the first cell, just in case you run in to that as well.

How to create a view for settings of my iPhone apps in Xcode storyboard

I am new in iOS programming and I would like to create I view for the settings of my app that looks like iPhone's one (like in the picture). Some of rows will call other views when taped and other will not.
What is the best way to do that? I thought about TableView with prototype cells, but is there a best way to do it? or a best-practice for what I want to do? Or maybe a tutorial online?
The fast way in Interface Builder:
Use a UITableViewController, make it STATIC and use the GROUPED style (all in IB).
You can setup the cells to show disclosure indicators (or not) in IB also.
You can segue directly from the rows or the UITableViewController to where you want to go.
If you segue from the UITableViewController, implement the "didSelectRowForIndexPath" method and call "performSegueWithIdentifier" accordingly.
A structure like this is best by UITableView.
First you select how many sections you want, and customize each section with a data structure that you have to be filled with (Probably an array.)
Then you fill up each rows inside
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
method, and call your value from the array/dictionary that you have.
for going to a next view when clicked upon
Use the method
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
Hope this helps
The best way to do that is using static UITableViewCell.
See UITableView Programming.
The optimal solution here is undoubtedly UITableView. This is because firstly, you have the need to display a list of options that would have external links to other pages and UITableView is designed and used for this purpose.
In an addition to that, if you want, you can also expand and collapse the rows of your parent TableView into a Child TableView i.e a UITableView as a subview of its parent UITableView.
Put up a UITableView and populate it with UITableViewCell. That will be just fine with the requirement you have.
Hope this helps.

How to make a UITableView row grow dynamically with the user modified content

I am asking this question already knowing the answer is "no you can't" but in the hopes someone has a brilliant idea here we go.
I have a subclass of UITableViewCell that has a few different subviews one of witch is a UITextField that I have as user editable. So naturally the textField grows with the text that is entered.
Now the question is how could I get the tableview row to grow with the textField.
I have a variety of different size cells so I know how to use - (CGFloat) tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath but the problem is that I need to modify the after the cell is already in the tableview.
Also note that the previously noted delegate method gets called before the data source delegate method - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
I have thought of just pulling up another view for the user to edit then putting that data into my data model then I would have to force the tableview to reload. (Can I reload just a certain cell/row)
Interestingly enough I think apple is doing what I want in their iTunes U app. When you tap a assignment it expands. I think they are using tableviews their right?
I know I have a lot of questions and talk here but I believe it is all related and just to show what I have researched. I am just looking for the possibility that one of you has a stroke of genius.
Hopefully this can help others also because this seems to be a hot topic but no one ask the question well or gets good answers.
Actually, this has been asked and answered many times -- it's not impossible. Search for "UITableView custom row height" or "UITableView multi line UITextField" or similar and you'll find several well-answered questions.
You're on the right track -- you need to return a height in tableView:heightForRowAtIndexPath:, even though that method is called before you create/configure the cell. This is okay... you just need a way to compute that height without having the cell. Other answers reference -[NSString sizeWithFont:constrainedToSize:] and related methods... this should get you on the right track.
Changing the height while the text field is editing is less obvious, but this answer has the key... if you call
[tableView beginUpdates];
[tableView endUpdates];
the table view will not only ask its delegate for heightForRowAtIndexPath: again and resize the cell to match, it'll do it with a smooth animation.

Displaying two UITableView

I need to show two UITableView but I'm not sure the right way to do it. I tried to use two UIViewController each with UITableview and load those views to the parent controller's views but I had doubt on this implementation. I can't use UISplitViewController because I need more real estate on the left also I have navigation controller as the root controller. Then I saw Amex for iPad app (check the first screenshot) that seems to be the best way to show the tables. Is it a UIPageViewController? Any suggestions on the implementation? Many thanks.
It looks like an UIPageViewController with 2 UIViewController each with his own UITableView, but I would have to download and install to be sure of what I am saying. Nothing spectacular about it (at least in the implementation part if I am correct in my assumptions), the look, on the other hand, is very nice.
You can put 2+ UITableViews in one viewController. Then in all your delegate and datasource implementations check which tableView is being asked for. For example:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
if ([tableView isEqual:self.tableView1]) {
// return cell for table 1
}
else if ([tableView isEqual:self.tableView2]) {
// return cell for table 2
}
}

UIButton grouped Buttons

I'm trying to create a button set up exactly like this:
How would I do this? Can someone show me the code? Is there a way to "Group" UIButtons like this?
You'll want to use a UITableViewController with the sections set to be UITableViewStyleGrouped.
Each of the groups is a section, so you'll want to return how many sections you have with - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView.
For every section, you want to specify how many rows there are with - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section.
You'll want to customize each cell with - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath (which, by the way, tells you which section's particular row you're modifying in the indexPath variable).
Finally, you'll want to handle the row click in - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath, using the pattern XCode provides for you:
[self.navigationController pushViewController:detailViewController animated:YES];
[detailViewController release];
Hope this helps!
That's a one-group UITableView with two rows (cells). The table style is UITableViewStyleGrouped. I'd recommend responding to selection of the cell using the delegate's –tableView:didSelectRowAtIndexPath: method as opposed to using UIButtons within the cell -- much nicer visual effect.
You can't group uibuttons like that. You can achieve this look-and-feel several ways, the most elegant is to use the grouped style uitableview.
However if you would want your buttons only to look like this, but not exactly like this, then you could also specify images for you buttons. Uglier way to do it, however much simpler ...

Resources