Schritt ausdrucken

In diesem Artikel erfahren Sie:

• Wie Sie alle Ihre Daten ausdrucken, wenn eine App abgeschlossen ist
• Wie Sie einen Schritt so gestalten, dass er für den Druck richtig formatiert ist
• Wie Sie das Drucken benutzerdefinierter Widgets in einem Schritt ermöglichen

Auch wenn Ihr Unternehmen damit beginnt, papierbasierte Prozesse zu automatisieren und Formulare in Ihrer Fertigung zu digitalisieren, müssen Sie möglicherweise weiterhin die Ergebnisse verschiedener Vorgänge ausdrucken, um Daten ordnungsgemäß weiterzugeben.

App-Schritte drucken

Wenn Sie Daten aus einer Tulip-App in Echtzeit ausdrucken (oder als lokales PDF speichern) möchten, müssen Sie vier Schritte ausführen:

1. Konfigurieren Sie einen Schritt (oder mehrere Schritte) entsprechend der gewünschten Druckgröße.
2. Entwerfen Sie einen Schritt, der beim Drucken übersichtlich und verständlich aussieht.
3. Fügen Sie eine Schaltfläche mit dem Trigger „Drucken“ hinzu.
4. Passen Sie die Druckeinstellungen so an, dass der Schritt so viel Platz wie möglich auf der Seite einnimmt.

Mit der Trigger-Aktion „Schritte drucken“ können Sie entweder einen einzelnen Schritt oder eine gesamte Schrittgruppe auf einmal drucken. Jeder Schritt wird auf einer separaten Seite gedruckt.

Konfigurieren Sie die Schrittauflösung

Zunächst erstellen viele Benutzer gerne eine Schrittgruppe namens „Berichte“ und fügen dieser Schrittgruppe alle Schritte hinzu, die sie auf einmal drucken möchten.

Das sieht folgendermaßen aus:

Anschließend ist es wichtig, die Schritte in dieser Gruppe entsprechend zu konfigurieren, damit sie in der gewünschten Auflösung gedruckt werden. Navigieren Sie in der App im Kontextbereich zur Registerkarte „Schritt“ und wählen Sie „Schrittauflösung“ aus.

Wählen Sie im Seitenbereich die gewünschte Auflösung aus, die dem gewünschten Papierformat entspricht.

Bei PDF-Dateien ist „Letter im Hochformat“ oft die beste Wahl. Durch die Anpassung an das Papierformat wird sichergestellt, dass die App-Ansicht als ganze Seite ausgedruckt wird.

Einen Schritt entwerfen

Möglicherweise verwenden Sie in Ihrer App ein Basis-Layout mit vielen Volltonfarben. Das eignet sich zwar gut, um einem Bediener Informationen zu vermitteln, aber Sie möchten wahrscheinlich keine Druckertinte für farbenfrohe Schritte verschwenden.

Entfernen Sie stattdessen alle Elemente des Basislayouts aus den Berichtsschritten und konzentrieren Sie sich stattdessen auf Text.

Hier ist ein Beispiel für einen Schritt, der für den Druck optimiert ist:

Dieser Schritt enthält 7 Datenelemente aus der App sowie 5 Testergebnisse. Die Schaltflächen „Drucken“ und „Menü“ oben links und unten rechts haben einen weißen Hintergrund, sodass für sie keine farbige Tinte benötigt wird.

Es nutzt die folgenden Funktionen innerhalb von Tulip:

• Raster-Widget zum Erstellen eines einfachen visuellen Layouts
• Variabler Text zum Einbetten der Werte verschiedener Variablen in den Schritt
• Schaltfläche mit benutzerdefinierter Farbgebung

Hinzufügen einer Druck-Schaltfläche

Eine Druck-Schaltfläche erfordert eine Trigger-Aktion. Sie wird oft mit dem Abschluss der App kombiniert, dies kann jedoch nicht im selben Trigger erfolgen. Sie müssen eine separate Schaltfläche erstellen, um den Abschluss der App auszulösen.

Hier ist also ein Beispiel für einen Trigger, der es einem Bediener ermöglicht, einen Schritt zu drucken und zum Schritt nach der Schrittgruppe „Berichte“ zu wechseln, wo er die App abschließen kann:

• „Schritte drucken“ „Berichte“
• „Zum Schritt springen“ „Weiter“

Sie können die Schaltfläche „Drucken“ auch in einem normalen Schritt platzieren und damit eine ganze Gruppe von Schritten drucken, ohne diese dem Bediener überhaupt anzuzeigen.

Dadurch werden die Standard-Druckoptionen des Computers geöffnet.

Druckeinstellungen anpassen

Druckdialog

Bediener nutzen den Tulip Player auf Bildschirmen aller Größen. Daher müssen Sie auf jedem Computer, auf dem der Tulip Player läuft und auf dem ein Schritt gedruckt oder gespeichert werden soll, Folgendes tun:

1. Passen Sie das Seitenlayout an die Auflösung der zu druckenden Schritte an. Beispiel: „Letter“ im Hochformat.
2. Speichern Sie diese Einstellungen lokal als „Voreinstellung“, damit Bediener sie in Zukunft einfach auswählen können:

Um zu überprüfen, ob die App korrekt gedruckt wird, sollten Sie die Vorschau-Option im Druckdialog verwenden, um vor dem Drucken zu sehen, wie die App aussehen wird.

Felder in einer PDF-Datei ausfüllen

Sie können auch ein „ausgefülltes“ PDF ausdrucken, indem Sie das PDF in einen Schritt einbetten und anschließend Widgets für variablen Text an den entsprechenden Stellen über das PDF legen. Der Schritt wird dann so gedruckt, wie er im Tulip Player angezeigt wird.

So geht’s:

1. Betten Sie eine PDF-Datei in einen Schrittein, der auf die entsprechende Auflösung angepasst ist.
2. Fügen Sie „Variable Text“-Widgets über den entsprechenden Feldern der PDF-Datei ein. Diese werden dynamisch ausgefüllt, wenn die App im Player verwendet wird.
3. Wenn das PDF mehrere Seiten umfasst, fügen Sie in Tulip für jede Seite des PDFs einen neuen Schritt hinzu und wiederholen Sie den oben beschriebenen Vorgang.

Speichern Sie die App-Daten lokal als PDF

Der Druckdialog ist zudem die beste Möglichkeit, App-Daten auf einem lokalen Computer als PDF zu speichern. Anstatt im Systemdialog auf „Drucken“ zu klicken, wählen Sie „Als PDF speichern“, um den Schritt und die Live-Daten in einer lokalen Datei zu speichern.

Technische Hinweise

Regeln, nach denen bestimmte App-Inhalte beim Drucken nicht gut funktionieren.

• Alle Verweise auf den „aktuellen Schritt“ in einem Text-Widget vom Typ „Variable“ funktionieren nur bei dem Schritt, der geöffnet ist, wenn die Schaltfläche „Drucken“ angeklickt wird.
• „Bei Schritt-Eingabe“-Trigger werden bei gedruckten Schritten nicht ausgelöst; stellen Sie daher sicher, dass die korrekten Daten bereits hinzugefügt wurden, bevor Sie auf „Drucken“ klicken.
• Maschinenattribut-Widget: Diese funktionieren selten einwandfrei. Ein besseres Muster für einen Bericht, der die letzte bekannte Ausgabe erfassen soll, ist ein Trigger auf die Maschinenausgabe, der die Ausgabe in einer lokalen Variablen speichert, die dann über ein benutzerdefiniertes Widget angezeigt wird.
• Videos: Bei YouTube-Videos wird das Bannerbild nicht geladen.

Benutzerdefinierte Widgets drucken

Wenn Sie einen Player-Schritt drucken, wird jedes benutzerdefinierte Widget als statischer Schnappschuss seines aktuellen Inhalts einbezogen. Wenn Sie einen Schnappschuss erstellen, werden die Widgets zuverlässig gedruckt, selbst wenn der Browser den eingebetteten Frame nicht direkt drucken kann.

Verhalten von Widget-Momentaufnahmen

• Der Snapshot spiegelt den Zustand des Widgets zum Zeitpunkt des Druckbeginns wider, einschließlich des Texts, des Layouts, der Farben, der Formularwerte, der Bilder und der standardmäßigen zweidimensionalen Canvas-Inhalte, die auf dem Bildschirm angezeigt werden.
• Wenn dasselbe benutzerdefinierte Widget mehr als einmal in einem Schritt platziert ist, wird für jede Widget-Platzierung ein eigener Snapshot gedruckt.
• Der gedruckte Snapshot ist statisch: Das JavaScript des Widgets wird während des Druckvorgangs nicht erneut ausgeführt. Änderungen, die von einem „beforeprint“-Handler oder anderem JavaScript zur Druckzeit abhängen, werden nicht angezeigt. Änderungen, die vor Beginn des Druckvorgangs am Widget vorgenommen werden, bleiben erhalten.
• Um die Druckansicht statisch zu halten, wird der Snapshot bereinigt. Inline-Skripte, Inline-Attribute für Ereignisbehandler (wie „onclick“, „onerror“ und „onload“) sowie „javascript:“-URLs werden entfernt. Dies hat keine Auswirkungen auf normalen Text, das Layout, die Formatierung, Bilder oder Formularwerte.
• Die Widget-eigenen Stylesheets werden erfasst und erneut angewendet, sodass das Styling erhalten bleibt. Direktes CSS, einschließlich @media-print-Regeln, wirkt sich auf den gedruckten Snapshot aus; verwenden Sie daher CSS für alle Darstellungsänderungen, die Sie im Ausdruck sehen möchten.

Das gedruckte Widget wird isoliert dargestellt: Genau wie auf dem Bildschirm beeinflusst es weder die Formatierung des restlichen gedruckten Seiteninhalts noch übernimmt es Formatierungen von diesem. Die Druckansicht beginnt zudem mit einer sauberen Stilbasis. Wenn Ihr Widget also von bestimmten Schriftarten oder Farben abhängt, legen Sie diese explizit im eigenen CSS des Widgets fest, anstatt von einer Standardeinstellung auszugehen.

Was Sie erwarten können

Beim Drucken wird angestrebt, die Anzeige des Widgets so gut wie möglich zu reproduzieren.

Für ein möglichst vorhersehbares Ergebnis:* Behalten Sie wesentliche Druckinhalte im Hauptdokument des Widgets bei* Verwenden Sie direktes CSS für die Druckgestaltung* Stellen Sie sicher, dass wichtige Bilder und Daten vor Beginn des Druckvorgangs sichtbar sind* Stellen Sie sicher, dass wesentliche Druckinformationen nicht von folgenden Faktoren abhängen:* JavaScript, Inline-Ereignisbehandler, Video- oder WebGL-Frames, verschachtelte Webseiten oder extern importierte Stile.

Einschränkungen

Das gedruckte benutzerdefinierte Widget ist keine perfekte Erfassung, und Inhalte, die von externen Ressourcen oder browserspezifischer Darstellung abhängen, können abweichen.

• Es werden nur Inhalte im Hauptdokument des Widgets erfasst: Widgets, die ihre sichtbare Benutzeroberfläche über Web Components, benutzerdefinierte Elemente oder Shadow-DOM (z. B. Lit) rendern, werden nicht erfasst und werden leer gedruckt, auch wenn sie auf dem Bildschirm korrekt angezeigt werden. Widgets, die mit gängigen Bibliotheken (z. B. Chart.js, D3 und jQuery) erstellt wurden, werden im Hauptdokument gerendert und sind davon nicht betroffen. Eingebettete iframes werden ebenfalls nicht erfasst.
• Direkt lesbares CSS, einschließlich @media-print-Regeln, bleibt erhalten. Externe Stylesheets und CSS-@import-Regeln werden nach bestem Bemühen behandelt und werden möglicherweise nicht geladen.
• Der Widget-Snapshot wird von der Druckseite des Players geladen und muss deren Sicherheitsrichtlinien entsprechen:
• Eine Ressource (z. B. ein Bild, eine Schriftart, ein Stil, ein Hintergrundbild oder eine Mediendatei), die innerhalb des eigenen Frames des Widgets geladen wird, kann daher beim Drucken blockiert werden.
• Eine an den Frame des Widgets gebundene Authentifizierung, Regeln für gemischte Inhalte, zeitlich begrenzte URLs und relative URLs können ebenfalls das Laden einer Ressource verhindern.
• Langsame externe Ressourcen können fehlen: Der Druckvorgang wartet kurz auf Assets, garantiert jedoch nicht, dass jede Ressource vollständig geladen wurde.
• Zweidimensionale Canvases werden gedruckt, wenn ihre Pixel erfasst werden können: Cross-Origin-Canvases (mit „Tainted“-Status) sind möglicherweise leer, und WebGL-Canvases werden im Allgemeinen nicht erfasst.
• Der aktuelle Frame eines Videos wird nicht erfasst: Es kann nicht garantiert werden, dass Video, Audio, verschachtelte Webseiten, Animationen, Textauswahl, Fokus, Hover-Zustand und Scrollposition erscheinen.
• Wenn ein aktueller Snapshot nicht erfasst werden kann, wird das Widget anhand seines ursprünglich konfigurierten HTML- und CSS-Codes anstelle seines aktuellen Zustands gedruckt.

Die folgende Tabelle fasst häufige Unterschiede bei der Ausgabe von Widgets und deren wahrscheinliche Ursachen zusammen:

Weiterführende Informationen

• So drucken Sie alle Schritte in einer App

{{snippet.Haben Sie gefunden, wonach Sie gesucht haben?}}