UITextField
iOS Development
Swift Programming
Text Alignment
Mobile App Design

Indent the text in a UITextField

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions

Introduction

UITextField does not provide a direct "left padding" property, so text indentation is typically implemented by overriding text rect methods or assigning left/right accessory views. The best approach depends on whether you need simple fixed padding, dynamic layout behavior, or custom styling that includes placeholder and editing states. Many teams start with quick layout hacks and later discover inconsistent spacing between text, placeholder, and cursor. A stable implementation keeps all relevant rect calculations aligned and works across Auto Layout, dynamic type, and right-to-left locales.

Core Sections

Use left view for simple padding

For fixed leading space, a left view is easy and readable.

swift
1let field = UITextField(frame: .zero)
2field.borderStyle = .roundedRect
3field.leftView = UIView(frame: CGRect(x: 0, y: 0, width: 12, height: 1))
4field.leftViewMode = .always

This works well for common forms and avoids subclassing in simple screens.

Subclass for full control over text rects

If you need consistent indentation for normal, editing, and placeholder text, override all three rect APIs.

swift
1import UIKit
2
3final class PaddedTextField: UITextField {
4    var inset = UIEdgeInsets(top: 0, left: 12, bottom: 0, right: 12)
5
6    override func textRect(forBounds bounds: CGRect) -> CGRect {
7        bounds.inset(by: inset)
8    }
9
10    override func editingRect(forBounds bounds: CGRect) -> CGRect {
11        bounds.inset(by: inset)
12    }
13
14    override func placeholderRect(forBounds bounds: CGRect) -> CGRect {
15        bounds.inset(by: inset)
16    }
17}

This pattern keeps cursor position and placeholder alignment coherent.

Handle icons and accessory views

When using a left icon plus padding, combine a container view that includes icon and spacing. This avoids text overlapping accessory content.

swift
1let icon = UIImageView(image: UIImage(systemName: "magnifyingglass"))
2icon.contentMode = .scaleAspectFit
3icon.frame = CGRect(x: 8, y: 0, width: 16, height: 16)
4
5let container = UIView(frame: CGRect(x: 0, y: 0, width: 32, height: 24))
6container.addSubview(icon)
7field.leftView = container
8field.leftViewMode = .always

Consider RTL and accessibility

If your app supports right-to-left languages, test indentation behavior under RTL layout direction. Also verify spacing at larger text sizes and with voice-over focus. Hardcoded visual assumptions often break in accessibility modes.

Keep style logic centralized

For consistent forms, expose a shared style helper so all text fields use the same inset, corner radius, and border settings. This prevents subtle UI drift between screens.

Common Pitfalls

  • Setting only textRect and forgetting editingRect or placeholderRect, causing inconsistent alignment.
  • Using frame-based padding hacks that break when Auto Layout or dynamic type changes control size.
  • Letting accessory icons overlap text by not reserving enough left or right view width.
  • Ignoring right-to-left layout testing when padding assumptions are left-to-right only.
  • Repeating per-screen text field styling instead of using a reusable subclass or style utility.

Verification Workflow

After implementing the main approach, run a short verification loop that proves behavior on realistic and adversarial inputs. Start with a small happy-path sample that should always pass, then add one edge case and one failure case that should be rejected or handled gracefully. Capture concrete outputs instead of relying on visual inspection alone. For operational code, record one measurable signal such as runtime, memory use, or error count so you can compare before and after future refactors.

Use this quick template during local development and CI:

text
11. Prepare deterministic sample input
22. Run expected-success scenario
33. Run expected-edge scenario
44. Run expected-failure scenario
55. Assert output schema and key values
66. Record one performance or reliability metric

This discipline catches most regressions caused by dependency upgrades, environment differences, or hidden assumptions in helper functions. It also makes handoffs easier because another engineer can reproduce behavior quickly without reverse-engineering your intent from source code alone.

Summary

Indenting text in UITextField is straightforward when you choose the right mechanism. Use leftView for simple fixed spacing, and subclass with rect overrides when you need precise, consistent control across states. Include accessory and RTL testing early to avoid late UI regressions. A reusable padded field implementation keeps form styling clean and predictable across your app.


Related reading
Free course
Beginner
7 lessons
2 hours
Tackling System Design Interview Problems

A short course that equips you with the skills to approach system design interviews methodically.

Start the free course
Track what you have practised

A free account saves your progress, solutions and study plan across every problem on Codemia.

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions

All Rights Reserved.