A demo app displaying a list of bus routes as well as route details with step-by-step routing information on a map.
Made using the latest Android development stack and architectural and UI development patterns, including Jetpack Compose and Material Design 3.
The app will load pages automatically once the user scrolls far enough (close enough to the last item). The pages are "faked" on the app-side to accommodate enough data for pagination, as the current API does not support pagination (and only returns two items).
NOTE: When building the app, you need to provide two API keys to the build process by adding in your local.properties the following two lines:
MAPS_API_KEY=YOUR_MAPS_KEY_HERE
GEOAPIFY_API_KEY=YOUR_GEOAPIFY_KEY_HERE
Instructions:
Google Maps API key instructions
-
Listing routes: Bus routes are listed in an infinitely scrollable list, with pages loaded dynamically. Scroll to-refresh to refresh the data.
-
Route details: The route can be opened to reveal the details, with the route displayed on a full-screen map, and routing info in an expandable bottom sheet.
-
Routing: Expand individual leg sections for step-by-step routing instructions, students to pick up and click on the corresponding button to pan to that stop on the map.
-
Dark mode: Toggle to override system settings. When toggled, the preference is persisted.
This app is made using:
- Jetpack Compose for UI with Material 3
- A mix of MVVM/MVI clean architecture with unidirectional data flows
- Datastore for preferences persistence
- Standardized design and typography to match Material 3 and easy customization
Stack:
- MVVM architecture (mix of MVVM and MVI)
- Jetpack Compose and Compose Navigation for UI rendering
- Maps Compose for map display
- Geoapify for routing calculation
- Hilt for dependency injection
- KotlinX Serialization for serialization and deserialization of models into and from files
- Retrofit for network requests
- Extended Material icons for vector images
- DataStore for persisting user preferences
- Compose Shimmer for loading item shimmer support
- MockK for mocking in tests
- Turbine for testing Flows
Routes Listing & Drawer
Route details