I have an app where the navigationBar is implemented according to Apple HIG, so 44px high. Thereunder is a searchBar which is directly under the navigationBar.
The guy designing my app now has created an custom image for the navigationBar which is 64 px high. I already cut the image so that the actual height of the navbar image is 44 px. And added the rest of the image to the tableView background image. Everything is implemented and works correctly except that now my searchBar is scrolling through my navigationBar IMAGE. So technically it is not in the navBar but from a UI design standpoint it is.
I cannot seem to find out how to make sure the space directly under the navigationBar (20px) is not used. It should look as if the navigationBar is 20px bigger to the user.
Hopefully someone can guide me in the right direction, thanks!
I think you have your search bar nested in a UITableView right? You can change your view controller to a subclass of UIViewController instead of a UITableViewController, and then you will be able to add the table view to the controller's view manually and adjust its size whatever way you want.
(Don't forget to let your controller implement data source and delegate protocols and hook it up with your table view.)
Related
I am in the process of transitioning an app to iOS7. All of the views throughout the app have a 44px empty space at the bottom that appears to be for a bottom toolbar or something, but I am not trying to display a bottom toolbar. This space also exists on views that do have a bottom toolbar and the toolbar just shows directly above it.
The red space shown is actually a view behind the black view. No matter what size I set the frame of the black view to, the red space is always shown. I am also hiding the status bar in plist, so don't know if this is an artifact from that or if it has something to do with navigation bar as they are both normally 44px in height.
I have looked at the transitioning guide and haven't found anything that's worked. Any ideas to what could be causing this and how to fix?
UPDATE:
I have tried setting edgesForExtendedLayout = UIRectEdgeAll and extendedLayoutIncludesOpaqueBars = YES (also tried NO) with no effect. When I look at the subviews of the navigation controller it shows a UIToolBar as hidden, but shows it contains a frame in the exact area the view refuses to resize to even with autolayout constraints.
UPDATE 2:
This is actually a problem with ViewDeckController (https://github.com/Inferis/ViewDeck) and the way it sets it's center view bounds.
I believe it has to do with the UINavigationBar. Try toggling the following options in Storyboard and see if it solves the problem. Namely, the 'Extend Edges' options:
These options can also be set in code with the edgesForExtendedLayout and extendedLayoutIncludesOpaqueBars properties on UIViewController.
If you are transitioning to iOS 7, you should be using an Auto Layout constraint to anchor to the Bottom Layout guide. Control drag from your view to the Bottom Layout guide and choose Vertical Space from the popup menu.
Using frames in iOS 7 is harder and is the way of the past.
Auto Layout is hard to grasp at first, but it is very powerful once you get the feel.
This is actually a problem with third party library ViewDeckController (https://github.com/Inferis/ViewDeck) and the way it sets centerViewBounds for IIViewDeckControllerIntegrated. I was able to figure it out after changing to IIViewDeckControllerContained and seeing the view sized correctly.
In IIViewDeckController.m, just return self.referenceBounds for iOS7 like it does for IIViewDeckControllerContained.
I have bunch of images inside a UIScrollView and have a tap event setup on each image. When I try to make the image full screen it actually is cut off by the scroll view. I am trying to implement a Facebook style UIImageView where the image zoom in and takes over the full screen on tap.
Does anyone have suggestion on how to approach this cause the way I am doing the image is cropped to the size of the scroll view.
Well, usually you would disable clipping, but the scrollview relies on clipping to do its job so that won't work.
My suggestion would be to push a copy of the image above the scrollview, and animate that to full screen. You should be able to get the rect using convertRect:toView: and it would be pretty straightforward from there.
btw, Is there a reason not to use a tableView for this?
When tapped hide the image and add the image at the proper place in the scrollview superview and over the scrollview. Then animate it to take the full screen.
Facebook App style UIImageView is nicely implemented in below given source code, you can take a clue from this
https://github.com/michaelhenry/MHFacebookImageViewer
I am trying to create the same type of slide-up/pull-up menu (from the bottom) as the Any.do iPhone app, but not having any success.
The issue I am running into is the app was built with storyboards so I am thinking I might have to scratch that idea and use just code.
Any ideas?
There is no need to get rid of your storyboard to recreate this, that's what IBOutlets are for. Any way, it looks like this was made by creating a UIScrollView that takes up the entire screen. Then add a UITableView to the upper section of the scroll view. Mind you in order for this to work, you'll need to disable scrolling on the scroll view in the background.
From there you can programmatically add the other elements to the scroll view to be rendered off screen, since there are only three they can probably just be buttons. And finally, since scrolling is disabled on the background scroll view you can add an image with a UISwipeGestureRecognizer at the bottom of the screen to manually change the scroll view's content offset property.
At the moment I'm working on an iPad explore game which has a hexagon tile map.
I've created a UIScrollView that contains a background view (the game map) and buttons in the form of hexagons (for interaction). I add every UIButton to the view via addSubview.
But... when I add more than 100 buttons the view gets laggy (no surprise here). But what should I do to solve this?
Example:
scroll view http://img233.imageshack.us/img233/5527/screenshot2011090110353.png
Adding UIButtons isn't the way to go here. You should probably draw the "buttons" in a custom -drawRect: method and use -touchesEnded:withEvent: to decide what the user wanted to do.
I have a UITabBarController displaying a number of settings-screens in my app. I want them to be shown on just a part of the screen for layout reasons. In fullscreen, the lists become unreadable (too wide), there are just a few controls per page making the page feel very empty, and the tabbar buttons are far away from the content (Fitts law).
Using presentModalViewController with the UIModalPresentationFormSheet style gives me the size I want. I do this on top of an empty background, since in my case it doesn't make sense to display anything behind it. The "real" working area is displayed with another presentModalViewController in fullscreen mode on top of it all.
This works but feels like a hack. One problem is, I can't make the background behind the settings dialog move in the transition to fullscreen with the UIModalTransitionStyleFlipHorizontal style.
TL;DR
Can I embed a UITabBarController non-fullscreen in another "background"-view? I can't find any information of how I would do this.
Can I embed a UITabBarController non-fullscreen in another "background"-view? I can't find any information of how I would do this.
Why don't you try it out?
Create a container view of the size you want the tab bar controller to have.
Create the tab bar controller.
[containerView addSubview:tabBarController.view];