Neue Muster für tolle Apps

Entdecken Sie eine fantastische Sammlung neuer Muster für tolle Apps, darunter Zwischenablagemuster, Dateimuster und App-Muster.

Ganz gleich, was Sie entwickeln – eine Videobearbeitungs-App der nächsten Generation, ein süchtig machendes Wortspiel oder eine zukünftige Online-Netzwerk-App – Sie benötigen immer einige grundlegende Bausteine:

  • Mit der Videobearbeitungs-App kann der Nutzer das bearbeitete Video wahrscheinlich speichern.
  • Vielleicht können Nutzer in Ihrem Spiel ihren Spielfortschritt mit Freunden teilen.
  • In einer Online-App für soziale Netzwerke können Nutzer mit hoher Wahrscheinlichkeit Bilder in einen Beitrag einfügen.

Dies waren nur einige Beispiele für solche Muster. Es gibt noch viele weitere. Aber sie haben alle eines gemeinsam: Es gibt keine universelle Möglichkeit, sie zu realisieren.

Fortschritt teilen

Beispielsweise ist die Web Share API nicht in allen Browsern implementiert. In einigen Fällen müssen Sie also auf einen anderen Ansatz zurückgreifen, z. B. auf die Web Intents von Twitter oder das Kopieren in die Zwischenablage. Das ist der Ansatz, der in Wordle verwendet wird, wenn die Web Share API nicht implementiert ist. Puh, das war knapp:

Wordle 471 6/6

⬛⬛⬛⬛🟨
🟩⬛⬛⬛🟨
🟩🟩🟩⬛⬛
🟩🟩🟩⬛⬛
🟩🟩🟩🟩⬛
🟩🟩🟩🟩🟩

Dateien speichern

Wenn es um das Speichern geht, wird am häufigsten die File System Access API verwendet. Sie erhalten dann eine FileSystemFileHandle, mit der Sie einen echten Speicher-, Bearbeitungs- und Speichervorgang implementieren können. Die zweitbeste Lösung ist, auf eine klassische <a download> zurückzugreifen. Damit können Nutzer zwar auch Daten speichern, aber es werden bei jedem Download neue Dateien erstellt. So landen sie am Ende bei my-video.mp4, my-video (1).mp4, my-video (2).mp4 usw.

Bilder einfügen

Zum Abschluss der Einführungsbeispiele: Nicht alle Browser unterstützen das Einfügen von Bildern in eine Webanwendung. Sie können also auf die Drag-and-drop-API zurückgreifen oder eine Dateiauswahl anzeigen. Das ist nicht so elegant wie die Async Clipboard API, funktioniert aber zumindest.

Die neuen Muster

Die neuen Musterabschnitte sind:

Zwischenablagemuster

Zwischenablagemuster für alles, was mit der Systemzwischenablage zu tun hat, z. B. Kopieren und Einfügen von Inhalten.

Dateimuster

Dateimuster für alles, was mit Dateien und Verzeichnissen zu tun hat, z. B. Speichern, Öffnen, Ziehen und Droppen, Empfangen oder Freigeben.

Muster für Web-Apps

Muster für Webanwendungen für alle Funktionen, die mit erweiterten App-Funktionen zu tun haben, z. B. Bereitstellung von App-Verknüpfungen, regelmäßige Synchronisierung von Daten im Hintergrund, Anzeige von App-Badges und vieles mehr.

Feedback

Ich hoffe, dass diese Muster Ihnen dabei helfen, tolle Apps zu entwickeln. Ich freue mich auf Ihr Feedback. Sie können Feedback geben, indem Sie @ChromiumDev tweeten oder ein Problem melden. In beiden Fällen tagge @tomayac, damit ich es sehe.

Danksagungen

Ich bin Joe Medley dankbar für seine Hilfe beim Überprüfen und Bearbeiten der Muster. Vielen Dank an Pete LePage, Ewa Gasperowicz, Rachel Andrew, Ken Pascal und Matthias Rohmer für ihre technische und organisatorische Unterstützung und die Ermutigung, diesen Job zu bekommen. Das gesamte Musterprojekt wäre ohne die Hilfe der Autoren der einzelnen Muster nicht möglich gewesen: Harry Theodoulou, Tony Conway, Palances Liao, Cecilia Cong, François Beaufort und Joe Medley.