Jetpack Compose Support in Workflow
Article Summary
Zach Klippenstein from Square reveals how they bridged their state machine architecture with Google's declarative UI toolkit—a year before Compose hit 1.0.
Square's Point of Sale apps run on Workflow, a library that treats business logic as declarative state machines. When Jetpack Compose emerged, they faced a challenge: integrate a radically new UI paradigm without breaking their existing architecture. This deep dive documents their experimental journey through Compose's beta period, solving problems around navigation lifecycles, state persistence, and composition linking.
Key Takeaways
- composedViewFactory() wraps Compose UI in Workflow's ViewFactory pattern seamlessly
- WorkflowRendering composable bypasses Android Views when nesting Compose screens
- Custom lifecycle and SavedStateRegistry wiring enables proper state restoration
- Preview support works for any ViewFactory, even classic Android Views
- renderAsState() hosts Workflow runtime directly in Compose with automatic snapshots
Square built a complete Compose integration for Workflow that maintains unidirectional data flow while enabling bidirectional interop between Compose and View-based screens.
About This Article
Square's Workflow library expected the view layer to intelligently diff changes to view models. Instead, many developers writing XML layouts and direct View APIs manually diffed changes themselves, which led to inefficient views that didn't take advantage of declarative UI benefits.
Zach Klippenstein's team built composedViewFactory() and WorkflowRendering composables that handle diffing automatically through Compose's snapshot state system. This removed the need for manual change detection and let them use Compose's built-in optimization mechanisms.
Square got bidirectional interop between Compose and View-based screens while keeping unidirectional data flow. This let them adopt Compose gradually across their Point of Sale apps without rewriting all their existing business logic.
