Introduction

UIView does not have a built-in property for per-side borders. If you want a border only on the top edge, the usual solution is to add a thin subview or CALayer positioned at the top of the view.

Why the Default Border Is Not Enough

UIView.layer.borderWidth and UIView.layer.borderColor apply to all four sides equally. That works for a full rectangle border, but not when the design needs only a top separator.

To draw just one side, you create your own drawable element and place it where the border should appear.

A Simple CALayer Approach

CALayer is lightweight and fits this use case well:

1import UIKit
2
3final class DemoViewController: UIViewController {
4    let box = UIView()
5    let topBorder = CALayer()
6
7    override func viewDidLoad() {
8        super.viewDidLoad()
9
10        view.backgroundColor = .white
11
12        box.translatesAutoresizingMaskIntoConstraints = false
13        box.backgroundColor = .systemGray6
14        view.addSubview(box)
15
16        NSLayoutConstraint.activate([
17            box.centerXAnchor.constraint(equalTo: view.centerXAnchor),
18            box.centerYAnchor.constraint(equalTo: view.centerYAnchor),
19            box.widthAnchor.constraint(equalToConstant: 220),
20            box.heightAnchor.constraint(equalToConstant: 120)
21        ])
22
23        topBorder.backgroundColor = UIColor.systemBlue.cgColor
24        box.layer.addSublayer(topBorder)
25    }
26
27    override func viewDidLayoutSubviews() {
28        super.viewDidLayoutSubviews()
29        topBorder.frame = CGRect(x: 0, y: 0, width: box.bounds.width, height: 1)
30    }
31}

The important detail is placing the frame update in viewDidLayoutSubviews(). That ensures the border matches the view's final size after Auto Layout finishes.

Using a Subview Instead

Some teams prefer a thin UIView because it is easier to inspect in the view hierarchy:

1let border = UIView()
2border.translatesAutoresizingMaskIntoConstraints = false
3border.backgroundColor = .lightGray
4box.addSubview(border)
5
6NSLayoutConstraint.activate([
7    border.topAnchor.constraint(equalTo: box.topAnchor),
8    border.leadingAnchor.constraint(equalTo: box.leadingAnchor),
9    border.trailingAnchor.constraint(equalTo: box.trailingAnchor),
10    border.heightAnchor.constraint(equalToConstant: 1)
11])

This approach is especially convenient when the border must participate in Auto Layout or be animated like a normal view.

Which Approach Should You Use

Use CALayer when:

• the border is purely decorative
• you want minimal overhead
• you do not need layout constraints for the border itself

Use a subview when:

• you want constraint-based layout
• the border may be shown, hidden, or animated as a regular view
• your team prefers UI code that is easier to inspect visually

Both are valid. The key is to avoid using the full view border when only one edge should be drawn.

Reusable Extension Pattern

If you need this often, wrap it in a helper:

1import UIKit
2
3extension UIView {
4    func addTopBorder(color: UIColor, thickness: CGFloat) {
5        let border = CALayer()
6        border.backgroundColor = color.cgColor
7        border.frame = CGRect(x: 0, y: 0, width: bounds.width, height: thickness)
8        layer.addSublayer(border)
9    }
10}

For dynamic layouts, call the helper after the view has a valid size, or update the border frame during layout.

If the view is reused inside table or collection cells, it is also worth removing any old border layers before adding a new one. Otherwise repeated configuration can stack multiple top borders on the same view and make the line appear thicker than intended.

Common Pitfalls

• Setting layer.borderWidth and expecting only the top side to appear.
• Adding the border before the view has its final bounds, which leads to the wrong width.
• Adding a new border layer repeatedly during layout and creating duplicates.
• Forgetting to update the border when the view resizes.
• Using a one-pixel assumption without considering screen scale if a very precise visual result is needed.

Summary

• 'UIView has no built-in one-sided border API.'
• The usual fix is a thin CALayer or a thin subview pinned to the top edge.
• 'CALayer is lightweight and good for decorative borders.'
• For Auto Layout-heavy code, a subview can be easier to manage.
• Always size the top border after layout so it matches the final view width.