CODEWITHSUNDEEP
flutterflutter-webflutter-local-notification
Jesus Loves You
Jesus Loves You

Reputation: 291

How to check if flutter web app has been installed on the device?

I am using flutter web to make a web app, and I want to know whether the user has actually installed the web app or whether the web app is being run on a browser..

I want to know this so I can allow special features to users that have installed the web app in their devices. (e.g allow local_notifications which is not possible for flutter running on a browser)

Upvotes: 2

Views: 2391

Answers (3)

Hrishikesh Kadam
Hrishikesh Kadam

Reputation: 37342

To extend on Eric Kwok's answer -

import 'dart:html' as html;

bool isPwa() {
  return html.window.matchMedia('(display-mode: standalone)').matches;
}

References -

  1. Window: matchMedia() method
  2. PWA - Detecting display mode
  3. Web app manifests - display

Upvotes: 0

Eric Kwok
Eric Kwok

Reputation: 41

Use JavaScript. Insert this HTML code to your index.html

<script>
function isPwaInstalled() {
    return window.matchMedia('(display-mode: standalone)').matches;
}
</script>

Then in your dart file

import 'dart:js' as js;

bool isPwaInstalled() => js.context.callMethod("isPwaInstalled");

When your PWA app is installed to desktop this method will return true.

Note that the dart:js lib is available only on Flutter web, if you import it on other platforms such as iOS or Android, the compiler will complains about it. To avoid this, see Conditional Import or this blog

Upvotes: 4

Aristidios
Aristidios

Reputation: 2321

Adding a Safari Shortcut from a WebApp to HomeScreen is nothing like installing it. It just opens your WebApp in Safari browser

  • You won't know the difference with normal viewing of your WebApp

You can check the device with platform_detect 2.0.0 package thought but that's about it

Link to package https://pub.dev/packages/platform_detect

Upvotes: 1

Related Questions