Building a Declarative UI Framework for UIKit in Swift

This article introduces a custom Swift-based declarative UI framework for UIKit, addressing the limitations of traditional AutoLayout and the constraints of existing solutions like ComponentKit and SwiftUI.

Background: With the emergence of Flutter and other declarative UI frameworks using FlexBox layout, the author discusses how this unified layout approach is becoming essential in cross-platform development. Traditional iOS AutoLayout relies on constraints describing relationships between views, which leads to poor code portability and readability.

Implementation: The framework includes several key components:

API Design: Uses Swift's concise syntax to create structured, readable APIs where code structure mirrors UI structure.

Layout System: Abstracts layout algorithms through Measurable and Regulator nodes, where containers are also view nodes with calculation capabilities. Regulator can be extended horizontally to support diverse layout rules.

Data Interaction: Introduces State , Outputing , and Inputing protocols for reactive data binding. Views can operate during declaration without holding references, with parent views managing the view tree.

Animation: Uses mutable UIView tree with animation blocks, unlike Flutter's immutable widget rebuild approach.

Data-Driven Lists: Implements TableBox and CollectionBox for reactive list views with diff calculation for efficient updates.

Style System: Introduces Style concept similar to CSS, enabling composition over inheritance for view styling.

Practice Results: The framework was applied in the beauty industry project, achieving pure reactive UI development, improved development efficiency through unified APIs, and reduced code volume with higher flexibility through composition over inheritance.

Future Improvements: Plans include reducing redundant calculations through dirty markers and boundaries, adding constraint layout support, and using virtual layout concepts to reduce view hierarchy for better rendering performance.