Blog - Page 2

Five progressively wider warm off-white panels cross a glowing violet threshold with a teal indicator and a small coral marker on deep navy.

Window Size Classes in Jetpack Compose

Use Jetpack Compose window size classes to make high-level layout decisions from the current app window, including compact through extra-large widths, height constraints, current APIs, and breakpoint testing.

A design canvas and plugin panel illustrating color names being exported as CSS, Jetpack Compose, and Android XML code.

Figma Name That Color Plugin: Name Colors and Export Code

Learn how to use the Figma Name That Color plugin to identify colors from a selected layer and copy CSS variables, Jetpack Compose colors, or Android XML resources.

A violet dependency hub connects teal service cards to a warm off-white Compose state panel, with a small coral scope marker.

Hilt Dependency Injection in Jetpack Compose

Set up Hilt for a Compose app, inject dependencies into ViewModels, retrieve them at screen boundaries, and scope shared state to Navigation graphs.

Three teal event spheres enter a violet control hub that produces a warm off-white state panel and one small coral effect signal.

UI State, UI Events, and One-Time Effects in Compose

Model Compose screens with durable UI state, explicit UI events, and controlled one-time effects for navigation and snackbars.

A stylized phone connected to several destination cards by a branching violet navigation path.

Type-Safe Navigation Compose with Kotlin Serialization

Replace string-based Navigation Compose routes with serializable Kotlin types, typed arguments, and a graph that is easier to refactor and test.

Two stylized destination screens connected by a path carrying colored data tokens from one screen to another.

Passing Arguments Between Compose Destinations

Pass IDs, filters, and optional values between Jetpack Compose destinations with type-safe Kotlin serialization routes and reliable back-stack handling.

A stylized violet state capsule splitting into small teal save tokens and restoring into a matching capsule.

rememberSaveable and Custom Savers in Jetpack Compose

Use rememberSaveable for small UI state that must survive recreation, create listSaver and mapSaver implementations for custom types, and avoid storing large data in Bundles.

A teal stack of rounded collection cards flows into a violet state container, with one small coral card being added.

Managing Lists and Collections as Compose State

Manage Jetpack Compose list and collection state with observable immutable updates, SnapshotStateList, stable lazy-list keys, and a clear ownership boundary.

A stylized Compose screen with a teal vertical navigation rail and a violet bottom action bar surrounding a central content panel.

BottomAppBar and NavigationRail in Material 3

Choose BottomAppBar or NavigationRail in Material 3 Compose, keep screen actions separate from destination navigation, handle Scaffold padding, and plan adaptive navigation.