SAP BusinessObjects Design Studio – Das Praxishandbuch

Kapitel 5
In diesem Kapitel zeigen wir Ihnen, wie Sie in wenigen
Schritten Ihre erste Anwendung mit SAP BusinessObjects
Design Studio erstellen können. Sie lernen die Anwendungsoberfläche kennen und bekommen einen Einblick in die
Grundfunktionen.
5
Erste Schritte in SAP BusinessObjects Design Studio
In diesem Kapitel stellen wir Ihnen die Anwendungsoberfläche und
die Navigation sowie die grundlegenden Funktionen und Einstellungen von Design Studio vor. Sie lernen, wie neue Anwendungen
erzeugt und gespeichert sowie bereits existierende Anwendungen
hoch- bzw. heruntergeladen werden können. In Abschnitt 5.4 zeigen
wir Ihnen anhand des Beispielsszenarios, das wir in Kapitel 2
beschrieben haben, wie Sie das erlernte Wissen einsetzen können.
Ziel dieses Kapitels ist es, Ihnen einen ersten Eindruck von Design
Studio zu vermitteln, sodass Sie sich sicher im Umgang mit der
Arbeitsoberfläche fühlen und in der Lage sind, eine erste einfache
Anwendung zu erstellen, die Sie mithilfe der nächsten Kapitel erweitern können. Sollten Sie bereits Ihre ersten Erfahrungen mit Design
Studio gemacht haben, so kann Ihnen dieses Kapitel zur Wiederholung dienen. Wir möchten Sie auch darauf hinweisen, dass die Beispielanwendung, die wir in Abschnitt 5.4 erstellen, als Grundlage für
weitere Kapitel verwendet wird.
5.1
Design Studio öffnen
Wie bereits in Abschnitt 3.2 beschrieben, können Sie Design Studio
in vier unterschiedlichen Modi öffnen: Lokal, SAP-BI-Plattform, SAP
HANA oder SAP NetWeaver. Dies hängt davon ab, welche Plattform
Sie einsetzen. Nach der Installation wird Design Studio jedoch standardmäßig im lokalen Modus gestartet:
117
Öffnen der
Anwendung im
lokalen Modus
5
Erste Schritte in SAP BusinessObjects Design Studio
1. Wählen Sie Start, und klicken Sie auf Alle Programme.
5.1.1
2. Wählen Sie SAP Business Intelligence.
Haben Sie sich für eine Plattform entschieden (siehe Abschnitt 3.2),
können Sie dies in den Einstellungen von Design Studio anpassen.
Gehen Sie dafür wie folgt vor (siehe Abbildung 5.2):
3. Selektieren Sie SAP BusinessObjects Design studio und anschließend Design Studio.
Welcome Page
Design Studio öffnen
Nach dem Starten von Design Studio öffnet sich eine Welcome
Page (siehe Abbildung 5.1), die Sie bei Ihren ersten Schritten unterstützt. Sie beinhaltet unter anderem Links zu Dokumentationen oder
Videos, zu Ihren zuletzt verwendeten Anwendungen und eine
Schaltfläche
zum Anlegen neuer Anwendungen.
Startup Mode ändern
1. Starten Sie Design Studio.
2. Wählen Sie in der Menüleiste Tools und anschließend Preferences.
3. Wählen Sie in der Ansicht Application Design unter General den
Preferred Startup Mode.
5.1.2
Anmelden
Das Design Studio wird neu gestartet. Je nachdem, welchen Startup
Mode (welche Plattform) Sie gewählt haben, erscheint eine entsprechende Anmeldemaske.
왘 SAP BusinessObjects BI Platform
왘 Tragen Sie Ihren Benutzernamen und Ihr Passwort für die SAP
BusinessObjects BI Platform (BI-Plattform) in die Felder User
Name und Password ein (siehe Abbildung 5.2).
왘 Geben Sie die Webservice-URL in das Feld Web Service URL
ein.
Abbildung 5.1 Welcome Page
왘 Wählen Sie aus dem Dropdown-Menü Authentication die
Authentifizierung.
Welcome Page
Sie können die automatische Anzeige der Welcome Page ausschalten,
indem Sie unten links das Kontrollkästchen Always show the Welcome
page on startup deaktivieren. Möchten Sie die Welcome Page wieder einblenden, so klicken Sie in der Menüleiste auf Help und dann auf Welcome.
Für die nachfolgenden Abschnitte wird die Welcome Page nicht
mehr benötigt. Klicken Sie oben links im Reiter Welcome auf das ×,
um sie zu schließen.
Abbildung 5.2 Anmeldemaske der SAP BusinessObjects BI Platform
118
119
5.1
5
Erste Schritte in SAP BusinessObjects Design Studio
Design Studio öffnen
왘 SAP HANA
왘 Tragen Sie Ihren Benutzernamen und Ihr Passwort für die BIPlattform in die Felder User Name und Password ein (siehe
Abbildung 5.3).
왘 Geben Sie die XSEngine URL in das Feld XSEnginge URL in folgendem Format ein: http://<server>:<port>. Sie können auch
optional eine JDBC-URL eingeben, um sich mit HANA-Datenquellen zu verbinden. Dies wird normalweise für SAP-HANACloud-Plattformen oder SAP Web Dispatcher benötigt:
jdbc:sap://<host>:3<zweistellige Instanznummer>15 (z. B. jdbc:sap://
localhost:30015)
Abbildung 5.4 Anmeldemaske von SAP NetWeaver
5.1.3
Auf der Benutzeroberfläche navigieren
Die Arbeitsoberfläche von Design Studio unterteilt sich in mehrere
Bereiche (siehe Abbildung 5.5), die wir in diesem Abschnitt näher
erläutern werden. Die einzelnen Bereiche können Sie per Drag &
Drop verschieben und unterschiedlich positionieren. Um Ansichten
ein- oder auszublenden, klicken Sie in der Menüleiste auf View und
selektieren die gewünschten Ansichten.
Abbildung 5.3 Anmeldemaske von SAP HANA
왘 SAP NetWeaver
왘 Selektieren Sie das SAP-BW-System aus dem Dropdown-Menü
System. Die Auswahlliste beinhaltet alle Systeme, die Sie bereits
im SAP-Logon hinzugefügt hatten (siehe Abbildung 5.4).
왘 Tragen Sie den Mandanten, Ihren Benutzernamen und Ihr Passwort (falls Sie kein SSO nutzen) sowie die Anmeldesprache in
die Felder Client, User, Password und Language ein.
Um aus der Anmeldemaske in den lokalen Modus zurückzukehren,
können Sie sich entweder erst an einer Plattform anmelden und
anschließend über die Einstellungen den Startup Mode ändern,
oder Sie klicken in der Anmeldemaske auf die Schaltfläche Skip.
Abbildung 5.5 Arbeitsoberfläche von Design Studio
120
121
Ansichten der
Anwendungsoberfläche
5.1
5
Erste Schritte in SAP BusinessObjects Design Studio
Layout-Editor
Der Layout-Editor befindet sich standardmäßig in der Mitte der
Arbeitsoberfläche. Hier können Sie Ihre grafischen Komponenten
aus dem Bereich Components per Drag & Drop einfügen, um somit
Ihre grafische Oberfläche zu erstellen. Die Größe und Position der
Objekte können Sie entweder in deren jeweiligen Eigenschaften
ändern oder direkt im Layout-Editor, indem Sie die einzelnen Komponenten größer ziehen oder verschieben.
Components
Die Ansicht Components beinhaltet alle grafischen Komponenten,
die Sie zum Erstellen Ihrer Anwendung nutzen können. Sie können
diese per Drag & Drop im Layout-Editor positionieren. Anschließend ist es möglich, die Einstellungen dieser Komponenten in der
Ansicht Properties zu ändern. Die Komponenten werden wegen
ihrer unterschiedlichen Funktionen in drei Teile gegliedert: Analytic Components, Basic Components und Container Components
(siehe Abschnitt 5.3).
Outline
Der Bereich Outline enthält alle Objekte und Elemente, die innerhalb der Anwendung verwendet werden, und listet diese in einer
hierarchischen Ordnerstruktur auf. Die Ordner sind nach Anwendungstypen aufgeteilt:
왘 Data Sources
Dieser Ordner beinhaltet alle Datenquellen, die Ihnen in der
Anwendung zur Verfügung stehen. Über das Kontextmenü können Sie unter anderem neue Datenquellen hinzufügen.
왘 Planning Objects
Hier können Sie neue Planungsfunktionen und -sequenzen aus der
BW-integrierten Planung hinzufügen. Diese ermöglichen Ihnen
das automatische Befüllen von Daten.
왘 Layout
Im Ordner Layout befinden sich alle Komponenten, die in der
Anwendung verwendet werden. Sie können ihre Struktur und
Anordnung per Drag & Drop ändern.
왘 Technical Components
Der Ordner Technical Components unterteilt sich in weitere Elemente. Sie können über das Kontextmenü neue Elemente hinzufügen, die im Folgenden näher erläutert werden:
122
Design Studio öffnen
왘 Backend Connection
Mit der technischen Komponente Backend Connection kann
der Endanwender beim Ausführen der Anwendung generisch
neue Datenquellen auswählen (siehe Abbildung 5.6). Dafür
muss beim Erzeugen der Anwendung ein System in den Eigenschaften dieser Komponente definiert werden. Diese Funktion
kann beispielsweise in einer Analyse-Vorlage eingesetzt werden, damit der Endanwender dynamisch neue Datenquellen
selektieren und analysieren kann.
Abbildung 5.6 Generische Selektion von Datenquellen
왘 Context Menu
Jede Anwendung hat standardmäßig ein Kontextmenü, das Sie
nachträglich löschen können. Dies unterstützt den Benutzer beim
Navigieren und Analysieren der Daten (siehe Abbildung 5.7).
Kontextmenü
Die Komponente Context Menu ist erst ab der Design-Studio-Version 1.4
verfügbar. Sollten Sie eine Anwendung in Design Studio 1.4 öffnen, die
vorher mit einer älteren Version erstellt wurde, dann wird das Kontextmenü nicht automatisch hinzugefügt. Sie müssen es explizit über einen
Rechtsklick anlegen.
왘 Global Scripts Object
Diese technische Komponente ermöglicht es Ihnen, globales
Scripting anzulegen, das Sie jederzeit innerhalb Ihrer Anwendung wiederverwenden können.
123
5.1
5
Erste Schritte in SAP BusinessObjects Design Studio
Design Studio öffnen
5.1
z. B. Größe, Position, Style, Datenanbindung, Ereignissteuerung.
Sollten Sie mehrere Objekte gleichzeitig selektieren, so werden in
den Properties nur die gemeinsamen Eigenschaften aller ausgewählten Objekte aufgelistet, die Sie pflegen können.
Abbildung 5.7 Kontextmenü einer Tabelle
Abbildung 5.8 Outline-Bereich mit Kontextmenü
왘 PDF
Fügen Sie diese technische Komponente hinzu, um in Ihrer
Anwendung die PDF-Funktionalität zu ermöglichen.
왘 Text Pool
Mithilfe des Text Pool können Sie Übersetzungstexte hinterlegen, die Sie innerhalb der Anwendung benötigen (z. B. für
Schaltflächen, Beschriftungen, Überschriften). Dies wird in
Kapitel 9 erläutert.
Kontextmenü der
Outline-Objekte
Eigenschaften der
Komponenten
Über einen Rechtsklick auf die einzelnen Elemente der OutlineAnsicht gelangen Sie in das Kontextmenü (siehe Abbildung 5.8). Hier
können Sie unter anderem einzelne Objekte ausblenden, um das
Arbeiten im Layout-Editor zu vereinfachen (beispielsweise wenn
mehrere Komponenten übereinanderliegen), bzw. die Objekte
kopieren, umbenennen oder löschen. Verschieben Sie einzelne Komponenten, um diese anders zu strukturieren oder die Gruppierungen
zu verändern. Das Suchfeld ist Ihnen dabei behilflich, schnell Komponenten oder technische Namen zu finden.
In der Ansicht Additional Properties werden die erweiterten
Eigenschaften für manche Komponenten (z. B. Charts) angezeigt.
Hier können Sie beispielsweise die Formatierung der Diagramme
anpassen.
Erweiterte
Eigenschaften
Im Bereich Search Results können Sie nach Referenzen in Ihrer
Anwendung suchen. Öffnen Sie im Outline-Bereich über einen
Rechtsklick das Kontextmenü eines Objekts, und klicken Sie dann
auf Find References. Sie sehen dann, an welche Komponenten die
Datenquellen gebunden sind oder in welchen Script-Teilen diese
Objekte verwendet werden. Die Ergebnisse werden anschließend in
der Ansicht Search Results gelistet. Über einen Doppelklick auf das
Suchergebnis gelangen Sie direkt in den Script Editor, um den Code
zu bearbeiten (siehe Abbildung 5.9).
Suchergebnisse
Im Error Log sehen Sie die generellen Fehlermeldungen, wie z. B.
Systemfehler oder Script-Validierungsfehler (siehe Abbildung 5.10).
Durch einen Doppelklick auf diese Meldungen erhalten Sie die
Detailinformationen dazu.
Meldungsansicht
Im Bereich Properties können Sie alle wichtigen Eigenschaften des
Objekts (z. B. Datenquelle, Komponente), das Sie entweder direkt im
Layout-Editor oder in der Outline-Ansicht selektiert haben, pflegen:
124
125
5
Erste Schritte in SAP BusinessObjects Design Studio
Design Studio öffnen
Über die Werkzeugsymbolleiste erhalten Sie einen Schnellzugriff auf
die häufig verwendeten Funktionen (siehe Abbildung 5.12):
Werkzeugsymbolleiste
왘 Neue Applikation anlegen, öffnen oder speichern
왘 Neue Datenquelle, Planungsfunktion oder Planungssequenz hinzufügen
왘 Schritt zurück oder vor
왘 Anwendung ausführen
왘 Selektierte Komponente(n) nach links, rechts, oben oder unten
ausrichten
Abbildung 5.9 Referenzsuche für Script
왘 Selektierte Komponente(n) horizontal/vertikal verteilen oder
maximieren
왘 Anwendung durchsuchen oder Referenzen finden
왘 Prompts (Eingabeaufforderungen) anzeigen lassen
왘 Anwendung neu laden
Abbildung 5.10 Error- und Script-Validierungsfehler
Script-Fehler
In der Ansicht Script Problems werden entweder nach dem Abspeichern der Anwendung oder während ihrer Entwicklung (Design
Time) die Script-Fehler aufgelistet. Sie bekommen einen Überblick
über alle Fehler (Komponentenname, Ereignis etc.). Mit einem Doppelklick auf die Meldung wird der Script Editor geöffnet und die
Stelle mit dem Fehlercode markiert, sodass Sie diesen gleich verbessern können (siehe Abbildung 5.11).
Abbildung 5.12 Werkzeugsymbolleiste
Die Menüleiste enthält zum größten Teil die gleichen Funktionen
wie die Werkzeugsymbolleiste (siehe Abbildung 5.13). Die wichtigsten stellen wir Ihnen im Folgenden vor.
Abbildung 5.13 Menüleiste
왘 Importieren und Exportieren von Anwendungen
Klicken Sie auf Application 폷 Import… oder Export…, um eine
Anwendung zu importieren oder zu exportieren.
Import und Export vor Design Studio 1.5
Abbildung 5.11 Script-Fehler
126
Sollten Sie eine ältere Design-Studio-Version verwenden, dann können
Sie Anwendungen nur dann importieren oder exportieren, wenn Sie als
Startup Mode eine Plattform (HANA, BI-Plattform oder SAP NetWeaver)
gewählt haben. Der Menüeintrag zum Importieren befindet sich unter
Help 폷 Support 폷 Download und der Eintrag zum Exportieren unter Tools
폷 Upload Local Application.
127
Menüoptionen
5.1
5
Erste Schritte in SAP BusinessObjects Design Studio
Design-Studio-Einstellungen
5.2
왘 View
Hier können Sie unterschiedliche Ansichten selektieren, die in
Design Studio angezeigt werden (z. B. Components, Outline, Error
Log).
왘 Tools
Unter dem Menüeintrag Tools befinden sich einerseits die Einstellungen (siehe Abschnitt 5.2) sowie die Erweiterungen für
Design Studio, die Sie nachträglich installieren können (siehe
Abbildung 5.14).
Abbildung 5.15 Design-Studio-Einstellungen
5.2.1
Abbildung 5.14 Erweiterungen für Design Studio
왘 Help
Unter dem Menüeintrag Help 폷 About… können Sie sich Informationen zur installierten Design-Studio-Version anzeigen lassen.
Darüber hinaus finden Sie im Help-Menü die Welcome-Seite und
weitere Informationen zu Design Studio.
5.2
Einstellungen
speichern und
zurücksetzen
Design-Studio-Einstellungen
Bevor Sie mit Ihrer ersten Anwendung beginnen und die Komponenten kennenlernen, möchten wir Sie in diesem Abschnitt mit den Einstellungen von Design Studio vertraut machen. Klicken Sie in der
Menüleiste auf Tools und dann auf Preferences, um die Maske für
die Einstellungen zu öffnen (siehe Abbildung 5.15). Klicken Sie,
nachdem Sie Ihre Einstellungen angepasst haben, auf OK. Sollten Sie
Ihre Einstellungen wieder auf den Standard zurücksetzen wollen, klicken Sie auf Restore Defaults.
Application Design
Klicken Sie im linken Navigationsbaum auf Application Design, um
die Haupteinstellungen vorzunehmen. Diese unterteilen sich in die
folgenden sechs Bereiche:
General
Wie bereits in Abschnitt 3.2 beschrieben, können Sie in Bereich
General die Plattform wählen, die Sie für Ihre Anwendung einsetzen möchten. Im Eingabefeld Undo History Size können Sie die
Anzahl der Änderungen eintragen, die der Designer während der
Entwicklung rückgängig machen kann.
Embedded Web Server
Tragen Sie im Bereich Embedded Web Server den Netzwerk-Port
(zwischen 1024 und 65535) für den integrierten Webserver des
Design Studios ein. Wenn Sie den Wert 0 stehen lassen, ordnet das
System automatisch einen Port zu. Sollten Sie jedoch Bookmarks
(siehe Kapitel 10) nutzen, dann wird eine feste Portnummer benötigt. Um das Testen auf mobilen Endgeräten zu ermöglichen, aktivieren Sie das Kontrollkästchen Allow external access to embedded
Web server (siehe Abbildung 5.16).
Abbildung 5.16 Embedded Web Server
128
Undo History Size
129
Externen Zugriff
erlauben
5
Erste Schritte in SAP BusinessObjects Design Studio
Design-Studio-Einstellungen
5.2
Application Recovery
Wiederherstellen
von Anwendungen
Per Default wird der Inhalt Ihrer Anwendung jede Minute automatisch im Verzeichnis <user home directory>\Analysis-workspace\.metadata\.plugins\com.sap.ip.bi.zen gespeichert, sodass Sie nach einem
Absturz des Systems Ihre Änderungen wiederherstellen können. Im
Bereich Application Recovery können Sie das Intervall des automatischen Speicherns ändern.
Member Selection
Wertehilfe im
Script Editor
Im Bereich Member Selection geht es um die Eingrenzung der Wertehilfen im Script Editor (siehe Abbildung 5.17). Wenn Sie z. B. über
BIAL einen Filter setzen möchten und den Assistenten für die Wertehilfe nutzen, bekommen Sie eine Vorschlagsliste der Filterwerte.
Abbildung 5.19 »Select Member« als Werteliste
Um Warnmeldungen (z. B. bei falschen Filterwerten) zu erhalten,
aktivieren Sie das Kontrollkästchen Display warnings for
manually entered invalid values (siehe Abbildung 5.17).
Abbildung 5.17 Member Selection
Diese Vorschlagsliste zeigt per Default 20 Werte an (siehe Abbildung
5.18). Diesen Wert können Sie in den Einstellungen Maximum number of members to fetch from backend in content assistance
ändern (siehe Abbildung 5.17).
Prompt Handling
Sollten Sie in Ihrer Datenquelle Variablen oder Eingabeparameter
benutzen, so müssten Sie während der Entwicklung und beim Testen
die Filterwerte eingeben. Mit der Einstellung Prompt Handling
können Sie Ihre Filtereingaben speichern, sodass Sie beim lokalen
Ausführen der Anwendung nicht mehr danach gefragt werden und
Ihnen das Arbeiten dadurch erleichtert wird. Klicken Sie auf die
Schaltfläche Clear Prompt Value Cache…, um Ihre zwischengespeicherten Filterwerte zu löschen (siehe Abbildung 5.20).
Abbildung 5.18 Vorschlagsliste für Filterwerte
Abbildung 5.20 Prompt Handling
Sollte die Datenquelle in diesem Fall mehr als 20 Werte beinhalten,
dann wird statt der Vorschlagsliste der Eintrag Select Member…
angezeigt (siehe Abbildung 5.19). Klicken Sie auf diesen Eintrag, um
aus einer Werteliste auszuwählen, die im Standard auf 1000 Werte
begrenzt ist. Diese Anzahl können Sie in den Einstellungen Maximum number of members to fetch from backend in dialog ändern
(siehe Abbildung 5.17).
130
Force Prompts
Sollten die Variablen oder Eingabeparameter dennoch beim lokalen Ausführen abgefragt werden, dann wird diese globale Einstellung möglicherweise von der Anwendungseinstellung überschrieben. Prüfen Sie in diesem
Fall, ob die Anwendungseinstellung Properties 폷 Prompts 폷 Force Prompts
on Startup auf true gesetzt ist. Falls ja, dann setzen Sie diese auf False.
131
Variablen und
Eingabeparameter
5
Erste Schritte in SAP BusinessObjects Design Studio
Report-Report Interface
Absprung in eine
Anwendung
Mit dem Report-Report Interface wird Ihnen das Abspringen in
andere Zielanwendungen ermöglicht. Falls Sie aus einer Query in
eine andere Query abspringen möchten, so würde sich normalerweise die Ziel-Query in einer BEx-Webanwendung öffnen. Um dies
zu vermeiden, können Sie im Feld Application to use for query
jumps den Namen einer lokal gespeicherten Anwendungsvorlage
eingeben.
Design-Studio-Einstellungen
Runtime Trace, Runtime Profiling, SAP JCo Trace. Unter HANA
Data Sources (HTTP) lassen sich die Proxy-Einstellungen für die
HANA-Anbindungen verwalten.
Neben den Haupteinstellungen für Application Design können Sie
die Application Templates (Anwendungsvorlagen), Backend
Connections (Datenquelle-Verbindungen), Network Connections
(Netzwerk-verbindungen) und Support Settings (Hilfseinstellungen)
pflegen. Diese können Sie im Untermenü von Application Design
aufrufen.
왘 Application Templates
In den Einstellungen der Application Templates lassen sich die
eigenen Anwendungsvorlagen verwalten. Dies erläutern wir in
Abschnitt 5.5 näher.
왘 Backend Connections
Abhängig von Ihrer gewählten Plattform können Sie unter
Backend Connections die verfügbaren Verbindungen in einer
Übersicht sehen, die in Ihrer Anwendung zur Verfügung stehen.
Beispielsweise werden für die BI-Plattform drei Verbindungstypen
angezeigt: SAP BW, SAP HANA und relationale Universen. Sollte
sich zwischendrin an den Verbindungen etwas ändern, dann können Sie auf die Schaltfläche Reload All Connections klicken
(siehe Abbildung 5.21), um die Verbindungen zu aktualisieren,
ohne Ihr Design Studio neu starten zu müssen.
Abbildung 5.21 Backend-Verbindungen aktualisieren
5.2.2
Scripting
Im Bereich Scripting können Sie die Einstellungen für den Script-Editor vornehmen. Klicken Sie auf Syntax Coloring, um die Farben und
die Schriftart für das Scripting festzulegen (siehe Abbildung 5.22).
왘 Network Connections
In den Netzwerk-Verbindungen können Sie die Proxy-Einstellungen bearbeiten. Über die Schaltfläche Restore Defaults setzen Sie
die Einstellungen auf den Standard zurück.
왘 Support Settings
Die Hilfseinstellungen unterteilen sich in Logging, Tracing und
SAP HANA Data Sources (http). Im Bereich Logging wählen Sie,
welcher Level protokolliert wird (Warnungen, Errormeldungen,
Informationen oder Debug-Informationen). Im Bereich Tracing
können Sie drei unterschiedliche Ablaufsverfolgungen aktivieren:
132
Abbildung 5.22 Einstellungen für das Scripting
133
5.2
5
Erste Schritte in SAP BusinessObjects Design Studio
Vorlagen für
JavaScript
Unter dem Menüpunkt Templates werden die Befehlsvorlagen für
BIAL verwaltet. Mit diesen Vorlagen können Sie sich im Script Editor Ihre Befehle automatisch vervollständigen lassen (siehe Abbildung 5.23).
Komponenten
5.3.1
Analytic Components
Die analytischen Komponenten werden genutzt, um Daten zu visualisieren. Sie können zwischen Chart, Crosstab, Dimension Filter,
Filter Line, Filter Panel, Geo Map oder Navigation Panel wählen
(siehe Abbildung 5.25). Initial zeigen die Kreuztabellen (Crosstabs)
und Diagramme (Charts) unechte Daten an. Dies können Sie
ändern, indem Sie in den Eigenschaften eine Datenquelle an die
Komponente anbinden (Properties 폷 Data Binding 폷 Data Source).
Die Datenanbindung wird in Kapitel 6 erklärt.
Abbildung 5.23 Vorschlagsliste für Script-Befehle
Die Installation von Design Studio liefert Ihnen bereits zahlreiche
Vorlagen, wie z. B. für if-Abfragen oder .forEach-Schleifen (siehe
Abbildung 5.24). Über die Schaltfläche Import können Sie Vorlagen
importieren und über New… neue Vorlagen erstellen.
Abbildung 5.25 Analytische Komponenten
Abbildung 5.24 Script-Editor-Vorlagen
5.3
Komponenten
In Abschnitt 5.1.3 haben Sie bereits erfahren, dass die Komponenten
– abhängig von ihren Funktionen – in drei Teile gegliedert werden:
Analytic Components, Basic Components und Container Components. In diesem Abschnitt möchten wir Ihnen einen Überblick über
die einzelnen Komponenten innerhalb der Gruppierungen, über ihre
Funktionen und ihre ausgewählten Eigenschaften geben.
134
왘 Chart
Fügen Sie eine Chart-Komponente hinzu, so wird per Default ein
Säulendiagramm angezeigt. Sie können über die Eigenschaften
den Diagrammtyp ändern, Daten anbinden, die Formatierung
anpassen und Ereignisse steuern.
왘 Crosstable
In der Komponente Crosstable stellen Sie Ihre Daten tabellarisch
dar (auch Hierarchiestrukturen können in einer Kreuztabelle abgebildet werden). Die Formatierung der Tabelle lässt sich flexibel
über eine CSS-Klasse anpassen (siehe Abschnitt 7.5). Darüber hin-
135
5.3
5
Erste Schritte in SAP BusinessObjects Design Studio
Komponenten
aus können Sie in den Eigenschaften unter anderem die Planungsanzeige, Benutzerinteraktivität und Tabellendarstellung pflegen.
Um das Kontextmenü zu aktivieren, muss sowohl die technische
Komponente Context Menu vorhanden sein (siehe Abschnitt
5.1.3) als auch die Eigenschaft Context Menu Enabled auf True
gesetzt werden (Properties 폷 User Interactivity 폷 Context Menu
Enabled).
왘 Dimension Filter
Mithilfe des Dimensionsfilters wird Ihnen das Filtern auf die
Werte einer bestimmten Dimension der Datenquelle ermöglicht.
In den Eigenschaften des Filters wählen Sie zunächst die Datenquelle und die Zieldatenquelle aus, die gefiltert werden soll. Sie
können den Filter auch auf mehrere unterschiedliche Datenquellen gleichzeitig anwenden. Sollten Sie das Feld für die Zieldatenquelle leer lassen, so wird der Dimensionsfilter auf die Datenquelle selber ausgeführt. Im nächsten Schritt müssen Sie die
Filterdimension selektieren. In Abbildung 5.26 sehen Sie, dass als
Datenquelle DS_1 (mit der Dimension City) und als Zieldatenquelle DS_2 definiert sind.
Abbildung 5.27 Filter Line
왘 Filter Panel
Anders als im Dimension Filter können Sie im Filter Panel mehrere Dimensionen einer Datenquelle einbinden und filtern. Wählen Sie in den Eigenschaften die Datenquelle und Zieldatenquelle
aus. Die Auswahl der Dimensionen befindet sich im Bereich Properties 폷 Display 폷 Dimensions (siehe Abbildung 5.28). Standardmäßig sind alle verfügbaren Dimensionen einer Datenquelle ausgewählt. Sie können diese nachträglich wieder entfernen.
Abbildung 5.26 Dimensionsfilter
Abbildung 5.28 Filter Panel
Dies bedeutet, dass der Dimensionsfilter »City« sowohl auf die
DS_1 als auch auf DS_2 angewendet wird (DS_1 muss nicht explizit eingetragen werden).
왘 Filter Line
Mit dieser Komponente (verfügbar ab Design-Studio-Version 1.5)
lassen sich Filter einer definierten Datenquelle hinzufügen und
horizontal darstellen (siehe Abbildung 5.27).
136
Neben der Filterfunktion hat das Filter Panel eine weitere Besonderheit: die Navigation. In der Eigenschaft Properties 폷 Display 폷
Mode können Sie entscheiden, welche Funktion mit dem Filter
Panel ausgeführt wird: Navigieren, Filtern oder beides. Das Navigieren ermöglicht Ihnen ein dynamisches Hinzufügen bzw. Entfernen von Zeilen und Spalten in einer Tabelle (siehe Abbildung 5.29).
137
Filtern und
navigieren
5.3
5
Erste Schritte in SAP BusinessObjects Design Studio
Komponenten
5.3
Abbildung 5.30 Navigation Panel
Abbildung 5.29 Filter-Panel-Navigation
왘 Geo Map
Ab der Design-Studio-Version 1.5 steht Ihnen die Komponente
Geo Map zur Verfügung, mit der Sie Karten in Ihre Anwendung
integrieren können. Die Eigenschaften unterteilen sich in Properties (URL der Karte, Größe und Position sowie die Definition der
Ereignisse) und Additional Properties (Definition einzelner Karten-Schichten). Die Details zu dieser Komponente werden in
Abschnitt 7.6.1 gezeigt.
왘 Navigation Panel
Auch diese Komponente ist erst ab Design-Studio-Version 1.5 verfügbar. Sie ermöglicht Ihnen die Navigation innerhalb der Daten
entweder über das Drag & Drop der Objekte in Zeilen und Spalten
oder über das Kontextmenü. Ähnlich wie beim Filter Panel werden beim Erstellen der Anwendung eine Datenquelle hinzugefügt
und Dimensionen selektiert bzw. sortiert. In den Eigenschaften
des Navigation Panels können Sie unter anderem zwischen dem
Modus Navigation oder List Only wählen (Properties 폷 Display 폷
Mode). Im Modus List Only ist ein Drag & Drop der Objekte
nicht möglich. Das Navigieren funktioniert in diesem Fall nur über
das Kontextmenü (siehe Abbildung 5.30).
5.3.2
Basic Components
In den Basic Components befinden sich die grundlegenden Komponenten mit Funktionen, wie z. B. Navigieren, Filtern oder optisches
Gestalten der Anwendung. Die meisten dieser Komponenten werden zum Filtern und Einschränken von Datenmengen genutzt. Komponenten, wie z. B. das Dropdown-Menü oder Kontrollkästchen, lassen sich auf mehrere Weisen befüllen: entweder durch eine statische
Werteliste in den Eigenschaften oder über BIAL (dynamisches Auslesen der Werte aus einer Datenquelle). Der Bereich Basic Components umfasst folgende Objekte (siehe Abbildung 5.31):
Abbildung 5.31 Basic Components
138
139
Basiskomponenten
5
Erste Schritte in SAP BusinessObjects Design Studio
왘 Button (Schaltfläche)
왘 Chart Type Picker (Diagrammauswahl)
왘 Checkbox (ein Kontrollkästchen)
Komponenten
5. Im Feld All Members Text können Sie einen neuen Eintrag für
alle Werte erstellen (z. B. »Alle Werte«). Dieser Eintrag wird dann
als erster angezeigt (siehe Abbildung 5.33).
왘 Checkbox Group (Gruppe mit mehreren Kontrollkästchen)
왘 Date Field (Datumsfeld)
왘 Dropdown Box (Dropdown-Menü)
왘 Formatted Text View (Formatierte Textansicht)
왘 Fragment Gallery (Fragment-Galerie zum Speichern einzelner
Anwendungsteile für eine Personalisierung)
왘 Image (Bild)
왘 Input Field (Eingabefeld)
왘 List Box (Auswahlkasten)
왘 Radio Button Group (Gruppe mit mehreren Optionsfeldern)
왘 Text (Text)
Stammdaten
befüllen
Abbildung 5.33 Dropdown-Box mit direkter Datenanbindung
5.3.3
Container Components
Container Components werden dazu verwendet, um die eigentlichen Objekte innerhalb der Anwendung zu strukturieren und zu
gruppieren. Sie können zwischen folgenden Komponenten wählen:
Ab der Design-Studio-Version 1.5 lassen sich die Auswahlkomponenten (z. B. Dropdown-Box, Listen) auch über eine direkte Zuordnung der Stammdaten in den Eigenschaften (Properties 폷 Display 폷
Items 폷 Input Binding) befüllen:
왘 Grid Layout (Raster-Layout, mit dynamischer Spalten- und Zeilenanzahl)
1. Fügen Sie ein Auswahlelement aus den Basic Components hinzu.
왘 Panel (z. B. zum Gruppieren von mehreren Komponenten)
2. Markieren Sie in den Eigenschaften den Eintrag Items (Properties
폷 Display 폷 Items). Nach dem Markieren wird die Schaltfläche Edit
Property Binding… aktiv (siehe Abbildung 5.32).
왘 Popup (Dialogbox)
ContainerKomponenten
왘 Pagebook (Buchseiten, z. B. zum Blättern auf mobilen Endgeräten)
왘 Split Cell Container (Zellcontainer)
왘 Tabstrip (Registerkarten)
Grid Layout
Abbildung 5.32 Schaltfläche für das Binding
3. Klicken Sie auf die Schaltfläche Edit Property Binding 폷 Dimension Members Binding, um eine direkte Datenanbindung zu
ermöglichen.
4. Selektieren Sie nun in den Eigenschaften (Properties 폷 Display 폷
Items 폷 Input Binding) die Data Source und die Dimension.
140
Das Grid Layout wird verwendet, um die Komponenten gleichmäßig und exakt anzuordnen, z. B. bei der Anordnung unterschiedlicher Buttons oder Charts neben- oder untereinander. Die Anzahl der
Zeilen und Spalten sowie ihr Größenverhältnis zueinander geben Sie
in den Eigenschaften an. Anschließend können Sie die einzelnen grafischen Objekte per Drag & Drop entweder direkt im Layout Editor
oder im Outline-Bereich in die einzelnen Zellen platzieren. Hier
empfehlen wir innerhalb der Zellen mit Randabständen zu arbeiten,
damit eine dynamische Größenanpassung an die Bildschirmauflö-
141
Raster-Layout
5.3
5
Erste Schritte in SAP BusinessObjects Design Studio
sung gewährleistet wird. In Abbildung 5.34 ist ein Beispiel für ein
mögliches Layout mithilfe eines Grids (2 Zeilen, 2 Spalten) zu sehen.
Komponenten
müssen Sie nur das Panel ein- und ausblenden, um die Sichtbarkeit
von zehn Objekten gleichzeitig zu steuern. Innerhalb der einzelnen
Panels können Sie weitere Container-Komponenten (z. B. das GridLayout) verwenden, um Ihre Inhalte pixelgenau zu positionieren.
Popup
Abbildung 5.34 Grid-Layout
Pagebook
Buchseiten
Das Pagebook wird meistens für mobile Endgeräte genutzt. Sie können damit mehrere Seiten darstellen und mit Wischen zwischen diesen Seiten blättern. Wir empfehlen Ihnen, dieses Layout nicht in
Desktop-Anwendungen einzusetzen, da im Webbrowser nicht zu
erkennen ist, ob mehr als eine Seite zur Verfügung steht. Um neue
Seiten hinzuzufügen, machen Sie einen Rechtsklick auf Pagebook
und wählen Create Child 폷 Page. Das Anordnen von Objekten funktioniert ähnlich wie beim Grid Layout. Ziehen Sie die grafischen
Komponenten einfach per Drag & Drop auf die einzelnen Seiten im
Outline-Bereich. Sie können auch einzelne Seiten im OutlineBereich selektieren und die grafischen Objekte direkt im Layout Editor für die jeweilige Seite positionieren.
Der Popup-Container, auch Dialogfenster genannt, kann genauso
eingesetzt werden wie das Panel. Der Hauptunterschied besteht
darin, dass das Ein- und Ausblenden des Popup-Containers über die
Eigenschaften animiert werden kann. Die Komponente ist initial
unsichtbar und wird über Buttons oder andere Komponenten im
Script aktiviert. Beispielsweise können Sie ein Filter Panel in einen
Popup-Container einfügen. Klickt dann ein Anwender auf einen Button, so wird das Filter Panel (innerhalb des Popups) animiert eingeblendet. In Abbildung 5.35 sehen Sie die unterschiedlichen Animationsverhalten:
왘 No Animation: Keine Animation
왘 Fade Animation: Langsames Ein- und Ausblenden des PopupContainers
왘 Flip Animation: Spiegelung und anschließende Drehung des
Popup-Containers
왘 Pop Animation: Der Container erscheint als ein Popup und wird
von hinten nach vorne eingeblendet.
왘 Horizontal Slide Animation: Einblenden des Popup-Containers
von links nach rechts oder umgekehrt
왘 Vertical Slide Animation: Einblenden des Popup-Containers von
oben nach unten oder umgekehrt
Panel
Panel zum
Strukturieren
Zum Strukturieren und Gruppieren mehrerer Objekte empfehlen
wir den Einsatz von Panels. Sie können damit beispielsweise alle
Objekte eines Headers, Footers und des Contents gruppieren. Auch
das Verschieben oder Ein- und Ausblenden der Inhalte wird durch
den Einsatz von Panels vereinfacht. Sollten Sie beispielsweise zehn
Objekte (Chart, Texte, Filter) innerhalb eines Panels haben, dann
142
Abbildung 5.35 Animationsverhalten eines Popups
143
Popup mit
Animationen
5.3
5
Erste Schritte in SAP BusinessObjects Design Studio
OnlineCompositionSzenario
Split Cell Container
5.4.1
Der Split Cell Container wird benötigt, um Online-Composition-Szenarien zu erstellen. Ein Online-Composition-Szenario gibt dem
Anwender die Möglichkeit, einzelne Fragmente einer Anwendung
zu selektieren und daraus eine neue eigene Anwendung innerhalb
eines Split Cell Containers zusammenzustellen (siehe Kapitel 10).
In diesem Abschnitt werden wir zur Vereinfachung eine Anwendung
ohne eine Berichtsvorlage (siehe Abschnitt 5.5) und ohne eine
Datenquellen-Anbindung (siehe Kapitel 6) anlegen.
5.4
Eine Design-Studio-Anwendung anlegen
1. Sie haben drei Möglichkeiten, eine neue Anwendung anzulegen:
왘 über die Welcome Page: Klicken Sie auf die Schaltfläche Create Analysis Application (siehe Abschnitt 5.1).
Tabstrip
Registerkarten
Anlegen einer Design-Studio-Anwendung
Mit einem Tabstrip-Container können Sie Registerkarten (Tabs) in
einer Anwendung hinzufügen (siehe Abbildung 5.36). Er ist das Pendant zum Pagebook-Container und ist für den Desktop-Einsatz empfehlenswert. Klicken Sie auf die einzelnen Tabs, um die Beschriftungen für die Registerkarten in den Eigenschaften zu ändern und die
einzelnen Registerkarten zu bearbeiten.
왘 über die Werkzeugsymbolleiste: Klicken Sie auf das Symbol
New ( ).
왘 über die Menüleiste: Klicken Sie auf Application 폷 New…
2. Im nächsten Schritt müssen Sie einen technischen Namen (ohne
Leer- und Sonderzeichen) und optional eine Beschreibung eingeben. Wählen Sie das Zielgerät unter Target Device (siehe Abbildung 5.37).
Abbildung 5.37 Anlegen einer neuen Anwendung
Abbildung 5.36 Tabstrip-Container
5.4
Anlegen einer Design-Studio-Anwendung
Nachdem Sie in den vorangegangenen Abschnitten die Anwendungsoberfläche von Design Studio kennengelernt haben, möchten
wir Ihnen nun zeigen, wie Sie Ihre erste Applikation lokal erstellen,
speichern und öffnen können. Starten Sie dafür Ihr Design Studio,
und prüfen Sie in den Einstellungen, ob als Preferred Startup
Mode der Local Mode eingestellt ist (siehe Abschnitt 5.1.1).
144
3. Klicken Sie auf die Schaltfläche Next. (Klicken Sie auf Finish, um
ohne Vorlage fortzufahren.)
4. Hier können Sie – abhängig von Ihrer Wahl des Zielgeräts – eine
Vorlage aussuchen. Wählen Sie Blank, um eine leere Anwendung
zu erstellen.
5. Klicken Sie auf die Schaltfläche Finish, um das Erstellen der
Anwendung zu bestätigen.
Sie haben nun Ihre erste Anwendung erfolgreich angelegt. Diese
wird automatisch gespeichert. Im nächsten Schritt möchten wir
Ihnen die Eigenschaften der Anwendung näher erläutern. Klicken
145
Eigenschaften der
Anwendung
5
Erste Schritte in SAP BusinessObjects Design Studio
Anlegen einer Design-Studio-Anwendung
Sie dafür im Outline-Bereich auf Ihre Anwendung (oberster Eintrag), um sich die Eigenschaften (Properties) anzeigen zu lassen.
왘 Custom CSS: Geben Sie unter Custom CSS den Pfad Ihrer CSSDatei ein, die Sie für Ihre Anwendung verwenden möchten.
왘 General
Unter General befinden sich die Details und Metadaten zu der
geöffneten Anwendung. Die meisten dieser Eigenschaften lassen
sich nicht ändern (außer Description) und dienen nur als Information für den Designer:
왘 Position of Message Button: Über die Auswahlliste können
Sie wählen, wo die Schaltflächen für z. B. die Warn- oder Fehlermeldungen in der Anwendung eingeblendet werden (siehe
Abbildung 5.38).
왘 Name: Technischer Name der Anwendung
왘 Type: Typ der Anwendung
왘 Description: Beschreibung der Anwendung
왘 Folder: Zeigt den Ordner an, in dem die Anwendung gespeichert ist. Diese Eigenschaft sehen Sie nur, wenn Sie die BI-Plattform einsetzen.
왘 Created By: Zeigt den Benutzernamen des Erstellers der
Anwendung an.
왘 Loading Indicator Delay: Spezifizieren Sie, mit welcher Verspätung (in Millisekunden) der Ladebalken angezeigt wird.
왘 Position of Message Window: Position der Nachrichten –
rechts oder links am Rand (siehe Abbildung 5.38).
왘 Displayed Message Types: Wählen Sie, welche Nachrichtentypen (Error, Warnungen) angezeigt werden. Wir empfehlen
Ihnen, dass Sie sich alle Nachrichtentypen anzeigen lassen, während Sie Ihre Anwendung testen.
왘 Creation Time: Zeigt das Datum und die Uhrzeit an, wann die
Anwendung angelegt wurde.
왘 Last Modified By: Letzter Änderer
왘 Last Modification Time: Datum und Uhrzeit der letzten Änderung
왘 Content Version: Versionsnummer der Anwendung
왘 Behaviour
Mit Maximum Number of Undo Steps können Sie bestimmen,
wie viele Schritte innerhalb der Anwendung rückgängig gemacht
werden können.
왘 Display
In der Kategorie Display befinden sich Eigenschaften zum Aussehen der Anwendung. Sie können hier unter anderem Ihr CSSLayout einbinden und den Stil der Anwendung ändern.
왘 Theme: Wählen Sie hier unterschiedliche Stile für Ihre Anwendung aus (High Contrast Black, Platinum, Blue Crystal, Mobile).
Abhängig vom gewählten Stil verändern sich beispielsweise der
Hintergrund oder die Tabellenfarben.
146
Abbildung 5.38 Anzeige von Warnmeldungen
왘 Prompts
Der Bereich Prompts ist nur relevant, falls Ihre Datenquelle Variablen und Eingabeparameter enthält. Darüber können Sie unter
anderem steuern, in welcher Reihenfolge die Abfragen aufgerufen
werden:
왘 Merge Prompts: Diese Eigenschaft steht Ihnen ab Version 1.5
zur Verfügung. Setzen Sie diese Eigenschaft auf True, falls Sie
die Eingabeparameter unterschiedlicher Datenquellen zusammenführen möchten.
147
5.4
5
Erste Schritte in SAP BusinessObjects Design Studio
왘 Force Prompts on Startup: Sollte die Datenquelle Variablen
oder Input-Parameter enthalten, so können Sie erzwingen, dass
diese beim Aufruf der Anwendung abgefragt werden.
왘 Prompt Settings: Hier können Sie die Reihenfolge der Abfragen definieren.
왘 Maximum Number of Members: Sie können die maximale
Anzahl von Werten in der Werteliste für Variablen und InputParameter definieren. Im Standard werden 100 Werte geladen.
Anlegen einer Design-Studio-Anwendung
5.4.2
Hinzufügen und Bearbeiten von Komponenten
Auch beim Hinzufügen von Komponenten haben Sie mehrere Möglichkeiten, um zum Ziel zu gelangen (siehe Abbildung 5.39): Wählen
Sie unter Analytic Components die Crosstab aus, und ziehen Sie
diese entweder direkt in den Arbeitsbereich Editor-Layout oder in
den Outline-Bereich auf den Ordner Layout (siehe Abschnitt 5.1.3).
Komponente
hinzufügen
왘 Width/Height of Dialog Box for Inplace Prompts: Ändern
Sie hier die Größe des Dialogfensters für Abfragen (ab DesignStudio-Version 1.4 verfügbar).
왘 Planning
Unter Planning befinden sich die Eigenschaften für die Planung.
Diese Kategorie ist nur dann wichtig, wenn Sie die BW-integrierte
Planung nutzen (siehe Kapitel 13, »Integration der Planungskomponenten«):
왘 Planning Connection: Definition der Backend-Verbindung für
das Planungsszenario
왘 Planning Model: Name des Planungsmodells
왘 Scripting
Scripting beinhaltet die Eigenschaft Global Script Variables, um
globale Variablen zu erstellen. Diese können Sie dann im Scripting
innerhalb der Anwendung global verwenden.
왘 Events
왘 On Variable Initialization: Hier können Sie Werte für Variablen und Eingabeparameter setzen. Dieses Script wird vor dem
Startup-Script und vor dem Setzen der Variablen ausgeführt.
왘 On Startup: Dieses Script wird beim Aufruf der Anwendung
ausgeführt. Beispielsweise können Sie hier Ihre Datenquellen
initialisieren oder auf bestimmte Werte vorfiltern etc.
왘 On Background Processing: Um die erste Wartezeit beim
Laden von Datenquellen zu minimieren, können Sie hier das
Scripting für Hintergrundprozesse hinterlegen.
왘 On Before Prompts Submits: Ab der Version 1.5 können Sie
hier Ereignisse definieren, die vor dem Ausführen der Eingabeparameter stattfinden sollen.
148
Abbildung 5.39 Komponente hinzufügen
Jede Komponente hat ihre individuellen Eigenschaften. Es gibt
jedoch Kategorien, die in allen Komponenten verfügbar sind: General und Layout.
왘 General
왘 Name: Hier sehen Sie den technischen Namen einer Komponente, der automatisch beim Hinzufügen generiert wird. Diesen
können Sie im Nachhinein ändern. Der technische Name sollte
ohne Leer- und Sonderzeichen sein und in der Anwendung nur
einmal vorkommen.
왘 Type: Zeigt den Komponententypen an.
왘 Visible: Einstellung, ob die Komponente beim initialen Aufruf
sichtbar ist. Sie können mit Scripting die übereinanderliegenden Komponenten ein- und ausblenden.
149
Gemeinsame
Eigenschaften
bearbeiten
5.4
5
Erste Schritte in SAP BusinessObjects Design Studio
왘 Layout
In den Layout-Eigenschaften können Sie die Position einzelner oder
mehrerer Komponenten gleichzeitig ändern. Sie haben sechs mögliche Layout-Angaben (siehe Abbildung 5.40): Top Margin
(Abstand zum oberen Rand), Left Margin (Abstand zum linken
Rand), Bottom Margin (Abstand zum unteren Rand), Right Margin (Abstand zum rechten Rand), Width (Breite) und Height (Höhe).
Anlegen einer Design-Studio-Anwendung
Abbildung 5.42 Tooltip
5.4.3
Design-Studio-Anwendung testen
Sie können Ihre Anwendung jederzeit – unabhängig davon, welche
Plattform Sie nutzen – lokal testen. Zum Testen der Anwendung wird
das Speichern nicht benötigt.
Abbildung 5.40 Layout-Einstellungen
Dynamisches
Layout
Wenn Sie hier eine fixe Breite (Width) und Höhe (Height) für Ihre
Komponente angeben, dann passt sich diese nicht automatisch an
die Bildschirmauflösung an (siehe Abbildung 5.41). Um eine automatische Anpassung an eine beliebige Bildschirmgröße zu gewährleisten, empfehlen wir, dynamische Layout-Angaben zu machen:
Geben Sie den Abstand zu den Rändern an (statt einer fixen Breite
und Höhe), und stellen Sie die Höhe sowie Breite in den Eigenschaften auf auto.
Klicken Sie in der Werkzeugsymbolleiste auf Execute Locally (
)
oder drücken Sie (Strg) + (F11) (siehe Abbildung 5.43). Es öffnet sich
ein Browserfenster, in dem Ihre Anwendung ausgeführt wird.
Abbildung 5.43 Anwendung testen
Wiederholtes Testen
Beim wiederholten Testen müssen Sie nicht immer auf Execute Locally klicken. Sie können auch Ihre Anwendung im Browserfenster aktualisieren.
Wenn Sie auf den kleinen Pfeil neben Execute Locally klicken, so
öffnet sich ein Menü (siehe Abbildung 5.43). Hier haben Sie mehrere
Möglichkeiten, Ihre Anwendung auszuführen:
왘 Execute Locally: siehe oben.
Abbildung 5.41 Dynamische Größenanpassung einer Komponente
Tooltip
Ab Design-Studio-Version 1.4 wurden die meisten Komponenten
um eine weitere Eigenschaft, den Tooltip, erweitert. Dieser ermöglicht es Ihnen, einen Informationstext zu hinterlassen, der eingeblendet wird, wenn der Endbenutzer mit der Maus über die Komponente
fährt (siehe Abbildung 5.42).
150
왘 Execute on BI Plattform/Execute on SAP HANA/Execute on
SAP NetWeaver: Testen Sie Ihre Anwendung direkt auf der
gewählten Plattform.
왘 Send to Mobile Device (using QR Code): Wie bereits in Abschnitt
5.2.1 beschrieben, können Sie Ihre Anwendung auf einem mobilen Endgerät testen. Prüfen Sie dazu in den Einstellungen (Tools 폷
Preferences), ob Ihre Anwendung für einen externen Zugriff freigeschaltet ist.
151
5.4
5
Erste Schritte in SAP BusinessObjects Design Studio
5.4.4
Design-Studio-Anwendung speichern
Nachdem Sie Ihr Dashboard erstellt und getestet haben, können Sie
es auf der Plattform speichern, an der Sie angemeldet sind (siehe
Abschnitt 5.1.1): Klicken Sie in der Menüleiste auf Application 폷
Save…
Sollten Sie Ihre Anwendung unter einem neuen Namen abspeichern
wollen, dann gehen Sie wie folgt vor:
Templates
왘 Basic Analysis Template: Basis-Vorlage für Desktop-Anwendungen mit einem Registerkarten-Container, einer Kreuztabelle,
einem Diagramm und einem Filterbereich
왘 Data Discovery and Visualization Template: Diese Vorlage
kann für die Online-Datenanalyse und -Datenvisualisierung eingesetzt werden.
2. Geben Sie den Namen der neuen Anwendung in das Feld Name
ein.
왘 Generic Analysis Template: Für generische Datenanalyse mit
Slice und Dice. Sie können diese Vorlage direkt im Browser ausführen und zur Laufzeit eine Datenquelle hinzufügen. Sollten Sie
vorher eine Datenquelle eingefügt haben, so wird diese Vorlage
initial mit Daten angezeigt.
3. Geben Sie optional die Beschriftung der Anwendung in das Feld
Description ein.
왘 KPI Dashboard Template: Vorlage für ein KPI-Dashboard mit
einer Übersichtsseite und Detailseiten für KPIs.
4. Bestätigen Sie mit Save.
왘 KPI Details Template: Vorlage für KPI-Details
Falls Sie mehrere Anwendungen geöffnet und bearbeitet haben, können Sie diese gleichzeitig abspeichern. Klicken Sie dazu in der Menüleiste auf Application 폷 Save All.
왘 Online Composition Template: Diese Vorlage dient dazu, neue
Dashboards online auf Basis von Portable Fragment Bookmarks zu
erstellen (siehe Kapitel 10).
1. Klicken Sie in der Menüleiste auf Application 폷 Save as…
왘 Planning Template: Vorlage für Planungsanwendungen
5.5
Templates
Das Design Studio stellt Ihnen Standardvorlagen für drei unterschiedliche Endgeräte zur Verfügung: Desktop, iPhone und iPad.
Abhängig davon, welches Endgerät Sie beim Anlegen einer Anwendung wählen, werden Ihnen unterschiedliche Vorlagen angeboten.
Diese unterscheiden sich sowohl in der Auflösung als auch in der
Bedienbarkeit.
5.5.1
Desktop
Für Desktop-Anwendungen werden folgende Templates bereitgestellt:
5.5.2
iPad
Für das iPad sind die folgenden Templates verfügbar:
왘 Blank: Leeres Template ohne Inhalte
왘 Ad-Hoc Analysis Template: Vorlage für Ad-hoc-Analysen mit
Slice und Dice
왘 iPad Template 1: Vorlage mit einem Pagebook-Container zum
Blättern auf einem iPad
왘 iPad Template 2: Diese Vorlage basiert auf der Vorlage iPad Template 1 und beinhaltet zusätzlich einen Filterbereich.
왘 Blank: Leeres Template ohne Inhalte
왘 iPad Template 3: Diese Vorlage basiert auf der Vorlage iPad Template 1 und beinhaltet zusätzlich ein Dialogfenster für Einstellungen.
왘 Ad-Hoc Analysis Template: Vorlage für Ad-hoc-Analysen mit
Slice und Dice
왘 KPI Dashboard Template: Vorlage für ein KPI-Dashboard mit
einer Übersichtsseite und Detailseiten für KPIs
왘 KPI Details Template: Vorlage für KPI-Details
152
153
5.5
5
Erste Schritte in SAP BusinessObjects Design Studio
5.5.3
Templates
iPhone
Für das iPhone gibt es die folgenden Templates:
왘 Blank: Leeres Template ohne Inhalte
왘 iPhone Template 1: Vorlage mit Registerkarten als Navigation
왘 iPhone Template 2: Vorlage mit Pagebook-Container als Navigation
5.5.4
Anwendung mit Template anlegen
Gehen Sie folgendermaßen vor, um in Ihren Anwendungen Vorlagen zu nutzen:
1. Öffnen Sie Design Studio, und klicken Sie in der Menüleiste auf
Application 폷 New ( ).
2. Geben Sie den Namen (Name) und eine Beschreibung (Description) der Anwendung ein.
3. Wählen Sie in der Auswahlliste Target Device das Endgerät, für
das Ihre Anwendung vorgesehen ist (siehe Abbildung 5.44).
Abbildung 5.45 Vorlage auswählen
6. Es wird eine Anwendung basierend auf der gewählten Vorlage
geladen. Die Anwendung enthält grafische Analyseobjekte und
Scripting (siehe Abbildung 5.46).
Abbildung 5.46 »Ad-Hoc Analysis«-Vorlage
Abbildung 5.44 Endgerät selektieren
5.5.5
4. Klicken Sie auf die Schaltfläche Next, um eine Vorlage zu selektieren.
5. Wählen Sie im nächsten Schritt Ihre Vorlage aus, und bestätigen
Sie mit Finish (siehe Abbildung 5.45).
154
Voraussetzungen
Manche Vorlagen, wie z. B. das Ad-Hoc Analysis Template, verwenden Bild- und CSS-Dateien (Cascading Style Sheets). Mit CSS-Dateien
können Sie die Darstellungsvorgaben (z. B. Schriftarten, Farben,
Schriftgrößen) Ihrer Anwendung von den eigentlichen DesignStudio-Inhalten trennen. Die CSS-Datei, die genutzt wird, sehen Sie
155
Bild- und CSSDateien
5.5
5
Erste Schritte in SAP BusinessObjects Design Studio
in den Eigenschaften (Properties 폷 Display 폷 Custom CSS) der Anwendung (siehe Abbildung 5.47). Mehr zu CSS finden Sie in Kapitel 7.
Templates
5.5.6
Eigene Vorlagen erstellen
Ab Design-Studio-Version 1.5 haben Sie die Möglichkeit, eine
Anwendung als Vorlage zu exportieren:
1. Öffnen Sie Design Studio.
2. Wählen Sie in der Menüleiste Application 폷 Export as Template…
(siehe Abbildung 5.48).
Abbildung 5.47 CSS-Datei
Manuelles
Hochladen
Wenn Sie lokal mit Design Studio arbeiten, dann greift Ihre Anwendung automatisch auf diese Dateien zu, die bei der Installation mitgeliefert werden. Auf den HANA-, SAP-NetWeaver- und BI-Plattformen existieren diese Dateien jedoch nicht per Default und werden
normalerweise erst beim Speichern neu angelegt. Aufgrund von
technischen Restriktionen der SAP-NetWeaver-Plattform müssen die
Bilddateien der Vorlagen separat hochgeladen werden (dies kann
auch wegen fehlender Berechtigungen bei der BI-Plattform passieren). Ist dies der Fall, dann gehen Sie folgendermaßen vor:
1. Legen Sie eine Anwendung mit einer Vorlage an, und navigieren
Sie zu dem lokalen Ordner, in dem die Vorlagen standardmäßig
installiert werden.
2. Öffnen Sie den Ordner (Desktop, iPad oder iPhone) abhängig von
Ihrem Endgerät.
3. Öffnen Sie die Vorlage, die Sie genutzt haben (z. B. TEMPLATE_
ADHOC_ANALYSIS).
4. Laden Sie folgende Dateien separat auf die verwendete Plattform
hoch (siehe Abschnitt 1.2):
왘 alle vorhandenen Bilddateien
왘 *.css-Datei
왘 *.eot-Datei
왘 *.ttf-Datei
5. Gehen Sie in Ihre Anwendung zurück, und tauschen Sie die Pfade
für Bild- und CSS-Dateien entsprechend aus.
156
Abbildung 5.48 Anwendung als Vorlage exportieren
3. Sollten Sie bereits eine Anwendung geöffnet haben, so wird diese
automatisch als Anwendung ausgewählt, die zu exportieren ist.
Klicken Sie auf Browse…, um eine andere Anwendung zu selektieren.
4. Lassen Sie das Kontrollkästchen Export referenced files aktiv, so
werden die in der Anwendung genutzten MIME-Objekte (CSS und
Bilddateien) automatisch erkannt und mit exportiert.
5. Klicken Sie auf Next, um weitere Details für die exportierte Vorlage zu definieren: Zielordner, technischer Name, Kategorie (Desktop, iPad, iPhone), angezeigter Name und Beschreibung.
6. Klicken Sie auf Finish, um die Anwendung als Vorlage zu exportieren (siehe Abbildung 5.49).
157
5.5
5
Erste Schritte in SAP BusinessObjects Design Studio
Templates
5.5.8
Eigene Vorlagenkategorien erstellen
Standardmäßig existieren drei unterschiedliche Vorlagenkategorien:
Desktop, iPad und iPhone. Ab Version 1.5 können Sie auch eigene
Kategorien anlegen:
1. Klicken Sie in der Menüleiste auf Tools 폷 Preferences 폷 Application Design 폷 Application Templates.
2. Klicken Sie im Feld User-defined Template Categories auf
Add…, um eine neue Kategorie anzulegen (siehe Abbildung 5.51).
Abbildung 5.49 Vorlage-Details
5.5.7
Vorlage verwenden
Ihre Vorlage steht nun beim Erstellen einer neuen Anwendung zur
Verfügung:
Abbildung 5.51 Vorlagen-Kategorie anlegen
1. Legen Sie dafür eine neue Anwendung an.
2. Klicken Sie auf Next, um eine Vorlage auszuwählen.
3. Ihre erstellte Vorlage wird nun in der Übersicht aufgelistet (siehe
Abbildung 5.50).
3. Bestätigen Sie mit OK. Beim Exportieren einer Vorlage können Sie
nun Ihre Kategorie auswählen (siehe Abbildung 5.52), die auch
beim Anlegen neuer Anwendungen aufgelistet wird.
Abbildung 5.52 Kategorie wählen
Abbildung 5.50 Eigene Vorlage wählen
158
159
5.5
5
Erste Schritte in SAP BusinessObjects Design Studio
5.6
Anwendungsfall
In diesem Abschnitt möchten wir unser erstes Layout erstellen, das
wir im Verlauf dieses Buches auch für andere Beispiele verwenden
werden. Dieses Anwendungsbeispiel ist für den Internet Explorer
optimiert. Das Layout setzt sich aus Basic Components und Container Components zusammen, die Sie bereits in Abschnitt 5.3 kennengelernt haben. Als Grundlage orientieren wir uns an den
Mockups aus Abschnitt 2.3.
1. Öffnen Sie Design Studio im lokalen Modus.
2. Klicken Sie auf New, um eine neue Anwendung zu erstellen, und
geben Sie die Werte aus Abbildung 5.53 ein.
Anwendungsfall
5. Um einen Header mit Überschrift und Logo anzulegen, gehen Sie
folgendermaßen vor: Fügen Sie ein Panel aus den Container
Components ein. Ziehen Sie dann per Drag & Drop eine Text- und
eine Image-Komponente aus den Basic Components in das Panel
(entweder direkt im Layout-Editor oder in den Outline-Bereich).
Klicken Sie anschließend auf die jeweilige Komponente, um die
Eigenschaften zu bearbeiten. Tabelle 5.1 zeigt die möglichen
Eigenschaften und Werte für die verschiedenen Komponenten.
Komponente
Eigenschaft
Wert
Panel
Name
HEADER
Layout
0, 0, auto, 0, auto, 35
Name
TITEL
Text
Sales Overview
Style
Heading 1
Layout
0, 5, auto, auto, 300, 35
Name
LOGO
Image
Bildpfad/URL
Layout
0, auto, auto, 0, 75, 35
Text
3. Bestätigen Sie mit Finish.
Image
Tabelle 5.1 Eigenschaften der Komponenten für den Header
6. Um ein Sidepanel anzulegen, fügen Sie aus den Container Components ein Panel hinzu und bearbeiten Sie seine Eigenschaften.
Tabelle 5.2 gibt die verfügbaren Werte an:
Abbildung 5.53 Anwendungsfall – Layout erstellen
4. Klicken Sie im Outline-Bereich auf Ihre Anwendung, um die
Eigenschaften zu bearbeiten, und ändern Sie im Display das
Theme auf Blue Crystal (siehe Abbildung 5.54). Der Hintergrund
Ihrer Anwendung wird nun blau angezeigt.
Komponente
Eigenschaft
Wert
Panel
Name
SIDEMENU
CSS Style
background-color: white;
Layout
88, 15, 15, 15, auto, auto
Tabelle 5.2 Eigenschaften der Komponenten für das Sidemenü
7. So legen Sie einen Tabstrip-Container an: Fügen Sie aus den Container Components ein Tabstrip hinzu, und bearbeiten Sie seine
Eigenschaften (siehe Tabelle 5.3):
Abbildung 5.54 Stil der Anwendung auf »Blue Crystal« setzen
160
161
5.6
5
Erste Schritte in SAP BusinessObjects Design Studio
Anwendungsfall
Komponente
Eigenschaft
Wert
Tabstrip
Name
TABSTRIP
Layout
60, 60, 15, 60, auto, auto
Tabelle 5.3 Eigenschaften der Komponenten für die Registerkarte
9. Anlegen eines Footers: Fügen Sie aus den Container Components ein Panel hinzu, und bearbeiten Sie seine Eigenschaften
wie folgt:
Komponente
Eigenschaft
Wert
Panel
Name
FOOTER
Layout
Auto, 70, 16, 70, auto, 35
CSS Style
background: #FFFFFF;
8. Um neue Registerkarten hinzuzufügen und die Beschriftungen der
Registerkarten zu ändern, gehen Sie folgendermaßen vor:
Führen Sie im Outline-Bereich einen Rechtsklick auf TABSTRIP
aus, und klicken Sie dann auf Create Child 폷 Tab (siehe Abbildung
5.55). Wiederholen Sie diesen Schritt, bis Sie drei Registerkarten
angelegt haben.
border-top-style: solid;
border-color: #007CC0;
Tabelle 5.4 Eigenschaften des Panels für einen Footer
Einen einfachen Strich zur Abgrenzung zwischen Ihrem Anzeigebereich und dem Footer können Sie über den CSS Style anlegen
(siehe Abbildung 5.57).
Abbildung 5.55 Neue Registerkarten anlegen
Um die Beschriftungen zu ändern, selektieren Sie eine Registerkarte und ändern den Text in den Eigenschaften (siehe Abbildung
5.56) in dieser Reihenfolge: Home, Revenue Trend, Revenue by
Product Line.
Abbildung 5.57 »CSS Style« anpassen
10. Fügen Sie zu Ihrem Footer zwei Text-Elemente hinzu, um den
angemeldeten Benutzer und das Datum anzeigen zu lassen
(Tabelle 5.5).
Komponente
Eigenschaft
Wert
Text
Name
USER
Text
User:
Layout
5, 5, auto, auto, 80, 30
Tabelle 5.5 Eigenschaften der Komponenten für den Footer
Abbildung 5.56 Registerkarte »Beschriftungen«
162
163
5.6
5
Erste Schritte in SAP BusinessObjects Design Studio
Anwendungsfall
ein, und bearbeiten Sie die Eigenschaften. Tabelle 5.7 enthält die
Eigenschaften und Werte.
Komponente
Eigenschaft
Wert
Text
Name
DATE
Text
Date:
Komponente
Eigenschaft
Wert
CSS Style
text-align: right;
Text
Name
INFORMATION
Layout
5, auto, auto, 5, 125, 30
Text
INFORMATION
CSS Style (unter
anderem zum
Drehen des
Textes)
font-size: 16px;
Tabelle 5.5 Eigenschaften der Komponenten für den Footer (Forts.)
11. Anlegen von Icons für die Navigation im linken Sidemenü:
Fügen Sie vier Image-Komponenten in das SIDEMENU (Panel)
ein, und bearbeiten Sie die Eigenschaften mit den Werten aus
Tabelle 5.6:
Komponente
Eigenschaft
Wert
Image
Name
SETTINGS
Image
Pfad zur Bilddatei
Tooltip
Settings
Layout
10, 5, auto, auto, 30, 30
Name
FILTER
Image
Pfad zur Bilddatei
Tooltip
Filter
Layout
60, 5, auto, auto, 30, 30
Name
BOOKMARK
Image
Pfad zur Bilddatei
Tooltip
Bookmark
Layout
110, 5, auto, auto, 30, 30
Name
PRINT
Image
Pfad zur Bilddatei
Tooltip
Print
Layout
160, 5, auto, auto, 30, 30
Image
Image
Image
Tabelle 5.6 Eigenschaften der Icons (Menüleiste links)
-webkit-transform:
rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
writing-mode: tb-rl;
Text
Tooltip
Information
Layout
10, auto, auto, 15, 30, 100
Name
CONTACT
Text
CONTACT
CSS Style (unter
anderem zum
Drehen des
Textes)
font-size: 16px;
-webkit-transform:
rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
writing-mode: tb-rl;
Tooltip
Contact
Layout
150, auto, auto, 15, 30, 100
Tabelle 5.7 Eigenschaften der Textelemente (Menüleiste rechts)
Das Layout für Ihre erste Anwendung wäre somit abgeschlossen.
Speichern Sie Ihre Anwendung und vergleichen Sie zum Abschluss
Ihre Outline-Ansicht mit Abbildung 5.58. Es ist wichtig, dass die
Menüelemente auch innerhalb des SIDEMENU richtig gruppiert sind
und dass die technischen Namen übereinstimmen, da Sie diese für
das weitere Scripting in den nächsten Kapiteln benötigen.
12. Anlegen von Texten für die Navigation im rechten Sidemenü:
Fügen Sie zwei Text-Komponenten in das SIDEMENU (Panel)
164
165
5.6
5
Erste Schritte in SAP BusinessObjects Design Studio
Abbildung 5.58 Outline-Ansicht für das Layout
Testen Sie Ihre Anwendung mit (Strg) + (F11) (siehe Abbildung
5.59).
Abbildung 5.59 Layout für die Anwendung
166