Kotlin

Posts tagged with Kotlin

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 phone UI connected to separate translucent layers representing Compose presentation, state, and data responsibilities.

How to Structure a Jetpack Compose App: UI, State, and Data Layers

Learn a practical way to structure a Jetpack Compose app with UI, state-holder, data, and optional domain layers that remain easy to test and change.

A stylized group of overlapping circular UI tiles arranged along a cyan measurement guide.

How to Create a Custom Layout in Jetpack Compose

Create a custom Jetpack Compose layout with Layout, measure children once, respect parent constraints, and choose LayoutModifier when only one child needs custom placement.

Two stylized content panels aligned along a shared horizontal guide beside a vertical divider.

Baseline Alignment and Intrinsic Measurements in Compose

Learn how to align text by its baseline in Jetpack Compose and use IntrinsicSize when a layout needs content measurements before placing its children.

Violet resource tiles for text, color, and images arranged on a teal frame against a dark navy background.

How to Use Strings, Colors, and Drawables in Jetpack Compose

Load Android string, color, and drawable resources correctly in Jetpack Compose while keeping UI accessible, localizable, and theme-aware.

A violet vertical list moving along a teal scroll track with a coral button returning to the top.

rememberLazyListState: Observe and Control Scroll Position

Use rememberLazyListState in Jetpack Compose to react to LazyColumn scrolling, show a back-to-top action, send scroll events efficiently, and animate to an item.

Loading, Empty, Error, and Retry States in Compose Lists

Build clear loading, empty, error, and retry states around Jetpack Compose lists and Paging 3 without mixing UI state with list content.

Violet Kotlin-inspired building blocks connected by teal paths in an abstract Compose layout.

Kotlin Concepts Every Jetpack Compose Developer Needs

The practical Kotlin concepts behind clear Jetpack Compose code: immutability, data classes, lambdas, sealed UI state, delegation, and coroutines.

An abstract violet grid of cards arranged in responsive columns on a teal frame, with one coral highlighted card.

LazyVerticalGrid in Jetpack Compose: Adaptive Grids That Scale

Build responsive, efficient grids with LazyVerticalGrid in Jetpack Compose, including adaptive columns, stable keys, full-width spans, and practical performance guidance.

Violet list cards moving along teal identity tracks with one coral highlighted card on a dark navy background.

Lazy List Keys: Preserve Item State and Animations

Use stable keys in Jetpack Compose lazy lists to preserve item identity, remembered state, scroll position, and item animations when data changes.

Violet state blocks flowing through a teal path into an abstract Compose screen on a dark navy background.

Declarative UI in Jetpack Compose Explained

Understand declarative UI in Jetpack Compose: describe UI from state, pass events upward, and let Compose update only what changes.

A violet vertical list pulled downward along a teal arc toward a coral refresh indicator on a dark navy background.

Pull to Refresh in Jetpack Compose with Material 3

Add accessible pull-to-refresh to a Jetpack Compose LazyColumn with Material 3 PullToRefreshBox, state ownership, custom indicators, and retry-friendly behavior.

A violet vertical list with a fixed teal section header and a small coral footer on a dark navy background.

Sticky Headers, Headers, and Footers in Compose Lazy Lists

Build grouped LazyColumn content with sticky headers, regular headers, and footers in Jetpack Compose, with stable keys, state ownership, and practical accessibility guidance.

Violet cards arriving in small groups along a teal path into a vertical list, with one coral loading card.

Paging 3 with Jetpack Compose: A Practical LazyColumn Setup

Display large and remote datasets with Paging 3 and Jetpack Compose, including collectAsLazyPagingItems, stable keys, placeholders, and load states.

Violet cards of different heights flowing through a teal two-column masonry grid, with one coral card highlighted.

Lazy Staggered Grid in Jetpack Compose: Build Masonry Layouts

Learn when to use LazyVerticalStaggeredGrid in Jetpack Compose, including adaptive lanes, stable keys, full-line content, spacing, and accessible image tiles.

Three distinct violet card shapes flowing through separate teal lanes in an abstract mixed Compose list.

contentType in LazyColumn: Mixed List Performance

Learn how contentType helps Jetpack Compose reuse compatible item compositions in mixed LazyColumn feeds, when to use it, and how it differs from stable keys.

A dark technical illustration of a UI card surrounded by ordered, translucent layers for tap target, padding, clipping, and content.

Why Modifier Order Matters in Jetpack Compose

See how Jetpack Compose Modifier order changes touch targets, backgrounds, clipping, and size constraints with practical before-and-after examples.

An Android phone displaying a modern Compose interface assembled from Kotlin-inspired UI cards, with a state-to-UI flow diagram.

What Is Jetpack Compose? A Beginner's Guide to Modern Android UI

Learn what Jetpack Compose is, how declarative Android UI works, and why Compose replaces XML layouts with reusable Kotlin functions.

A dark technical illustration showing shared UI state in a parent container flowing to multiple synchronized child interface panels.

State Hoisting in Jetpack Compose with Real Examples

Learn when to hoist Jetpack Compose state, how stateful and stateless composables work, and where remember, state holders, and ViewModels belong.

A dark mobile UI illustration showing a top app bar, bottom navigation, floating action button, and highlighted safe areas around a phone screen.

Scaffold and Window Insets in Jetpack Compose

Build edge-to-edge Compose screens with Scaffold, apply innerPadding correctly, and avoid status bar, navigation bar, and keyboard overlap.

An abstract dark interface diagram showing horizontal, vertical, and overlapping card layouts for Jetpack Compose.

Row vs Column vs Box in Jetpack Compose

Learn when to use Row, Column, and Box in Jetpack Compose, including alignment, arrangement, weight, and overlay patterns with practical examples.

A dark navigation diagram showing a central mobile app screen connected to several destination panels with forward and back paths.

Navigation Compose: Create Your First NavHost

Create a first Navigation Compose NavHost with type-safe routes, arguments, back navigation, and callbacks that keep screens independent.

A dark technical design-system illustration with color swatches, type-scale lines, shape tokens, and a central mobile interface.

MaterialTheme in Jetpack Compose: Colors, Typography, and Shapes

Build a consistent Material 3 Compose theme with color schemes, typography, shapes, dark mode, and dynamic color fallbacks.

A dark technical illustration of an Android phone bridging an XML-style view hierarchy and a Kotlin-inspired Jetpack Compose interface.

Jetpack Compose vs XML Views: Which Should You Use?

Compare Jetpack Compose and XML Views, understand their trade-offs, and choose the right approach for a new Android app or a gradual migration.

A dark technical illustration of a UI card wrapped in colored layers to represent an ordered Jetpack Compose Modifier chain.

Jetpack Compose Modifier: A Practical Guide

Learn how Jetpack Compose Modifier chains work, why order matters, how to design reusable components, and when to use scoped or reusable modifiers.

A Jetpack Compose LazyColumn showing a vertically scrolling article list with stable item keys, a sticky category header, and a scroll-to-top button.

Jetpack Compose LazyColumn: A Practical Guide to Fast, Stateful Lists

Learn how to build efficient Jetpack Compose LazyColumn lists with stable keys, scroll state, sticky headers, mixed content, and practical performance guidance.

A dark technical illustration of an Android layout with expanding width, centered content, proportional weighted columns, and a fixed square inside a constraint frame.

fillMaxWidth, wrapContentSize, weight, and size in Jetpack Compose

Learn how fillMaxWidth, wrapContentSize, weight, and size respond to parent constraints in Jetpack Compose with practical layout examples.

A dark technical illustration of an Android screen receiving a UI tree, geometric layout grid, and glowing drawing layer to represent the three Compose UI phases.

Jetpack Compose UI Phases: Composition, Layout, and Drawing

Understand Jetpack Compose composition, layout, and drawing phases, how state reads restart work, and how to diagnose real UI performance problems.

A dark technical illustration of small Kotlin-inspired UI blocks combining into a mobile screen, with state flowing into the blocks.

@Composable Functions: How They Work in Jetpack Compose

Learn how @Composable functions describe Jetpack Compose UI, receive state and events, recompose safely, and become reusable Android components.

A dark technical illustration of an Android layout showing evenly spaced horizontal cards, centered vertical cards, and an overlaid corner-aligned element.

Arrangement and Alignment in Jetpack Compose

Learn how Arrangement and Alignment position children in Row, Column, and Box, with practical Compose examples for spacing, centering, and overlays.

A violet navigation path passes through teal destination cards to a warm off-white verification panel with a small coral check marker.

Testing Navigation Compose: NavHost, Actions, and Back Stack

Test Navigation Compose with TestNavHostController, UI-driven actions, route assertions, and screen callbacks that keep destinations independently testable.

A teal interactive control follows a curved violet path through a warm off-white input channel toward a small coral destination marker on a deep navy background.

Click, Type, Scroll, and Test User Interactions in Compose

Test Compose clicks, text input, IME actions, scrolling, and custom touch gestures with semantic APIs that verify real user outcomes.

An abstract teal interface card connects through violet paths to a warm off-white verification tile with a coral success marker on a deep navy background.

Jetpack Compose UI Testing: Setup and First Test

Set up Jetpack Compose UI tests, choose the right test rule, and write a first semantics-driven test that verifies a real user outcome.

Master dynamic search in Jetpack Compose with real-time filtering, proper state management, and performance optimization techniques for modern Android apps.

Dynamic Search Jetpack Compose: Complete Implementation Guide 2025

Learn to implement dynamic search in Jetpack Compose with debouncing, StateFlow, and performance optimization. Complete code examples included.

Building scalable Android UIs with Jetpack Compose: Transform repetitive UI patterns into flexible, reusable components that adapt across themes and use cases.

Jetpack Compose Reusable Components: Complete Guide to Custom UI

Master Jetpack Compose reusable components with advanced patterns, testing strategies, and best practices for scalable Android UI development.

Clean Architecture layers with Jetpack Compose and MVVM pattern - the modern approach to scalable Android app development.

Jetpack Compose Clean Architecture: Complete MVVM Guide for Android

Master Jetpack Compose Clean Architecture with MVVM. Build scalable Android apps with practical examples, testing strategies & best practices.

Transform your Android app from traditional XML Views to modern Jetpack Compose with our comprehensive migration strategies and best practices.

Android View to Compose Migration: Complete Developer Guide 2025

Master Android View to Jetpack Compose migration with our step-by-step guide. Gradual migration strategies, code examples & best practices.

Understanding when to use Compose State (remember) versus ViewModel for effective Android app architecture and state management.

Compose State vs ViewModel: Complete Android Developer Guide 2025

Master Jetpack Compose state management! Learn when to use remember vs ViewModel, best practices, and how they work together in Android apps.

Transform your Jetpack Compose app performance with proven recomposition optimization techniques that eliminate jank and boost user experience.

Fix Compose Recomposition Issues: 2025 Performance Guide

Master Jetpack Compose performance with 15+ proven techniques to fix recomposition issues. Boost UI speed, reduce jank, and optimize Android apps.

Boost your Android app's performance with these 10 expert Jetpack Compose optimization strategies for faster, smoother user experiences in 2025.

10 Jetpack Compose Performance Tips: Boost Android App Speed 2025

Master Jetpack Compose performance with 10 expert optimization tips. Reduce recomposition, improve scrolling, and boost Android app speed.

Master Jetpack Compose side effects with proper effect handlers for building robust Android applications

Complete Jetpack Compose Side Effects Tutorial with Code Examples

Master Jetpack Compose side effects! Complete guide to LaunchedEffect, DisposableEffect, rememberCoroutineScope + examples & best practices.

How Navigation 3 in Jetpack Compose uses a back stack, entry provider, and NavDisplay to manage navigation state and display UI content reactively.

Jetpack Navigation 3: Complete Android Developer Guide 2025

Guide to Jetpack Compose Navigation 3: See how back stack, keys, and NavDisplay work together for smooth navigation in Android apps.

Navigate the complexities of Jetpack Compose state with our comprehensive best practices guide.

The Ultimate Guide to Mastering State Management in Jetpack Compose

Jetpack Compose state management best practices. Learn hoisting, ViewModel, UDF, effects & performance. Ultimate guide with code.

How to Use Material Icons in Jetpack Compose - (A Developer's Complete Guide 2026)

Learn how to implement Material Icons in Jetpack Compose with step-by-step examples. Master icon customization, animations, and image loading.

Visualization of Clean Android Architecture implementing the MVVM pattern with distinct layers for separation of concerns and improved maintainability.

Clean Android Architecture Implementing Modern MVVM in 2026

Learn to implement Clean Android Architecture with MVVM in 2025. Practical code examples for building maintainable apps using Kotlin Coroutines & Hilt