How to, in effect, have a vertical line spanning the entire screen separating 2 sections in Xcode

Question

I want to separate the screen into 2 sections with a vertical line. The vertical line should go from bottom of the screen all the way up to navbar. If we were using html/css, I would simply have 2 divs, and put a left border on the right div. If there is a way to place a border on a single side of a view, then I can just make 2 views and follow your instruction for the border. If this is not possible, is there a way I can literally just draw a vertical line in the storyboard. Or is my only option using a UIBezier path?

Much thanks, this is my first time building my own app envisioned from my head so if this question is a little silly I apologize.

Answer 1

You can do one of several methods, but since you are just starting out I'll go with the simple one:

Add a new view to the view controller and set it's background color to the colour you want the separator to be. Next add a constraint to centre it's X position in it's superview, then add a constraint to give it a constant width of 1pt, and then finally add 2 more constraints, one at the top with a constant of 0 and the same with the bottom. Now you should have a view thats acting as a separator between the 2 sides of the view controller.

After you have the separator you can add views either side and constrain them to the separator so they stretch and shrink based on the width of the device your app is running on.

Answer 2

Well, you can just drag and drop a view and change its background color as your needs.

Now just apply following constrains on the view.

And you will have something like this.

Now your screen is devided into two parts.

You can Visit This if you want to add border to only one side of a view. And if you want to do this using a UIBezeirPath you can visit This