9.3 KiB
9.3 KiB
TaskMate PWA zu APK - Vollständige Anleitung
Überblick
Diese Anleitung zeigt, wie Sie aus der TaskMate PWA eine Android APK erstellen, die im Google Play Store veröffentlicht werden kann.
Voraussetzungen
- TaskMate PWA ist online verfügbar (https://taskmate.aegis-sight.de)
- Web App Manifest und Service Worker sind implementiert
- PWA Icons in allen erforderlichen Größen vorhanden
Methode 1: PWABuilder (Einfachste Methode)
Schritt 1: PWA Score prüfen
- Öffnen Sie https://www.pwabuilder.com
- Geben Sie Ihre PWA URL ein:
https://taskmate.aegis-sight.de - Klicken Sie auf "Start"
- PWABuilder analysiert Ihre App und zeigt den Score
Schritt 2: Package für Android generieren
- Klicken Sie auf "Package for stores"
- Wählen Sie "Android"
- Konfigurieren Sie die Einstellungen:
- Package ID:
de.aegissight.taskmate - App Name: TaskMate
- Display Mode: Standalone
- Orientation: Any
- Fallback URL:
https://taskmate.aegis-sight.de
- Package ID:
Schritt 3: Erweiterte Optionen
- Signing Key:
- "None" für Test-APK
- "New" für Play Store (speichern Sie den Key sicher!)
- Maskable Icon: Upload des 512x512 Icons
- Splash Screen: Automatisch generiert
- Settings:
- Enable notifications: Yes
- Location permissions: No
- WebView settings: Standard
Schritt 4: Download und Test
- Klicken Sie auf "Download"
- Extrahieren Sie die ZIP-Datei
- Die APK befindet sich im Ordner
- Installieren Sie zum Testen auf einem Android-Gerät
Methode 2: Bubblewrap (Für Entwickler)
Installation
# Node.js und npm müssen installiert sein
npm install -g @bubblewrap/cli
Projekt initialisieren
# Neues Verzeichnis erstellen
mkdir taskmate-android
cd taskmate-android
# Bubblewrap init
bubblewrap init --manifest https://taskmate.aegis-sight.de/manifest.json
Konfiguration (twa-manifest.json)
{
"packageId": "de.aegissight.taskmate",
"host": "taskmate.aegis-sight.de",
"name": "TaskMate",
"launcherName": "TaskMate",
"display": "standalone",
"themeColor": "#000000",
"navigationColor": "#000000",
"backgroundColor": "#000000",
"enableNotifications": true,
"startUrl": "/",
"iconUrl": "https://taskmate.aegis-sight.de/assets/icons/icon-512x512.png",
"maskableIconUrl": "https://taskmate.aegis-sight.de/assets/icons/icon-512x512.png",
"appVersion": "1.0.0",
"signingKey": {
"alias": "taskmate-key",
"path": "./taskmate-key.keystore"
},
"splashScreenFadeOutDuration": 300,
"enableSiteSettingsShortcut": false,
"shortcuts": [
{
"name": "Neue Aufgabe",
"shortName": "Neue Aufgabe",
"url": "/?action=new-task",
"chosenIconUrl": "https://taskmate.aegis-sight.de/assets/icons/add-task-96x96.png"
}
],
"fallbackType": "customtabs",
"webManifestUrl": "https://taskmate.aegis-sight.de/manifest.json"
}
Build-Prozess
# Keystore erstellen (nur einmal)
bubblewrap build --skipPwaValidation
# APK erstellen
bubblewrap build
# Signed APK für Play Store
bubblewrap build --skipPwaValidation
Methode 3: Android Studio mit TWA
Projekt Setup
- Erstellen Sie ein neues Android-Projekt
- Minimum SDK: API 19 (Android 4.4)
- Wählen Sie "No Activity"
Dependencies (app/build.gradle)
dependencies {
implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.5.0'
}
AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="de.aegissight.taskmate">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:theme="@style/Theme.AppCompat.Light.NoActionBar">
<activity
android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
android:exported="true"
android:label="@string/app_name">
<meta-data
android:name="android.support.customtabs.trusted.DEFAULT_URL"
android:value="https://taskmate.aegis-sight.de" />
<meta-data
android:name="android.support.customtabs.trusted.STATUS_BAR_COLOR"
android:resource="@color/colorPrimary" />
<meta-data
android:name="android.support.customtabs.trusted.NAVIGATION_BAR_COLOR"
android:resource="@color/colorPrimary" />
<meta-data
android:name="android.support.customtabs.trusted.SPLASH_IMAGE_DRAWABLE"
android:resource="@drawable/splash" />
<meta-data
android:name="android.support.customtabs.trusted.SPLASH_SCREEN_FADE_OUT_DURATION"
android:value="300" />
<meta-data
android:name="android.support.customtabs.trusted.DISPLAY_MODE"
android:value="standalone" />
<meta-data
android:name="android.support.customtabs.trusted.SCREEN_ORIENTATION"
android:value="unspecified" />
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
<intent-filter android:autoVerify="true">
<action android:name="android.intent.action.VIEW"/>
<category android:name="android.intent.category.DEFAULT"/>
<category android:name="android.intent.category.BROWSABLE"/>
<data
android:scheme="https"
android:host="taskmate.aegis-sight.de"/>
</intent-filter>
</activity>
<service
android:name="com.google.androidbrowserhelper.trusted.DelegationService"
android:enabled="true"
android:exported="true">
<intent-filter>
<action android:name="android.support.customtabs.trusted.TRUSTED_WEB_ACTIVITY_SERVICE"/>
<category android:name="android.intent.category.DEFAULT"/>
</intent-filter>
</service>
</application>
</manifest>
Digital Asset Links
Erstellen Sie auf Ihrem Server die Datei:
https://taskmate.aegis-sight.de/.well-known/assetlinks.json
[{
"relation": ["delegate_permission/common.handle_all_urls"],
"target": {
"namespace": "android_app",
"package_name": "de.aegissight.taskmate",
"sha256_cert_fingerprints": [
"YOUR_APP_SIGNING_KEY_FINGERPRINT"
]
}
}]
Icon-Generierung
Falls Icons fehlen, nutzen Sie diese Tools:
- Android Asset Studio: https://romannurik.github.io/AndroidAssetStudio/
- Maskable.app: https://maskable.app/editor
Benötigte Größen:
- 48x48, 72x72, 96x96, 144x144, 192x192, 512x512
- Adaptive Icons für Android 8+
Testing
Lokaler Test
- Aktivieren Sie "Unbekannte Quellen" in Android-Einstellungen
- Übertragen Sie die APK aufs Gerät
- Installieren und testen
Play Console Test Track
- Laden Sie die APK in die Google Play Console
- Erstellen Sie eine interne Testversion
- Fügen Sie Tester hinzu
- Testen Sie Installation und Updates
Veröffentlichung im Play Store
Vorbereitung
- Google Play Developer Account ($25 einmalig)
- App-Beschreibung und Screenshots
- Datenschutzerklärung
- Altersfreigabe-Fragebogen
Store Listing
- Titel: TaskMate - Aufgabenverwaltung
- Kurzbeschreibung: Einfache und effiziente Aufgabenverwaltung mit Kanban-Board
- Kategorie: Produktivität
- Screenshots: Mindestens 2, idealerweise 8
APK Upload
- Signierte APK erstellen
- In Play Console hochladen
- Rollout starten (gestaffelt empfohlen)
Wartung und Updates
Version Updates
- Erhöhen Sie
versionCodeundversionName - Erstellen Sie neue APK
- Laden Sie in Play Console hoch
- Beschreiben Sie Änderungen
PWA Updates
- Service Worker Updates werden automatisch geladen
- Manifest-Änderungen erfordern App-Update
- Cache-Versionierung beachten
Häufige Probleme
"Not a valid PWA"
- Prüfen Sie HTTPS
- Validieren Sie manifest.json
- Service Worker muss registriert sein
"Digital Asset Links validation failed"
- assetlinks.json muss öffentlich erreichbar sein
- SHA256 Fingerprint muss stimmen
- Content-Type: application/json
Icon-Probleme
- Alle Größen müssen vorhanden sein
- PNG-Format erforderlich
- Transparenz vermeiden für adaptive Icons
Empfehlungen
- Verwenden Sie PWABuilder für den Anfang
- Bubblewrap für mehr Kontrolle
- Android Studio nur bei speziellen Anforderungen
- Testen Sie auf verschiedenen Geräten
- Behalten Sie die Keystore-Datei sicher auf!
Nächste Schritte
- Icons generieren (falls noch nicht vorhanden)
- PWABuilder Test durchführen
- Test-APK erstellen und installieren
- Bei Erfolg: Play Store Konto einrichten
- Produktions-APK mit Signing Key erstellen
- Im Play Store veröffentlichen
Bei Fragen oder Problemen können Sie die offizielle Dokumentation konsultieren: