Introducing multi_select_flutter_custom: A Customizable Multi-Select Widget for Flutter Apps

Pallavii Sharrma — Tue, 08 Jul 2025 11:04:13 +0000

⚫ Introduction
While working on complex Flutter UI forms, I often found limitations in existing multi-select widgets — especially when it came to customization and styling. That's what inspired me to build multi_select_flutter_custom — a lightweight, fully customizable multi-select widget for Flutter.

This plugin allows developers to easily integrate a beautiful and flexible multi-select dropdown or dialog in their Flutter apps with minimal configuration.

⚫ Features
✅ Fully customizable UI
✅ Works with any data type using generics
✅ Supports chips, dropdowns, and dialogs
✅ Easy-to-use API similar to multi_select_flutter, but with better customization
✅ Null safety support

`⚫ Installation
Add this to your pubspec.yaml:

dependencies:
multi_select_flutter_custom: ^
Then run:

flutter pub get`

⚫ How to Use
Here's a quick example of how to use it:

MultiSelectCustomBottomSheetField<String>( items: ['Apple', 'Banana', 'Mango'] .map((e) => MultiSelectCustomItem<String>(value: e, label: e)) .toList(), onConfirm: (values) { print("Selected values: $values"); }, title: const Text("Select Fruits"), ) 🔧 You can also create your own custom itemBuilder or use chip display widgets.
`

⚫ Customization
You can customize the:

Dialog style

Title widget

Item builder

Confirmation buttons

Chip display

Selected item styling

Example with chips:

MultiSelectCustomChipDisplay<String>( items: selectedItems.map((e) => MultiSelectCustomItem(value: e, label: e)).toList(), )

⚫ Use Cases

Tag selection
Filter dropdowns
User roles or categories
Multi-select search input

⚫ Why I Built This
Most of the popular packages like multi_select_flutter are great, but they often fall short when full visual customization is needed. I wanted something reusable and developer-friendly — so I built this with flexibility and simplicity in mind.

How I Fetched GPS Time in Flutter Using Platform Channels (Android + iOS)

Pallavii Sharrma — Tue, 08 Jul 2025 10:27:55 +0000

In mobile apps where time is critical (like attendance systems, time tracking, etc.), relying on the device clock can be risky. Users can manually change their device time to manipulate records — which defeats the purpose of accurate logs.

To solve this, I implemented a solution in Flutter using Platform Channels to fetch GPS time directly from the device hardware (Android and iOS), bypassing the local clock.

Let me walk you through why this is useful, and how I built it.

⚫ The Problem With DateTime.now()
In Flutter, when you use DateTime.now(), it fetches the current time based on the user's device clock. This means:

The time can be manipulated by changing the phone's settings.
If your app relies on time integrity, this opens a loophole.
Example use-cases affected:

Attendance apps
Time-sensitive transactions
Geo-tagged activities

Even alternatives like NTP (network time) require an internet connection, which may not always be available.

⚫ Why GPS Time Is More Reliable
Every GPS satellite broadcasts a precise timestamp derived from atomic clocks. Mobile devices, when fetching location data from GPS, also receive this exact time.

This time cannot be changed by the user.
It doesn’t need internet.
It's highly accurate (in milliseconds).
This makes GPS time ideal for trusted timestamps.

⚫ Solution: Use Platform Channels in Flutter
Since Flutter does not expose GPS timestamp directly via Dart APIs, I used platform channels to execute native code (Java/Kotlin for Android, Swift for iOS) and fetch the time.

⚫ Architecture:

Flutter (Dart)
↓
Platform Channel
↓
Native Code (Android/iOS)
↓
Get GPS Timestamp
↓
Return to Flutter
⚫ Android Native Code (Kotlin)
On Android, I used LocationManager with GPS_PROVIDER. Here's the Kotlin code snippet:

private fun getGpsTime(result: MethodChannel.Result) {
    val locationManager = getSystemService(Context.LOCATION_SERVICE) as LocationManager
    if (ActivityCompat.checkSelfPermission(this, Manifest.permission.ACCESS_FINE_LOCATION) != PackageManager.PERMISSION_GRANTED) {
        result.error("PERMISSION_DENIED", "Location permission not granted", null)
        return
    }

    val provider = LocationManager.GPS_PROVIDER
    val location = locationManager.getLastKnownLocation(provider)
    if (location != null) {
        result.success(location.time)  // GPS time in milliseconds
    } else {
        result.error("NO_LOCATION", "Location is null", null)
    }
}

⚫ Permission needed: ACCESS_FINE_LOCATION

Make sure to request runtime permissions and handle GPS being disabled.

⚫ iOS Native Code (Swift)
On iOS, I used CLLocationManager and accessed the timestamp from the location object:

func getGpsTime(result: @escaping FlutterResult) {
    let locationManager = CLLocationManager()
    locationManager.requestWhenInUseAuthorization()

    if CLLocationManager.locationServicesEnabled() {
        locationManager.requestLocation()
        if let location = locationManager.location {
            let gpsTime = location.timestamp.timeIntervalSince1970 * 1000
            result(Int(gpsTime))
        } else {
            result(FlutterError(code: "NO_LOCATION", message: "Location is null", details: nil))
        }
    } else {
        result(FlutterError(code: "GPS_DISABLED", message: "Location services are disabled", details: nil))
    }
}

⚫ Update your Info.plist with:

<key>NSLocationWhenInUseUsageDescription</key> <string>This app uses your location to fetch accurate GPS time.</string> 🔁 Flutter Side: MethodChannel Code In your Dart code, use a MethodChannel to call platform-specific functions.

static const platform = MethodChannel('com.example.gps_time');

Future<DateTime?> getGpsTime() async {
  try {
    final int gpsTimeMillis = await platform.invokeMethod('getGpsTime');
    return DateTime.fromMillisecondsSinceEpoch(gpsTimeMillis);
  } catch (e) {
    print("Error fetching GPS time: $e");
    return null;
  }
}

Make sure to initialize the channel in your MainActivity (Android) and AppDelegate (iOS) files.

⚫ Testing and Results
I manually tested this by:
Changing system time to a wrong value.
Fetching GPS time via platform channel.

⚫ Result: The GPS time stayed accurate and unaffected by device time changes.
In offline mode too, as long as the GPS was available, I could fetch correct time.

⚫ Challenges Faced
GPS takes time to get a fix; sometimes the location is null.
iOS requires location permission and simulator doesn't return real GPS time.
Cold starts need fallback/retries until location is ready.

⚫ Conclusion
Using platform channels to fetch GPS-based time in Flutter is an excellent way to ensure tamper-proof timestamps in your app. You can combine this with your backend or logs to increase trust and prevent misuse.

If your app uses time as a critical value — never rely on DateTime.now() alone.

DEV Community: Pallavii Sharrma

Introducing multi_select_flutter_custom: A Customizable Multi-Select Widget for Flutter Apps

How I Fetched GPS Time in Flutter Using Platform Channels (Android + iOS)