What Are Mobile Widgets?
Widgets are small, glanceable views that live on the user's home screen (or lock screen, on iOS). They display timely, relevant information from your app without requiring the user to open it. Widgets increase your app's visibility and provide a passive engagement channel.
Since iOS 14 and Android 4.1 (with significant improvements in Android 12+), widgets have become a standard feature that users expect from productivity, weather, fitness, news, and communication apps.
iOS Widgets (WidgetKit)
Architecture
iOS widgets are built with WidgetKit and SwiftUI. They are a separate target in your Xcode project (a widget extension), running in their own process. Key points:
- Widgets are not mini apps. They are read-only views that refresh on a timeline.
- Built entirely in SwiftUI (no UIKit)
- Supported sizes: small, medium, large, extra large (iPad), and accessory (lock screen)
- Maximum refresh budget: roughly 40-70 refreshes per day (system managed)
Timeline Provider
The core of a WidgetKit widget is the TimelineProvider. It generates a series of entries (snapshots of data) with dates. The system renders each entry at the specified time without waking your app.
For example, a weather widget might provide hourly entries for the next 24 hours, each with the predicted temperature.
Data Sharing
Since widgets run in a separate process, they cannot access your main app's data directly. Use:
- App Groups: Shared UserDefaults or shared file container between your app and widget extension
- Core Data / SwiftData: Shared persistent store through App Groups
- Network requests: The widget can fetch data directly, but this consumes the refresh budget
Interactive Widgets (iOS 17+)
Starting with iOS 17, widgets support interactive elements:
- Toggle buttons (e.g., complete a to-do)
- Buttons that trigger App Intents
- No navigation to other screens. Interactions must be self-contained.
Lock Screen Widgets
iOS 16 introduced lock screen widgets (accessory family). These are small, monochrome views displayed on the lock screen. They follow the same WidgetKit architecture but use the accessory widget families.
Android Widgets (App Widgets / Glance)
Traditional App Widgets
Android's original widget system uses RemoteViews, an XML-based layout that the system renders on behalf of your app:
- Defined in XML with AppWidgetProvider
- Limited set of supported views (TextView, ImageView, Button, ListView, etc.)
- Updates via RemoteViews passed to AppWidgetManager
- Can include click handlers that launch activities or trigger services
Jetpack Glance
Glance is Android's modern widget framework, built on top of Jetpack Compose concepts:
- Declarative UI using GlanceComposable functions
- Compiles to RemoteViews under the hood (so it works on all Android versions)
- Easier to build than traditional RemoteViews
- Supports theming with Material 3 dynamic colors (Android 12+)
Glance is the recommended approach for new Android widgets in 2026.
Widget Configuration
Android widgets can have a configuration activity that launches when the user adds the widget, allowing them to choose what the widget displays (e.g., which city for a weather widget or which account for a finance widget).
Cross-Platform Widget Development
React Native
React Native does not natively support widgets. You need to write native code:
- iOS: Create a WidgetKit extension target with SwiftUI
- Android: Create a Glance or RemoteViews widget in Kotlin
- Share data between the RN app and native widget using shared storage (UserDefaults/SharedPreferences)
- Community packages like react-native-widget-extension and @bittingz/expo-widgets simplify the setup for Expo projects
Flutter
Similar to React Native, Flutter requires native widget code:
- home_widget package: Bridges Flutter and native widgets, handles data sharing
- Write the actual widget UI in SwiftUI (iOS) and Glance/XML (Android)
- Share data through the home_widget Dart API
Widget Design Best Practices
- Keep it simple: Widgets should convey information at a glance. No scrolling, minimal text.
- Respect size constraints: Design for all supported sizes. Do not just scale down a large layout.
- Update wisely: Do not waste refresh budget. Update only when the displayed data actually changes.
- Deep link to relevant content: Tapping a widget should open the specific content it displays, not the app's home screen.
- Support dark mode: Both platforms support system-wide dark mode. Your widget should respect it.
- Use system fonts and spacing: Follow platform design guidelines for a native feel.
Common Pitfalls
- Trying to build a mini-app in a widget (too much interactivity or content)
- Ignoring refresh budget limits on iOS and getting stale data
- Not handling the case where the app has not been launched yet (empty data)
- Forgetting to test widget behavior after device restart