Sample CodeiOS, iPadOS, Mac Catalyst, macOSReviewed 2026-07-21View on Apple Developer

Composing custom layouts with SwiftUI

At a glance

Item Summary
Purpose Arrange views in your app’s interface using layout tools that SwiftUI provides.
App architecture A Swift sample with the source-visible chain CustomLayoutSampleAppContentViewModelSwiftUI APIs.
Main patterns SwiftUI environment injection, Publisher-backed observable state
Project style 12 scanned source file(s) across Swift, organized around ranked entry, type, and file boundaries.

Project structure

Source bundle/
└── CustomLayoutSample/
    ├── CustomLayoutSampleApp.swift
    ├── Views/
    │   ├── ContentView.swift
    │   ├── ButtonStack.swift
    │   ├── Avatar.swift
    │   ├── Leaderboard.swift
    │   ├── Podium.swift
    │   └── Profile.swift
    ├── Model/
    │   ├── Model.swift
    │   └── Pet.swift
    └── Layouts/
        ├── MyEqualWidthVStack.swift
        ├── MyRadialLayout.swift
        └── MyEqualWidthHStack.swift

Structure observations

  • Architecturally prominent files are ranked from entry points and role-named declarations; resource-only paths are omitted.
  • Primary languages: Swift.
  • The verified tree contains 4 project/configuration file(s) and 15 source declaration(s).

Overall architecture

Reference code

CustomLayoutSample/CustomLayoutSampleApp.swift:18 — architecture anchor

@main
struct CustomLayoutSampleApp: App {
    // ...
}

Interpretation

The arrows summarize the source-visible entry, role-named types or folders, and framework direction; when nodes come from structural folders, the sequence is a high-level interpretation rather than proof that every adjacent node calls the next. Ownership is claimed only where the next section cites a stored property or assignment. The diagram is intentionally limited to the dominant path into SwiftUI.

Ownership and state

Ownership evidence

CustomLayoutSample/CustomLayoutSampleApp.swift:21 — stored dependency or nearest verified ownership anchor

@main
struct CustomLayoutSampleApp: App {
    // ...
    @StateObject private var model: Model = Model.startData
    // ...
}
Owner Object or state Relationship Mutation authority
CustomLayoutSampleApp Model (model) owns wrapper-managed state Owning lexical scope
Model Array (pets) owns value state App/module collaborators
Model Model (startData) creates and retains App/module collaborators
Buttons Model (model) receives environment-provided state The environment provider is authoritative

Composition arrows indicate a source-visible construction expression or locally owned value state; aggregation means the owner stores or receives a dependency without proving exclusive lifetime ownership.

Class and protocol design

CustomLayoutSample/CustomLayoutSampleApp.swift:19 — representative type boundary

struct CustomLayoutSampleApp: App {
    // ...
}
Type Responsibility Depends on or conforms to
CustomLayoutSampleApp Application entry and top-level composition App
ContentView User-interface presentation and input forwarding View
Model Feature data or observable state ObservableObject
ButtonStack Represents a feature value or composable behavior View
Buttons Represents a feature value or composable behavior View
MyEqualWidthVStack Represents a feature value or composable behavior Layout
CacheData Represents feature data Concrete collaborators/imported frameworks
MyRadialLayout Represents a feature value or composable behavior Layout
Rank Represents a feature value or composable behavior LayoutValueKey
Avatar Represents a feature value or composable behavior View

No local protocol conformance is claimed as protocol-oriented design; external framework conformances are listed only as dependencies.

Access control

Symbol Access Verified effect Likely rationale
model (CustomLayoutSample/CustomLayoutSampleApp.swift:21) private Use is restricted to the lexical declaration and same-file extensions allowed by Swift. Inference: keep state mutation or dependency lifetime inside the owning implementation.
maxSize (CustomLayoutSample/Layouts/MyEqualWidthHStack.swift:105) private Use is restricted to the lexical declaration and same-file extensions allowed by Swift. Inference: hide an implementation step that is not part of the collaboration surface.
spacing (CustomLayoutSample/Layouts/MyEqualWidthHStack.swift:118) private Use is restricted to the lexical declaration and same-file extensions allowed by Swift. Inference: hide an implementation step that is not part of the collaboration surface.
maxSize (CustomLayoutSample/Layouts/MyEqualWidthVStack.swift:149) private Use is restricted to the lexical declaration and same-file extensions allowed by Swift. Inference: hide an implementation step that is not part of the collaboration surface.

Reference code

CustomLayoutSample/CustomLayoutSampleApp.swift:21 — representative boundary

@main
struct CustomLayoutSampleApp: App {
    // ...
    @StateObject private var model: Model = Model.startData
    // ...
}

Swift declarations without a modifier are internal; explicit private, fileprivate, private(set), public, or open entries above are interpreted by language semantics. Objective-C/C samples instead rely on header and implementation boundaries, which are not equivalent to Swift lexical privacy.

Logic ownership and placement

Logic Owning type or file Placement rationale
Application entry and top-level composition CustomLayoutSampleApp The source’s App suffix makes this role explicit.
Feature data or observable state Model The source’s Model suffix makes this role explicit.
User-interface presentation and input forwarding ContentView The source’s View suffix makes this role explicit.

Design patterns

Pattern Source evidence Purpose or tradeoff
SwiftUI environment injection CustomLayoutSample/Views/ButtonStack.swift:51 The environment supplies state or a capability without threading it through every initializer.
Publisher-backed observable state CustomLayoutSample/Model/Model.swift:27 Published properties notify observers while mutation remains with the state object.

Naming conventions

  • Types: App: CustomLayoutSampleApp; Model: Model; View: ContentView.
  • Protocols: no local protocol declaration in the scanned source.
  • Methods: rank, sizeThatFits, placeSubviews, makeCache, maxSize, spacing, getOffset, residual.
  • Files: CustomLayoutSample/CustomLayoutSampleApp.swift, CustomLayoutSample/Views/ContentView.swift, CustomLayoutSample/Model/Model.swift, CustomLayoutSample/Views/ButtonStack.swift, CustomLayoutSample/Layouts/MyEqualWidthVStack.swift, CustomLayoutSample/Layouts/MyRadialLayout.swift.

Architecture takeaways

  • CustomLayoutSampleApp is the main source-visible entry or composition anchor for this sample.
  • Framework work reaches SwiftUI through a deliberately small high-level chain; the detailed API graph remains inside the cited implementation files.
  • Stored-property evidence identifies lifecycle collaboration; it does not by itself prove exclusive object ownership.
  • Access-control conclusions separate verified language visibility from the likely design rationale.
  • The source does not justify labeling the design protocol-oriented.

Source map

Source file Relevant symbols
CustomLayoutSample/CustomLayoutSampleApp.swift CustomLayoutSampleApp
CustomLayoutSample/Views/ContentView.swift ContentView, ContentView_Previews
CustomLayoutSample/Model/Model.swift Model
CustomLayoutSample/Views/ButtonStack.swift ButtonStack, Buttons, ButtonStack_Previews
CustomLayoutSample/Layouts/MyEqualWidthVStack.swift MyEqualWidthVStack, CacheData
CustomLayoutSample/Layouts/MyRadialLayout.swift MyRadialLayout, Rank
CustomLayoutSample/Views/Avatar.swift Avatar, Avatar_Previews
CustomLayoutSample/Views/Leaderboard.swift Leaderboard, Leaderboard_Previews
CustomLayoutSample/Views/Podium.swift Podium, Podium_Previews
CustomLayoutSample/Views/Profile.swift Profile, Profile_Previews