--- title: "Text-in-Sprache für mobile Anwendungen" date: "2017-08-28" categories: - "mobile" - "mobile-development" - "mobiletogether" - "tools" tags: - "mobile-development" - "mobiletogether" - "software-tools" description: Erfahren Sie, wie Altova MobileTogether die Integration von Text-zu-Sprache-Funktionen in plattformübergreifenden mobilen Anwendungen ermöglicht und so die Benutzererfahrung durch sprachgesteuerte Informationen verbessert. --- Status: #blog Tags: #mobile-development #mobiletogether #software-tools Categories: [mobile-development](/blog/de/category/mobile-development.md) | [low-code+no-code](/blog/de/category/low-codeno-code.md) # Text-in-Sprache für mobile Anwendungen Altova MobileTogether unterstützt die Text-in-Sprache-Funktionalität für [plattformübergreifende mobile Anwendungen](https://www.altova.com/de/mobiletogether) und ermöglicht es Entwicklern, Sprachausgabe zu integrieren und eine umfassende, multimediale Benutzererfahrung zu schaffen. Sprache kann vollständig in Text integriert werden, wo immer er in einer App erscheint. Beispielsweise kann eine App wie das Beispiel "Parcel Delivery MobileTogether" erweitert werden, indem die nächste Lieferadresse laut vorgelesen wird – insbesondere, wenn der Fahrer im Verkehr ist! Oder, der Text in Nachrichtenfeldern oder anderen Informationsblöcken kann ebenfalls vom mobilen Gerät vorgelesen werden. Wir haben eine einfache Demo erstellt, um die Funktionalität der Text-zu-Sprache-Technologie für mobile Anwendungen zu testen, und haben dann Text-zu-Sprache-Funktionen in die App für die Paketlieferung integriert. ![Text-in-Sprache für mobile Anwendungen](/blog/images/shutterstock_1615112031.jpg) Diese sehr einfache Demo-App für Text-zu-Sprache bietet folgende vier Funktionen: - Ein Eingabefeld ermöglicht es dem Benutzer, beliebigen Text einzugeben oder einen vordefinierten Standardtext auszuwählen - Ein "Sprechen"-Button lässt den eingegebenen Text vorlesen - Der "Stummschalten"-Button deaktiviert die Stummschaltung, wenn gerade gesprochen wird - Der "Beenden"-Button öffnet ein Dialogfenster mit einer gesprochenen Nachricht und einer Option, die Anwendung zu schließen Hier ist die App, die auf einem Android-Gerät ausgeführt wird, wobei Text in einem Eingabefeld angezeigt wird: ![Text-to-Speech-Funktion für mobile Anwendungen: Eine einfache Demonstration auf einem Android-Gerät](/blog/images/new-android-shot-1-small.png) Der Text in einer App kann aus verschiedenen Quellen stammen, darunter auch die Zwischenablage des mobilen Geräts zum Kopieren und Einfügen. Im folgenden Screenshot hat ein iPhone-Nutzer den Standardtext, der von der Altova-Website kopiert wurde, gelöscht und in das Eingabefeld eingefügt: ![Text-to-Speech-Funktion für mobile Anwendungen: Eine einfache Demonstration auf einem iPhone](/blog/images/replacement-iPhone-shot-small.png) Das Eingabefeld ist so eingestellt, dass mehrere Zeilen Text möglich sind, und das Feld passt sich automatisch an die Größe des eingefügten Textes an. Der in das Eingabefeld eingegebene Text wird in einem Element im Datenbaum der App gespeichert. Durch das Anklicken des "Sprechen"-Buttons wird die in das mobile Gerät integrierte Text-to-Speech-Engine aktiviert, die den Text dann vorliest. Diese einzelne Aktion, die im Dialogfenster "Aktionen" von MobileTogether definiert ist, funktioniert unabhängig davon, ob die App auf einem Android-, iOS- oder Windows-Smartphone, auf einem Windows 10-Computer oder sogar in einem Webbrowser auf einem anderen Gerät ausgeführt wird. ![Text-in-Sprache-Funktion für mobile Anwendungen](/blog/images/text-to-speech-action.png) Wir haben die Funktion "Text-zu-Sprache" direkt den Aktionen für den "Sprechen"-Button zugewiesen, aber sie kann auch in einer Aktionsgruppe verwendet werden. Wir haben eine Aktionsgruppe für den "Beenden"-Button verwendet. Wenn der Benutzer auf "Beenden" klickt, möchten wir sowohl eine Meldungsbox anzeigen als auch die Meldung aussprechen, wie hier auf einem Android-Smartphone zu sehen: ![Text-to-Speech für mobile Anwendungen: Eine einfache Demo. Beendenachricht](/blog/images/exit-message-capture.png) Hier sind die Aktionen, die für den "Beenden"-Button definiert sind: ![Text-to-Speech für mobile Anwendungen – Aktionen für den "Beenden"-Button definiert](/blog/images/message-box-action-group.png) Der Satz "Sind Sie sicher, dass Sie diese App verlassen möchten?" wird im Datenspeicher abgelegt und in XPath-Ausdrücken für die Text-zu-Sprach-Funktion sowie für die darunterliegende Meldungsbox verwendet. Wenn der Benutzer auf "OK" klickt, wartet eine Schleifenfunktion, bis die Text-zu-Sprache-Funktion abgeschlossen ist, bevor die Anwendung beendet wird. ### Aktualisierung der App für die Paketlieferung mit Text-zu-Sprache-Funktion für mobile Anwendungen Die Beispielanwendung für die Paketlieferung wurde ursprünglich entwickelt, um zu zeigen, wie man mit Geodaten in MobileTogether arbeitet. In dieser Simulation ist der Benutzer ein Fahrer eines Lieferdienstes, der Pakete von einem Lager in New Jersey an verschiedene Ziele in New York City zustellen muss. Wenn ein neues Ziel zugewiesen wird, zeigt die App eine Lieferseite an, die die Adresse und die aktuelle Entfernung zum Ziel enthält, wie in diesem Screenshot aus dem MobileTogether-Simulator für ein Android-Smartphone zu sehen ist: ![Beispielanwendung für die Zustellung von Paketen, wie sie im MobileTogether-Simulator angezeigt wird](/blog/images/Delivery-Page-in-simulator.png) Wir möchten eine Text-zu-Sprache-Funktion für jedes neue Ziel und jede neue Entfernung hinzufügen, während der Fahrer unterwegs ist. Zunächst können wir eine neue Benutzereinstellung auf der Konfigurationsseite hinzufügen, wobei ein Schalter zur Aktivierung oder Deaktivierung der Text-to-Speech-Funktion verwendet wird. Hier ist die überarbeitete Konfigurationsseite, die auf einem iPhone angezeigt wird: ![Mobile Demo-App für Paketlieferungen: Konfigurationsseite, wie sie im Simulator angezeigt wird](/blog/images/new-configuration.png) Auf der Seite "Zustellung" im Designer können wir sehen, dass sowohl das Ziel, der aktuelle Standort als auch die Entfernung zum Ziel mithilfe von XPath-Ausdrücken ermittelt werden: ![Mobile-Demo-App für Paketlieferungen. Ansicht der Lieferseite im MobileTogether Designer](/blog/images/Delivery-Page-in-Designer.png) Diese gleichen Ausdrücke können Text-in-Sprache-Funktionen zugewiesen werden. Zunächst haben wir eine Aktionsgruppe erstellt, um jedes neue Ziel auszusprechen. Der im Folgenden blau hervorgehobene Bereich zeigt die Text-in-Sprache-Funktion. Wir haben die String-Funktion "concat" verwendet, um einige zusätzliche Wörter hinzuzufügen und so eine Gesprächsphrase zu erstellen, die die Adresse und die Startdistanz enthält: ![Mobile Demo-App für Paketlieferungen – Eine Funktion ermöglicht die mündliche Ansage des nächsten Zielorts](/blog/images/destination-action-group.png) Während der Fahrer sich dem Zielort nähert, werden die Standortdaten regelmäßig aktualisiert und die verbleibende Entfernung zum Zielort neu berechnet. Wir haben eine zweite Aktionsgruppe erstellt, um die neue Entfernung auszusprechen: ![Text-in-Sprache-Funktion für mobile Anwendungen – Beispiel](/blog/images/new-distance-action-group.png) Die Schleife am Anfang ähnelt der Funktionalität, die für den "Beenden"-Button unserer Demo-App beschrieben wurde. In diesem Fall verhindert sie, dass die neue Text-in-Sprache-Funktion die vorherige unterbricht, falls diese noch nicht abgeschlossen ist. Andernfalls könnte es passieren, dass ein Update der Standortinformationen erfolgt, bevor die vorherige Sprachausgabe beendet wurde. Unsere Text-in-Sprache-Aktionen müssen während der Ausführung der App aufgerufen werden. Zunächst können wir die Aktionsgruppe "Vocalize Next Destination" in die Sequenz der Aktionen für "OnPageLoad" für die Seite "Delivery" einfügen: ![Mobile Demo-App für Paketlieferungen – Platzierung der ersten Aktionsgruppe für das Zielort](/blog/images/new-page-load-actions.png) Die Seite "Zustellung" wird einmalig beim ersten Zustellvorgang geladen. Bei den nachfolgenden Zustellvorgängen können wir die Aktionsgruppe zur bestehenden Aktionsgruppe "Weiter zur nächsten Destination" hinzufügen: ![Mobile Demo-App für Paketlieferungen – Platzierung einer Aktionsleiste für das nächste Ziel](/blog/images/insert-first-vocalization.png)   Wir müssen jetzt nur noch die Aktionsgruppe "Vocalize New Distance" in die Aktionen "OnPageRefresh" für die Lieferseite einfügen ![Mobile Demo-App für Paketlieferungen – Aktualisierung der Funktionen auf der Seite "Lieferung"](/blog/images/new-page-refresh-actions.png) Ob die App im MobileTogether-Simulator oder auf einem mobilen Gerät ausgeführt wird, der Fahrer erhält gesprochene Informationen und muss nicht vom Straßenbild ablenken! Sie können selbst Text-in-Sprache-Funktionen für mobile Anwendungen erstellen, indem Sie [den kostenlosen MobileTogether Designer herunterladen](https://www.altova.com/de/download/mobiletogether.html). Dieser wird mit integrierter Hilfe, Tutorials und vielen Beispielanwendungen, einschließlich einer Anwendung für die Zustellung von Paketen, geliefert. Die in diesem Artikel beschriebenen Lösungen können unter folgender Adresse heruntergeladen werden: [https://github.com/altova/MobileTogether-TTS](https://github.com/altova/MobileTogether-TTS) Öffnen Sie eine der .mtd-Dateien im MobileTogether Designer, um zu untersuchen, wie sie erstellt wurde, und führen Sie sie dann im MobileTogether-Simulator aus. Verbinden Sie sich mit dem App-Store für Ihr Gerät und [laden Sie die MobileTogether Mobile App herunter.](https://www.altova.com/de/download/mobiletogether.html) Verbinden Sie sich anschließend mit dem MobileTogether Demo-Server, um weitere Demo-Anwendungen auszuführen. Mit der installierten MobileTogether Mobile App können Sie auch die Text-to-Speech-Funktion für mobile Anwendungen auf Ihrem eigenen Gerät testen, indem Sie den MobileTogether Designer als Server verwenden.