I am trying to achieve the following navigation bar with two titles and an image:
Large title variant:
Small title variant:
I tried subclassing UINavigationBar and adding subviews to it, but they did not render at all.
I tried setting a titleView in storyboard, however it seemed like the titleView is constrained in its height.
What is the proper way to achieve this custom navigation bar?
I also tried this (and setting the viewController in Storyboard to that class):
class NavViewController: UINavigationController {
var titleView = UIView()
override func viewDidLoad() {
super.viewDidLoad()
self.navigationBar.topItem?.titleView?.backgroundColor = .gray
titleView.frame = CGRect(x: 0, y: 0, width: 100, height: 300)
self.navigationBar.topItem?.titleView = titleView
}
}
Inside the ViewControllerin viewDidLoad, add self.navigationController?.navigationBar.addSubview(imageView). (no need for subclassing)
There is even support for AutoLayout inside UINavigationbar, which is great for animation.
Design your custom view seprately in a xib file, then set that xib as the titleview for your navigationbar
self.navBar.topItem?.titleView = logoImage
Do this for large title, for the smaller one only populate an image in the titleView.
Related
I am currently working on a projekt in swift where I use a navigation controller to segue between different views. My projekts title is displayed in the navigation bar after the segue with "prefer large titles" on and it displays automatic. It all works as it should, but for some reason the title is not displayed the same way after the segue at the different views. When I segue to a viewcontroller with a scrollview the title is displayed like this to begin with
And when I segue to a tableviewcontroller the title is displayed like this
Do you know why it is displayed differently? I do not care how the title is displayed to begin with, just that it is in the same way every time. You can see the problem in this link
https://github.com/Rawchris/small-title
Here is the solution to your problem.. Thanks for sharing the repo.
This declaration is from your ViewController. In addition to this, as you are adding the components programmatically so i would suggest to mark translatesAutoresizingMaskIntoConstraints to be false
lazy var scrollView: UIScrollView = {
let view = UIScrollView(frame: .zero)
view.backgroundColor = .white
view.frame = CGRect(x: self.view.bounds.minX, y: CGFloat(0.0), width: self.view.bounds.width, height: self.view.bounds.height)
view.contentSize = contentViewSize
return view
}()
I'm trying to add a UIView beneath the UINavigationBar in my UINavigationController.
The view will serve as a placeholder for information messages (for example if we are having issues and content is not getting updated).
Adding the view it self and setting it's constraints is not an issue, but it is overlapping the content of the views that is contained in the navigation controller, which is not want I want. How can I set the content of the contained viewcontroller to respect the space which this new view takes up?
The screenshot is showing my custom (orange) view overlapping the content of the viewController that was pushed on to the navigation controller.
Try Subclassing the UINavigationController and then add your orange view's height constraint to it. and call the function whenever you need it
import UIKit
class CustomNavigationController: UINavigationController{
#IBOutlet weak var topViewHeight: NSLayoutConstraint!
func animateHeight(height: CGFloat){
UIView.animate(withDuration: 0.2) {
self.viewControllers.forEach{ vc in
let v = vc.view.frame
vc.view?.frame = CGRect(x: 0, y: height, width: v.width, height: v.height)
}
self.topViewHeight.constant = height
}
}
}
how to use it?
in your VC where you want to show/hide it:
(self.navigationController as? CustomNavigationController)?.animateHeight(height: 50)
I have created a separate customView class containing collection view along with its Xib, and then i try to load this customView to one of the controller's view which is connected to a Tab Bar Controller. The view gets loaded perfectly but the last item of collection view is hidden behind the tab bar.
It would be great to have a solution for that.
My customView looks as
Try this
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
let bottomOffset: CGFloat = (tabBarController?.tabBar.frame.height)! // this your tabbar height you can replace with static number eg. 44
collectionView?.contentInset = UIEdgeInsetsMake(0, 0, bottomOffset, 0)
}
Try to uncheck Under Bottom Bars..
It worked for me.
set
self.edgesForExtendedLayout = UIRectEdgeNone;
self.extendedLayoutIncludesOpaqueBars = YES;
self.automaticallyAdjustsScrollViewInsets = NO;
I want to set the background image for a TableView I got by adding a navigation controller to my scene.
I tried using a UIImageView but can't find where to put it in the hierarchy.
Is it possible to add the UIImageView via Storyboard in this case?
thanks in advance
if I put an UIImage in hierarchy, I got this
create a custom class for your navigation controller
add this code into the viewDidLoad of that controller
var imageView = UIImageView(frame: self.view.frame)
var image = UIImage(named: "BGimage")!
imageView.image = image
self.view.addSubview(imageView)
self.view.sendSubviewToBack(imageView)
change the class in your storyboard for that view controller to the custom controller
for your table view and it's cells make sure the backgroundColor is set to clearColor:
myTableView.backgroundColor = UIColor.clearColor()
in code or via Interfacebuilder.
all set and done
In my UITableViewController, my toolbar follows my tableview when I scroll it. My code looks like this:
override func viewDidLoad() {
let toolbar: UIToolbar = UIToolbar()
let checkButton = [UIBarButtonItem(title: "Done", style: .Done, target: self, action: "checkedPress")]
toolbar.frame = CGRectMake(0, self.view.frame.size.height - 46, self.view.frame.size.width, 48)
toolbar.sizeToFit()
toolbar.setItems(checkButton, animated: true)
toolbar.backgroundColor = UIColor.redColor()
self.view.addSubview(toolbar)
}
and it looks like this when I run the app:
I want the toolbar to stick to the bottom of the view, how is this achieved?
Any suggestions would be appreciated.
The problem is that since you're using a UITableViewController, with self.view.addSubview(toolbar), you've added your toolbar as a subview of your UITableViewController's view, i.e. a UITableView. As a subview of the UITableView, the toolbar will scroll along with the table.
The solution: Use a UIView containing a UITableView instead of using a UITableViewController if you'd like to customize your view controller. That way you can add elements to the view that aren't subviews of your tableview.
You can also embed your TableViewController in a Navigation Controller and show from the storyboard or programmatically a Toolbar. This one also standard sticks to the bottom and stays on top of the Views content and you have some functionality to hide it automatically on some conditions.
You don't have to use your Navigation controller always for navigating, sometimes its a convenient way for doing stuff Xcode makes hard to use without changing your already made Views.