How to have horizontal separator below title bar without using UINavigationController in XIB?

In StoryBoard, if we were using UINavigationController, the embedded UIViewController, will automatically come with a title bar, with horizontal separator.

Using UINavigationController in StoryBoard

Horizontal separator (Circled in red)

If we are using XIB, it is not possible to place UINavigationController in XIB. Hence, in order to have title bar. We need to place it manually.

Added title bar (navigation bar) manually in XIB

However, with such approach, I am not getting the horizontal separator as shown below.

No horizontal separator

May I know if I were using XIB, how can I have a horizontal separator below title bar, without using UINavigationController?

Solution 1:

Change the order of the views in the view hierarchy...

Here's how it looks in the order you've setup:

output:

If we move the Navigation Bar to the bottom of the list of subviews - thus bringing it to the Top of the view hierarchy:

It now looks like this:

Solution 2:

Actually , NavigationBar has already a horizontal seperator but you couldn't see because of your collectionview 'under the navigationbar' top constraints might be zero. That cause collectionview covers the horizontal seperator.

When you use NavigationControllerall the componens in viewcontroller settle down under the navigationBar but if you use like you posted , They all in the same line . Thats why giving zero top constraints make causes the cover horizontal seperator.

You can change the top constraints of collectioview and you going to see the seperator.