Frame vs Bounds; explained with co-ordinate System

Introduction

frame and bounds are among the most fundamental properties of UIView. Although they often appear similar, they represent different coordinate systems and behave differently when modified.

Understanding these properties is essential for building custom views, animations, scrollable content and complex user interfaces.

What is Frame?

The frame defines the position and size of a view in the coordinate system of its superview.

UIView Frame Example
Figure 1. Frame in the Superview's Coordinate System

What is Bounds?

The bounds defines the view's own internal coordinate system. It describes the drawable area of the view and controls how its content is positioned inside the view.

UIView Bounds Coordinate System
Figure 2. Bounds Coordinate System

Frame vs Bounds

Although both properties describe the geometry of a view, they are measured in different coordinate systems.

Changing the frame usually affects the view's position or size relative to its parent, whereas changing the bounds affects how content is displayed inside the view.

Example

Swift

let view = UIView(
    frame: CGRect(
        x: 20,
        y: 40,
        width: 200,
        height: 120
    )
)

print(view.frame)
print(view.bounds)

Comparison

Property Frame Bounds
Coordinate System Superview Own View
Position Yes No
Size Yes Yes
Moves Content No Yes
Note
The default value of bounds.origin is (0, 0).
Tip
When explaining layout issues, visualize both the superview's coordinate system and the view's own coordinate system. It becomes much easier to understand the difference between frame and bounds.
Warning
Changing bounds.origin does not move the view itself. It changes the coordinate system inside the view, which changes where its contents are drawn.

Key Takeaways

  • Frame is measured in the coordinate system of the superview.
  • Bounds is measured in the coordinate system of the view itself.
  • Changing the frame affects the view's position and/or size.
  • Changing bounds.origin changes how the content inside the view is positioned.
  • Understanding frame and bounds is essential for mastering UIKit layout and animations.