iOS iPhone mapview with slide-up scrollview - How to set up? - ios

I am struggling with how to set up the following view arrangement. Not sure what viewcontrollers I should use. Should I use a container view (I'm only supporting iOS6+)?
I have a screen that contains a mapview (and view controller) that is working great. I want to add a view to this screen that slides up from the bottom to partially cover the mapview. This subview will be a scrollview and will have a small handle that is visible even when closed that a user can drag up to open or down to close. When this drawer view is open, the user can "page" left and right through a list of objects and the map will update accordingly.
I don't need any help with the map view or scroll view individually, only how the generate this screen with the multiple views.
Everything I have done thus far is via Interface Builder.
Thanks!

You could create a empty xib (UIViewController) and add this Xib file as subview of the main view. Next add a gesture recognizer to the main view (https://developer.apple.com/library/ios/documentation/EventHandling/Conceptual/EventHandlingiPhoneOS/GestureRecognizer_basics/GestureRecognizer_basics.html), on the right gesture slide the subview up (http://www.raywenderlich.com/2454/uiview-tutorial-for-ios-how-to-use-uiview-animation).

Related

Uber's Home Screen Transition Scroll - iOS (swift)

I am working on an app that has the same layout as Uber's Home screen on iOS. There is a section at the bottom of the app that should be scrollable all the way to the top and allow the user to interact with a collection view in the same way that Uber does it. I have attached some screen shots of my app layout below.
Does anyone have an idea on how to do it the scrolling aspect that moved the view and collection view to the top off the of the app while allow interaction with the map behind the content.
I thought of overlaying a scroll view over the map and offsetting it, but the problem with this is the user will not be able to interact with the content beneath it in the same way that a user can interact with the map in the uber app.
Thanks in advance.
You can add the mapview on the view controller's view and then add the container view on top of it, which contains the collection view.
And the gesture on container view, or you can create a handle(a small view) on top of the container view and add gesture to it.
Then to scroll up and down you can use the constraints to change the position.

Adding a fixed-position view on top of a view

I have a UITableViewController inside a UINavigationController. I'm adding a "modal" subview to the tableView, which is a custom UIView when one of the rows is selected.
(It’s modal in spirit, not in the UIKit sense, since Apple doesn’t support modal views on iPhone, I’m adding it with a [self.view addSubview:customView] in my table view’s controller.)
I would like it to appear at the bottom of the screen and stay put there. I can get it to draw at the bottom, but once I scroll the table view, the view moves with it. Here are some illustrations:
Initial position (good):
Position after scrolling (bad):
I'm getting the bottom position by subtracting the height of all the chrome (navigation bar and status bar) as well as the height of the custom view from [UIScreen mainScreen].bounds.
How can I get the custom view to stay put? Should I constantly be adjusting its frame when the table view is being scrolled?
Your best and most flexible option is to switch to using a view controller with the table view as a subview so that you can change its frame and add sibling views. Then, when you want to add a modal you can run an animation to move the table view out of the way and slide the modal view in.
UITableViewController.view is an instance of UITableView. Means you added your custom view into a scroll view and that is why it scrolls. You can try to put your custom view into the tableFooterView property of the UITableView, which is the old school solution.
Personally I would create a container UIViewController and have UITableViewController be a sub viewController of it. Another sub viewController UIViewController or just a simple UIView could represent the footer.

UIButtons not working in Scroll View

I have a Scroll View with a View (content view) inside of it. I've added two buttons to test. The Scroll View scrolls fine but the buttons within the content view are not clickable. I've seen plenty of posts saying this issue happens when they programmatically add UIButtons to the View, but I am not doing this. Here is my exact process:
Drag the Scroll View onto the main view. Add 4 constraints
Drag the Content View onto the Scroll View. Add 4 constraints.
Add 2 Buttons (one high and one low to test scrolling) to the Content View.
This is all I am doing, no code at this point. Is there anything else I have to do to allow the buttons to be clicked? Here is a screenshot of my xib:
Update:
When hooking the button up to a simple IBAction and logging a message, it turns out it IS being pushed and working properly. However, when the button is pushed, the button isn't changing colors like it should (its "pressed" state is not appearing). Any ideas why?
First make the button to custom type
Select button from storyboard then on right attributed inspector change its "state config" to whatever you need like Highlighted, selected, Disabled and default and choose the colour for each state.
Now you can see the colour change on that button.
A UIScrollView first needs to know whether or not you are going to scroll before letting the touch pass to its child views. If you want the child views to get the touch immediately, set the UIScrollView's delaysContentTouches to NO.

UIPageViewController with Constant Elements (that don't move on swipe)

I'm creating a full screen image viewer for my app (i.e. click on a thumbnail and a full-screen viewer opens up that allows for zooming (UIScrollView) and swiping to the next image). I'm currently presenting the UIPageViewController as a modal view. I can't seem to figure out how I can place a "Close" button on the screen so I can dismiss this modal view. I tried to include the "Close" button on the UIPageViewController's content pages but these items move with each swipe (as they are supposed to). So, how can i create a button that sits above the UIPageViewController and allows me to close this view?
Seems like a simple issue but can't seem to find a good solution.
Instead of adding the UIButton to the UIPageViewController which as you stated would move along with page swipes, do this:
Create a UIView
add the UIPVC to the newly created view as a subview
also add the UIButton to that newly created view as a subview too.
Now you have two subviews in this newly created UIView and they would be separate views that you can interact with without it affecting the other
What you were doing before was adding the UIButton to the UIPVC which is not what you want as explained in the opening paragraph

Embedding a UIContainerView as a portion of screen in a UIViewController

I have a screen in my storyboard where I would like to embed a container view into a portion of the screen. I can't figure out if I should add a new containerview or view from the object library and then drag in a collection view controller or collection view (or tackle it a different way?). I've tried all combinations but just end up with the embedded view being shown black even if I drag collection view cells and set a background colour to test it. Once I can get this working I plan to populate the cells from an external database.
Any suggestions please? I'm doing this using storyboard as far as possible.
Thank you.
After you drag a container view into your view, you automatically get an embedded view controller, whose size is matched to the container view's size. You should delete that controller, and drag in a UICollectionViewController. Control drag from the container view to this controller and choose embed when you let go -- this will resize the collection view controller. You can give the collection view a background color, so you will see where it is, but giving the cells a background color won't show up until you implement the methods in the controller to populate those cells.

Resources