O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Windows Store Apps entwickeln mit HTML5 und JavaScript

Book Description

Mit diesem Buch erstellen Sie eine komplexe Windows Store-App mit JavaScript und HTML5 - Eigenständige Abschnitte erläutern Ihnen dabei die Konzepte und Hintergründe.

Table of Contents

  1. Einleitung
    1. 0.1 Windows 8 Apps mit HTML5 und JavaScript
    2. 0.2 Die Entwicklungsumgebung
      1. Tools und SDK herunterladen
    3. 0.3 Korrekturen und Kommentare
  2. 1. Die Plattform Windows 8 im Überblick
    1. 1.1 Vier Trends für die Zukunft der IT
      1. Gerätevielfalt
      2. Ein neues Verständnis von Mobilität
      3. Der Siegeszug von Touch
      4. Ein neues Verständnis von Software – Apps
    2. 1.2 Architektur der Plattform
      1. Der Applikationslebenszyklus
      2. Zugriff auf WinRT-APIs – ein bunter Technologiemix
  3. 2. Windows 8-Design: Prinzipien und Richtlinien
    1. 2.1 Eine kurze Geschichte der Benutzeroberflächen
    2. 2.2 Eckpfeiler einer beeindruckenden Windows 8-App
      1. Die Metro-Designprinzipien
        1. Fünf Prinzipien für Windows Phone
        2. Fünf Prinzipien für Windows 8-Apps
      2. Grundbausteine: Inhalt, Layout, Interaktion und Navigation
        1. Content before Chrome – der Inhalt im Vordergrund
        2. Layout – Struktur, Typographie und schicke Optik
        3. Interaktionen oder »der Ort, an dem Windows 8 Buttons versteckt«
        4. Navigation: Informationshierarchie und Orientierung für den Nutzer
      3. Fast and Fluid
        1. Sinnvolle Animationen
        2. Design für ergonomische Touch-Bedienung
      4. Andocken und Skalieren
        1. Vielfältige Auflösungen und Formfaktoren
      5. Nutzung der richtigen Verträge
        1. Freigabe-/Teilen-Vertrag
        2. Vertag für Einstellungen
        3. Vertrag für Suche
        4. Vertrag für »Wiedergeben auf«
        5. Vertrag für Dateiauswahl
        6. Vertrag für die Aktualisierung zwischengespeicherter Dateien
      6. Investition in eine großartige Kachel
        1. Standardkachel
        2. Vorschaukachel
        3. Ziffern und Signale
      7. Ein Gefühl von Lebendigkeit und Verbundenheit
        1. Live Tiles
        2. Notifications
        3. Lock Screen Notifications
      8. Zusammenarbeit mit der Cloud
  4. 3. Ein Wiedersehen mit JavaScript
    1. 3.1 Übersicht und Begriffsklärung
    2. 3.2 Syntax und Typen
      1. Zahlen (Numbers)
      2. Strings
      3. Boolean
      4. null und undefined
      5. Kontrollstrukturen: if ... else, while, for
        1. if ... else und switch: bedingte Anweisungen und Fallunterscheidung
        2. while und for: Wiederholung bei Bedingung
      6. Objekte
        1. Arrays
        2. Funktionen
        3. Prototypen
        4. Die mysteriöse Eigenschaft __proto__
  5. 4. HTML5: Aus dem Web in die App-Entwicklung
    1. 4.1 HTML
      1. Asynchrone Skriptausführung
      2. Web Worker
      3. Channelnachrichten (Web Messaging)
      4. AppCache: Offline-Modus für Web-Applikationen
        1. Manifest-Datei
        2. Arbeit mit dem applicationCache-Objekt
      5. Drag & Drop
      6. Bessere Formulare mit Überprüfung und neuen Input-Attributen
        1. Neue Eingabetypen, neues Progress-Element
        2. Neue Attribute
        3. Formularüberprüfung
      7. Arbeit mit Sensoren, Sockets und Dateien
    2. 4.2 CSS
      1. Grid-Layout
      2. Flexbox-Layout
        1. Flexibilität von untergeordneten Elementen
      3. Geräteanpassungen mit Media Queries und Viewports
  6. 5. Das Grundgerüst einer App: Die Vorlagen
    1. 5.1 Grober Überblick und erster Kontakt: Die Vorlagen
      1. Das blanke Skelett: Die Vorlage »Leere App«
        1. Das Package Manifest oder die »Patientenakte« für Apps
        2. Die App-Startseite »default.html«
        3. Das App-Startskript »default.js«
      2. Intelligente Navigation mit der Vorlage »Navigations-App«
      3. Typischer Kachel-Look mit »Raster-App«
        1. Der Übersichts-Hub: groupedItems
        2. Eine Gruppe in der Übersicht: groupDetail
        3. Die Elementeinzelansicht: itemDetail
        4. Die Quelle der Beispieldaten: data.js
      4. Typischer Kachel-Look und Übersicht mit »Geteilte App«
        1. Der Übersichts-Hub: items
        2. Eine Gruppenübersicht mit Elementeinzelansicht: split
      5. Unbeugsames Layout mit der »App mit festem Layout«
    2. 5.2 App zum Mitentwickeln: Das App-Fundament
      1. Schritt 1: Erstellen und Einrichten des neuen Projekts
      2. Schritt 2: Kacheln, Titel, Splash Screen und Farben
  7. 6. Ein Baukasten für Interfaces: WinJS-Controls
    1. 6.1 Die Basiscontrols im Überblick
      1. AppBar und AppBarCommands
      2. ListView
      3. SemanticZoom
    2. 6.2 App zum Mitentwickeln: Controls
      1. Schritt 1: Aufräumarbeiten
      2. Schritt 2: Hinzufügen des ListView
      3. Schritt 3: Erweitern des ListView um eine Element-Vorlage
      4. Schritt 4: Hinzufügen einer AppBar
  8. 7. Umgang mit Daten: Bindung, Speicherung und Verwaltung
    1. 7.1 Datenbindung
      1. Einfache Daten- und Styling-Bindung
      2. Bindung von komplexen Objekten
      3. Arbeit mit Elementvorlagen
    2. 7.2 Zugriff auf Daten und Dateien
      1. Zugriff auf Netzwerkressourcen
        1. Transfer kleiner Datenmengen mit WinJS.xhr() und XMLHttpRequest
        2. Background Transfer
      2. Zugriff auf das Dateisystem
        1. Nutzung des File Pickers
        2. Verfolgung und Verwaltung von genutzten Dateien und Ordnern
        3. Lesen und Schreiben von Dateien
    3. 7.3 Verwaltung von App-Daten
      1. Verwaltung von App-Einstellung mit ApplicationData.localSettings
      2. Verwaltung von App-Daten mit ApplicationData.localFolder
      3. Synchronisierung der App-Daten mit der Microsoft Cloud
    4. 7.4 App zum Mitentwickeln: Daten
      1. Schritt 1: Erstellen einer Klasse zum Laden von RSS-Daten
      2. Schritt 2: Binden des ListView
      3. Schritt 3: Erweitern der Elementvorlage
      4. Schritt 4: Aktivierung des Aktualisieren-Buttons
      5. Schritt 5: Erstellung einer Detailseite für einzelne Artikel
  9. 8. Optimierung für verschiedene Ansichten
    1. 8.1 Skalierung und unterschiedliche Auflösungen
      1. Flüssige Layouts als Standard
      2. Pixelskalierung: Ein perfektes Layout für jede DPI-Dichte
    2. 8.2 Snap View & Fill View
      1. Snap View, Fill View, Full View und Media Queries
      2. View States und Event Listener
    3. 8.3 Geräteorientierung
    4. 8.4 Semantic Zoom
      1. SemanticZoom-Implementation mit ListView-Gruppen
    5. 8.5 App zum Mitentwickeln: Optimierung für verschiedene Ansichten
      1. Schritt 1: SemanticZoom implementieren
      2. Schritt 2: Optimierung für verschiedene Ansichten
  10. 9. Verträge: Integration der App in das Betriebssystem
    1. 9.1 Vertrag für die Einstellungen
    2. 9.2 Vertrag für die Suche
      1. Bereitstellung eines Datenkorpus
      2. Filter für die Suchergebnisse
      3. Navigation zum gewählten Element
      4. Handling von leeren Suchanfragen
      5. Suchvorschläge implementieren
        1. Nutzung des Events onsuggestionsrequested
        2. Nutzung von LocalContentSuggestionSettings
    3. 9.3 Vertrag für »Teilen«
      1. Daten teilen
        1. Teilen von formatiertem und unformatiertem Text
        2. Teilen von einem Link
        3. Teilen von HTML
        4. Teilen von Bildern
        5. Teilen von Dateien
        6. Teilen eigener Datentypen
        7. Teilen mit Pull-Operationen
      2. Daten empfangen
        1. Empfangen von formatiertem und unformatiertem Text
        2. Empfangen von einem Link
        3. Empfangen von HTML
        4. Empfangen von Bildern
        5. Empfangen von Dateien
        6. Empfangen eigener Datenformate
        7. Bestätigung des Empfangs der Daten
    4. 9.4 Vertrag »Gerät automatisch wiedergeben«
    5. 9.5 Vertrag »Einstellungen für Druckaufgaben«
    6. 9.6 Vertrag für File Picker
      1. Integration in »Datei öffnen« (Dateiöffnungsauswahl)
      2. Integration in »Datei speichern« (Dateispeicherungsauswahl)
      3. Der Cached File Updater: Daten aktuell halten
    7. 9.7 App zum Mitentwickeln: Verträge und Systemintegration
      1. Schritt 1: Teilen von Artikeln ermöglichen
      2. Schritt 2: Erstellen einer Radiofunktion
      3. Schritt 3: Streaming der Radiosender ermöglichen
  11. 10. App-Lebenszyklus: Multitasking und Hintergrundaufgaben
    1. 10.1 Aktivierung
      1. Registrierung als Handler für einen Dateitypen (Dateitypzuordnung)
        1. Deklaration im App Manifest
        2. Entgegennahme der Datei
      2. Registrierung als Handler für ein Protokoll
        1. Deklaration im App Manifest
        2. Entgegennahme der URL
    2. 10.2 Suspendierung und Fortsetzung
      1. Der oncheckpoint-Event: Letzte Aktionen vor Suspendierung
      2. Der Resume-Event: App wieder zum Leben erwecken
    3. 10.3 Background Tasks: Kleine Arbeiter im Hintergrund
      1. Erstellung eines Background Tasks
      2. Deklaration des Tasks im App Manifest
      3. Registrierung des Background Tasks
        1. Background Task bei Systemereignissen ausführen
        2. Background Task mit Zeitgeber (Timer) auslösen
        3. Background Task mit Push Notification auslösen
      4. Wiedergabe von Audio im Hintergrund
    4. 10.4 App zum Mitentwickeln: Werkeln im Hintergrund
      1. Schritt 1: Erstellung eines Background Tasks
      2. Schritt 2: Radio für Hintergrundaudio vorbereiten
  12. 11. Kacheln, Signale und Benachrichtigungen
    1. 11.1 Kacheln, Live-Kacheln und Signale
      1. Die Standardkachel
      2. Kachelupdates: Kachel in Live-Kachel verwandeln
        1. Die Kachelvorlagen
        2. Kachelvorlage öffnen und mit Inhalten füllen
        3. Beide Kachelformate in einem Update zusammenfassen
        4. Kachelvorlage als Benachrichtigung an das System übergeben
        5. Geplante und regelmäßige Kachelbenachrichtigungen
      3. Signalupdates: Kleine Anstecker für Kacheln
        1. Regelmäßige Signalupdates
        2. Geplante Signalupdates
      4. Sekundärkacheln: Mehr Kacheln für die App
        1. Erstellen, Löschen und Aktualisieren von Sekundärkacheln
        2. Kachelupdates für Sekundärkacheln
        3. Signalupdates für Sekundärkacheln
    2. 11.2 Popupbenachrichtungen (Toast Notifications)
      1. Deklaration der Toastfähigkeit im App Manifest
      2. Versenden von Popupbenachrichtigungen
        1. Vorbereitung einer Toast-Vorlage
        2. Definition von Sichtbarkeitsdauer und Klingelton
        3. Parameterobjekt für die App-Aktivierung definieren
        4. Auslieferung der Popupbenachrichtigung
    3. 11.3 Sperrbildschirm
      1. Deklaration der Sperrbildschirm-Unterstützung
      2. Anzeige von Informationen auf dem Sperrbildschirm
      3. Nutzer um einen Platz auf dem Sperrbildschirm bitten
    4. 11.4 Benachrichtigungen via Push versenden
      1. Registrierung beim Windows Push Notification Service
        1. Korrekte Identität im App Manifest
        2. Authentifizierungsdaten für den Notification Service
        3. Authentifizierung des Backends: Anforderung eines Access Tokens
      2. Notification Channel erstellen
      3. Senden einer Push Notification
      4. Empfangen einer Push Notification in der laufenden App
    5. 11.5 App zum Mitentwickeln: Live-Kachel mit Uhranzeige, Pinnen von Artikeln
      1. Schritt 1: Erweitern der oberen AppBar um weiteren Button
      2. Schritt 2: Ein Seitensteuerfragment für die Uhr erstellen
      3. Schritt 3: Sperrbildschirm-Unterstützung deklarieren
      4. Schritt 4: Logik für das Uhren-Seitensteuerfragment
      5. Schritt 5: Einrichtung des Background Tasks
      6. Schritt 6: Anpinnen der Artikel ermöglichen
  13. 12. Sensoren und Medien
    1. 12.1 Bewegungs- und Orientierungssensoren
      1. Accelerometer (Lineare Beschleunigung)
      2. Gyrometer (Winkelbeschleunigung)
      3. Kompass
      4. Inklinometer
    2. 12.2 Lichtsensoren
    3. 12.3 Positionssensoren (GPS)
      1. Standortabfrage mit dem Geolocation API (HTML5)
      2. Abfrage mit Windows 8 Geolocation
    4. 12.4 Aufnahme von Audio und Video
      1. Aufnahme von Foto und Video mit CameraCaptureUI
      2. Nutzung der MediaCapture-Schnittstelle für Audio und Video
    5. 12.5 Wiedergabe von Mediendateien
      1. Umgang mit Bilddateien
        1. Decodierung und Auslesen von Metainformation
        2. Codierung und Bearbeitung von Bildern
      2. Umgang mit Audio- und Videodateien
        1. Audio und Video: Wiedergabe in Echtzeit
        2. Audio und Video: Auswahl eines Wiedergabegeräts
        3. Audio und Video: Integration in die Mediensteuerung
        4. Audio und Video: Einschlafen des Displays verhindern
        5. Video: Verwendung von Filtern und Videostabilisierung
        6. Video: Automatischer Zoom für unpassende Seitenverhältnisse
    6. 12.6 App zum Mitentwickeln: Sensoren und Medien
      1. Schritt 1: Integration des Players in die Mediensteuerung
      2. Schritt 2: Ein Cockpit für Sensoren
  14. 13. Globalisierung und Lokalisierung
    1. 13.1 Texte und Ressourcen in unterschiedlichen Sprachen bereitstellen
      1. Ressourcen mit Qualifikationsmerkmalen versehen
      2. String-Dateien für einfache Übersetzungen
    2. 13.2 Unterschiedliche Formate berücksichtigen
      1. Datum und Uhrzeit
      2. Zahlen und Währungen
      3. Auslesen der aktuellen Nutzerkonfiguration
    3. 13.3 Multilingual App Toolkit
      1. Testen der Globalisierung mit Pseudosprache
      2. Übersetzungen erstellen
  15. 14. Monetarisierung
    1. 14.1 Der Windows Store
      1. Businessmodelle
        1. Einmaliger Kauf und Testversionen
        2. In-App-Purchases: Kaufangebote in der App und Abonnementmodelle
        3. Eigene Bezahl-Engines
        4. Werbung
    2. 14.2 Enterprise Sideloading: App ohne Store
  16. Stichwortverzeichnis
  17. Copyright