PWA / Manifest

[Akai]

Hi und vielen Dank für deine Software.

Als kleine Anmerkung / Ergänzung zu deinem Programm würde ich gern vorschlagen, die Webseite "PWA" ready und diese somit "installierbar" zu machen.

Dazu genügt es Webmanifest bereitzustellen ( https://developer.mozilla.org/de/docs/Web/Manifest )
Vorteile:

• Keine störende URL-Bar auf Mobilgeräten

• App kann zum Homescreen hinzugefügt werden

zum Ausprobieren reicht es in der index.html im Ordner webapp folgende Zeile in den Header zu schreiben

Code: Alles auswählen

<link rel="manifest" href="manifest.webmanifest">

und die Datei manifest.webmanifest im Ordner webapp mit folgendem Inhalt zu erzeugen

Code: Alles auswählen

{
  "name": "OrderSprinter",
  "short_name": "OS",
  "theme_color": "#2196f3",
  "background_color": "#2196f3",
  "orientation": "portrait",
  "scope": "/",
  "start_url": "/pos/webapp/index.html",
  "display" : "fullscreen",
  "icons": [
    {
      "src": "coffee.png",
      "sizes": "256x256",
      "type": "image/png"
    }
  ]
}

Das passende Icon ( hier coffee.png ) muss ebenfalls im Ordner webapp mit den richtigen Abmessungen abgelegt werden.
Danach kann man in Android über den Browser --> Zum Startbildschirm hinzufügen die ganze App "installieren"

Es sollte nun ein Icon auf dem Startbildschirm starten, welcher nach Aufruf die Startseite im Fullscreenmodus lädt

[pichel]

Hallo Akai,

das ist eine gute Anregung. Danke auch für den Beispielcode. Ich werde mir das für die nächste Version anschauen und ggfs. einbauen!

Gruß,

Stefan

[AKai]

Hallo,

freut mich. Wenn du dir das ganze mal direkt ansehen willst melde dich einfach mal kurz bei mir. Ich hab eine Instanz in Web laufen.

vG

[pichel]

Ist schon längst eingebaut und heute mit der Veröffentlichung von 1.6.10 nutzbar...
Danke für die Anregung!!

[andi]

Für iOS Nutzer muss die png im Root Verzeichnis abgelegt sein i.d.R. /var/www/html und den Namen apple-touch-icon.png tragen.

Weitere Infos:
https://developer.apple.com/library/arc ... tions.html