iOS 7 Weather app expand/collapse transition - ios

I'm trying to achieve a view transition like the new iOS7 weather app transition, using a collapsing/expanding view.
Does anyone know if a lib already exist for that ?
Thanks

User antol put some effort into replicating the behavior:
https://github.com/Antol/APPaginalTableView
But note that APPaginalTableView doesn't have a separate controller for the expanded pages.
You can see it in action here:
https://www.youtube.com/watch?v=X1YvxDMr0yA

EDIT
Check out this project. It demonstrates how to do the first part of the Weather app's transition using normal View Controllers and the transitioning API.
I know this is a little late for a follow up, but I've looked for a library to do this, as well, but haven't found one.
https://github.com/chefnobody/Colors
I was able to do this using the new UIViewController Transitioning API. This example should get you started:
http://www.teehanlax.com/blog/custom-uiviewcontroller-transitions/
To augment this example to get the pinch/pull table view cell separation animation you would need to identify the table view cell that was selected (or "selected" relative to the pinch gesture"), then in -animateTransition: you would animate the cells above and below the selected cell out of view, revealing your details view controller.

An alternative to APPaginalTableView if you are looking to use the storyboard more and set subview controllers to the table. I was working on the same problem and this is my "playground" for it. https://github.com/nissaba/customcellTest.git

Related

UICollectionView vs UIPageViewController

I need to have different full screen views in my app. Very similar to how snapchat works. The views should be able to communicate between each other.
My question is: Should I use a UICollectionView with cells same size as the screen or should I use UIPageViewController?
Please provide some background info to support your opinion!
I think both have pretty different purposes.
UICollectionView is great to build a mosaic of views (think an image gallery for instance), whereas UIPageViewController is kind of similar to the flipping pages of a book. The latter seems to be what you need, but UIPVC doesn't seem to offer many tweaking/customizations, like custom transitions for example. In which case you may want to start from a UIScrollView with paging enabled to recreate something similar but with more potential. Here's an example.
Personal opinion: for this specific case I'd use a page view controller. Collection views have any things you have to consider, like when the device rotates you have to recalculate where you are, which cell you have to display, ask to scroll to the current cell, and if you are displaying a video or using the camera you might have to control it perfectly, otherwise issues will come.
However think about new features that might be added to your app, if you think you might show more than 2 items on screen, then you'd better choose a collection view.
A page view controller lets the user navigate between pages of
content, where each page is managed by its own view controller object.
https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIPageViewControllerClassReferenceClassRef/
So If you plan to swipe from one ViewController to another, go for PageViewController. If you plan to have only one ViewController that deal with a list of fullscreen image or so, go for a view controller with a collectionView, or maybe your own swipeView.
UIPageViewController use different view controller and load multiple controller so obvisioly take more memory as compared to UICollectionView. So if your required task is less calculation or step to do then its recommended to use UICollectionView, other case preferred way is to user UIPageController.

iOS UI - App Store Explore section Transition

I was wondering if this nice master-detail transition where you click on the tableView cell and it expand to disclose the detail , with the cell's label being the navigation bar title is an interface which is part of the SDK object library or it is a customised one?
This is a custom transition between ViewControllers.
There's a nice example of a few transitions (including this one) in this library.
Of course you'll need to add the tableview etc' but this is a great place to start.
I've tried few things but so far this is the best option I could think of.
Animating the frames of all the visible cells and making use of childViewController is how I achieved it.
Animation test project
https://github.com/armaluca/iOS-App-Store-Explore-Section-Animation
Would be nice to know any other possible solution and ultimately to know how Apple did it!
It is custom implementation.There is no API in UIKit/UITableView which implements this behaviour. Only animation to present a cell is there(which I think is used here).
This behaviour can be implemented like-
Add sections(News, Productivity, etc) in table with zero cells(numberOfRowsInSection: = 0 for all sections). Then on tapping any section just reload that section(reloadSections:withRowAnimation:) by adding a cell to it(numberOfRowsInSection: = 1) and animation(maybe UITableViewRowAnimationMiddle). Scroll that section/row to top in same animation loop(UI update cycle).

Pager Sliding TabStrip in ios

I would like to use Pager Sliding TabStrip in my project.Pager Sliding Tapstrip is there for android. Can we define like this? I have taken one scroll view, added subviews on it for tables and take one uivew, added buttons as subviews and added uilabel as subview for tabstrip . While using the scrollview means dragging the scrollview, the tabsrip has to be moved.I have been stuck to this concept and i am not getting any idea to solve this issue. How do i get this concept? Please give any idea to me anyone.
Can't you use UIPageControl for this ?
From Apple example:
https://developer.apple.com/library/ios/samplecode/PageControl/Introduction/Intro.html#//apple_ref/doc/uid/DTS40007795
And to have a custom UIPageControl, like this https://github.com/Spaceman-Labs/SMPageControl .
You can try UIPageViewController to manage your tabs.
I'm not sure how many tabs do you have. If you have many tabs and you add all tables into the scrollView at the beginning time, the performance and memory usage would be really bad.
So you'd better reuse controller and views for your tabs. If you use UIScrollView and manage them by yourself, what you can do is calculate current page according to the contentOffset, and load the current page, previous page and next page. Because three pages is enough to cover what user will see. However the better solution is using UIPageViewController, it will deal with contentOffset and pagination, what your need to do is just provide previous controller and next controller according to current controller. Then update your tab view according to current controller.
EDIT:
BTW, if by "the tabstrip has to be moved" you mean when you drag the scrollView, your tabstrip moves as well, that's because you added your tabstrip to the scrollView. What you need to do is add it to the root view, and the scrollView and the tabstrip should be siblings rather than parent and child.
I am developing application which required same features as asked by you.
I am using SHViewPageController. You can find it from following link.
https://www.cocoacontrols.com/controls/shviewpagerexample
I hope it will help you. Thanks.
This may help you....
you can change the tab at top or bottom. also it has got some nice customizations
https://github.com/iltercengiz/ICViewPager

What do you call this stacked folders looking view in iOS?

(source: mshcdn.com)
What is this view called?
Its like stacked folders (Cupertino, New York, Austin, Your Location) that when you touch one.
It enlarges and shows more details, is it complicated to create?
And can someone please show me a link, on how to create one?
Thanks.
It looks a lot like an Accordion.
There are a number of Accordion projects on Cocoa Controls and Cocoapods.
This is just using a UITableView and customising what happens when you tap cells.
You don't need UIKit Dynamics for something like this. Nor would I put multiple UIViews on top of each other as if there are more than a handful you'll run into memory issues.
The transition to the next screen is a custom transition. You can read more about these in WWDC 2013 video. I think it's session 218.
Or possibly in the tech talk videos available from the http://developer.apple.com website.
The iOS weather app uses a similar concept. I'm about 30% through trying to reverse engineer it. I believe it uses a UICollectionView with a layout-to-layout transition.
This is not a standard view controller layout. I think you could call this "Stacked View Controllers", as it is not per se a navigation controller (no push/pop), nor a tab bar controller, nor anything known.

table view is covered with an empty table view when integrate TTCatalog to a Tabbar template project

I created a project with Tabbar template. The First View of my Tabbar project just wants the same function of the TTCatalog sample project. The Second View will integrate a Map function.
I integrate some code from TTCatalog sample project to do so. But when my App starts, only an empty tableview displayed in my first view. It's just a white table with some empty rows. nothing else.
When I quit my App from emulator, and start it again from emulator,first I can see a table view like that of TTCatalog ( with blue titles and labels), But soon the table view is covered with an empty table view.
Please help
thanks
There is no need to inherit CatalogController, if the only thing you need is a tableView inside a tabBarController then there is even no need to use three20 at all. To get started I would recommend you use a simpler approach. While three20 and the TTTableViewController can help a lot with a certain kind of setups, it is not the general best way to do things.
Let your FirstViewController inherit from UITableViewController, implement the UITableViewDataSource methods. If you are experiencing problem or need with a specific problem feel free to ask here.
If you got this working and you really need something that three20 can help you achieve, read through the TTTableViewController sources, TTModel, TTTableViewDataSource, find a tutorial and go on.
Maybe this question may help you: Three20's URL-based navigation + tab bar example? especially this link: http://three20.pypt.lt/url-based-navigation-and-state-persistence

Resources