About Mist

Mist is a modern Flutter UI Kit for a Car Wash & Bike Care booking app, featuring 30+ polished screens that cover the complete booking journey—from location and vehicle selection to service browsing, booking, checkout, and profile management. The template includes Google Maps integration to display the user’s current location and is built with clean, modular code using MobX for state management.

This is a frontend UI Kit — no backend, database, or live API is included. All screens use static sample data for demonstration purposes. You can easily connect your own backend (REST API, Firebase, or any custom service) to make the application fully functional.

Key Features

30+ modern and well-organized Flutter screens
Light & Dark theme support
Current location detection using Geolocator
Google Maps integration
Location, city & vehicle selection flow
Home screen with service categories
Service listing and detailed service pages
Ratings, reviews and FAQs UI
Cart, coupons, slot booking and payment UI
Booking history and address management
Profile management and premium membership screens
Responsive UI for Android & iOS
Flutter Null Safety support
Clean architecture and reusable widgets

Technology Stack

Flutter
Dart
MobX for state management
Google Maps Flutter
Geolocator
Modular project structure (screens, services, network, models, stores and utilities)

Technical Requirements

Flutter 3.29.3 or later
Dart 3.7.2 or later
Android Studio or Visual Studio Code with Flutter & Dart plugins
Xcode 14 or later (for iOS builds)
Android minSdkVersion 21+
iOS 12.0+

Google Maps Configuration

This template uses Google Maps to display the user’s current location. Before running the project, create your own Google Maps API key and replace the placeholder API key in both the Android and iOS projects.

Step 1: Create a Google Maps API Key

Create or select a project in Google Cloud Console.
Enable Maps SDK for Android and Maps SDK for iOS.
Create an API key from APIs & Services > Credentials.

Android

Replace the placeholder API key in:

android/app/src/main/AndroidManifest.xml

iOS

Replace the placeholder API key in:

ios/Runner/AppDelegate.swift

Location Permission

The application requests the user’s location only while the app is in use to display the current position on Google Maps. The required iOS location permission (NSLocationWhenInUseUsageDescription) is already configured in the project.

Background location tracking is not used, so no additional background location permissions are required.

Optional Firebase Usage

Firebase is not configured by default. If you choose to integrate Firebase (Authentication, Firestore, Cloud Messaging, Storage, etc.), additional configuration is required. Depending on your usage, Firebase services may incur charges beyond the free tier.

What’s Included

Complete Flutter source code
Well-organized project structure
Documentation for setup and customization
Google Maps configuration guide
API integration examples
Reusable widgets and components

Mist - Car Wash On-Demand Home Service App