Erste Schritte
Grundlegende Methoden und Konzepte anwenden
Mit lokalen Klassen arbeiten
Daten aus der Datenbank lesen
Mit strukturierten Datenobjekten arbeiten
Mit komplexen internen Tabellen arbeiten
Datenbankänderungen mit Business Objects implementieren
Das ABAP-RESTful-Anwendungsprogrammiermodell beschreiben

Verbesserung der Benutzerfreundlichkeit

Objectives

After completing this lesson, you will be able to:
  • Ordnen Sie Felder in der App an.
  • Stellen Sie eine Eingabehilfe bereit.

UI-Anpassung

In diesem Abschnitt erfahren Sie, wie Sie Feldeigenschaften in der Verhaltensdefinition steuern und die Benutzungsoberfläche in der Metadatenerweiterung anpassen.

Felder auf der Benutzungsoberfläche anordnen

Felder schreibgeschützt machen

Sobald Sie die Felder schreibgeschützt gemacht haben, können Sie sehen, dass es sinnvoll ist, sie neu anzuordnen. Dazu annotieren Sie die entsprechenden Felder der Projektion. In den meisten Fällen tun Sie dies in einer Metadatenerweiterung.

Metadatenerweiterungen sind eigenständige Repository-Objekte, die die zu einer bestimmten CDS-Entität gehörenden Annotationen enthalten. Die Idee dahinter ist, sowohl die Definition der CDS-Entität als auch die Annotationen durch deren Trennung verständlicher zu machen. Andernfalls würde die CDS-Definition sehr lang und schwer lesbar werden.

Wenn Sie eine Metadatenerweiterung in Verbindung mit einer CDS-View verwenden möchten, muss die CDS-View die Annotation @Metadata.allowExtensions: true enthalten. Der Generator übernimmt dies für Sie und generiert automatisch sowohl eine Metadatenerweiterung für die Projektions-View als auch die entsprechende Annotation in der Projektions-View selbst.

Es gibt zwei wichtige UI-Annotationen, die Sie möglicherweise in der Metadatenerweiterung ändern müssen. Die erste ist @UI.LineItem. Dies ist ein Array, in dem Sie die Attributposition festlegen. Dies bestimmt die Position der Spalte auf der Berichtslistenseite der App.

Die zweite Annotation ist @UI.identification. Dies ist wiederum ein Array, in dem Sie auch die Attributposition festlegen. Dies bestimmt die Position des Felds auf der Einzelobjektseite, die während des Anlege- oder Aktualisierungsvorgangs angezeigt wird.

Felder neu anordnen

Steuern von Feldeigenschaften

Eingabehilfe

In diesem Abschnitt erfahren Sie, wie Sie den Benutzern eine Wertehilfe zur Verfügung stellen. Sehen Sie sich dieses Video an, um mehr zu erfahren.

Benutzungsoberfläche anpassen

In dieser Übung lernen Sie die in der Anwendung bereitgestellte Wertehilfe kennen. Darüber hinaus passen Sie die Benutzungsoberfläche der generierten App an: entweder direkt durch Bearbeiten der UI-Metadaten oder indirekt durch Anpassung des Business-Objekt-Verhaltens.

Vorlage:

  • keine

Lösung:

  • /LRN/S4D400_C_FLIGHT (Verhaltensprojektion)
  • /LRN/S4D400_C_FLIGHT (Metadatenerweiterung)

Voraussetzungen

Sie haben die vorherigen Übungen abgeschlossen. Sie haben die Datenbanktabelle Z##FLIGHT (wobei ## für Ihre Gruppennummer steht) angelegt und gefüllt und die Entwicklungsobjekte für einen OData-UI-Service generiert.

Aufgabe 1: Wertehilfe analysieren

Stellen Sie sicher, dass für das Feld Währung auf der Objektseite eine Wertehilfe angeboten wird. Untersuchen Sie, wo und wie diese Wertehilfe definiert ist.

Schritte

  1. Starten Sie die Vorschau des OData-UI-Service.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.

  2. Öffnen Sie die Objektseite für einen Flug im Bearbeitungsmodus.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.

  3. Stellen Sie sicher, dass für das Feld Währung eine Wertehilfe verfügbar ist.

    1. Öffnen Sie die Wertehilfe für das Feld Währung, das für den Flugpreis angezeigt wird.

  4. Kehren Sie zur Entwicklungsumgebung zurück, und erkunden Sie die Definition der Wertehilfe.

Aufgabe 2: Verhalten anpassen

Schließen Sie die Standardoperationen create und delete aus, und setzen Sie das Feld PlaneTypeID auf schreibgeschützt.

Notiz

Diese Änderungen sollten nur für Ihren OData-UI-Service gelten. Das Business-Objekt selbst sollte weiterhin das Anlegen und Löschen von Flügen sowie das Ändern des Flugzeugtyps unterstützen.

Schritte

  1. Deaktivieren Sie in der Verhaltensprojektion für Ihren Service die Standardoperationen create und delete.

    1. Öffnen Sie die Verhaltensprojektion ZC_##FLIGHT (wobei ## für Ihre Gruppennummer steht).

    2. Fügen Sie Kommentarmarkierungen vor den Anweisungen use create; und use delete; hinzu.

      Um die Kommentarmarkierungen hinzuzufügen, gehen Sie wie gewohnt vor: Markieren Sie die Codezeilen, die Sie kommentieren möchten, und drücken Sie Strg + <.

      Ihr Code sollte dann wie folgt aussehen:

      Code Snippet
      123
      // use create; use update; // use delete;

  2. Setzen Sie in der Verhaltensprojektion Ihres Business-Objekts das Feld PlaneTypeID auf schreibgeschützt.

    1. Fügen Sie in der Verhaltensprojektion den folgenden Quelltext hinzu:

      Code Snippet
      1
      field ( readonly ) PlaneTypeID;

      Notiz

      Die genaue Position der Anweisung spielt keine Rolle. Wir empfehlen, dass Sie es vor der Verwendung platzieren... Anweisungen.
  3. Aktivieren Sie die Verhaltensprojektion.

    1. Drücken Sie Strg + F3, um die Verhaltensprojektion zu aktivieren.

Aufgabe 3: UI-Metadaten anpassen

Blenden Sie die administrativen Felder auf der Benutzungsoberfläche aus. Stellen Sie sicher, dass nur Spediteur-ID und Verbindungs-ID als Selektionsfelder auf der Berichtslistenseite angezeigt werden. Ändern Sie die Feldreihenfolge auf der Objektseite, sodass PlaneTypeID vor Price angezeigt wird.

Schritte

  1. Bearbeiten Sie die Metadatenerweiterung der Projektions-View ZC_##Flight. Entfernen Sie alle UI-Annotationen für die Felder LocalCreatedBy, LocalCreatedAt, LocalLastChangedBy, LocalLastChangedAt und LastChangedAt, und ersetzen Sie sie durch @UI.hidden: true.

    1. Öffnen Sie die Metadatenerweiterung ZC_##FLIGHT, wobei ## für Ihre Gruppennummer steht.

    2. Passen Sie den Quelltext wie folgt an:

      Code Snippet
      1234567891011121314
      @UI.hidden: true LocalCreatedBy; @UI.hidden: true LocalCreatedAt; @UI.hidden: true LocalLastChangedBy; @UI.hidden: true LocalLastChangedAt; @UI.hidden: true LastChangedAt;
  2. Entfernen Sie die Annotation @UI.selectionField für alle Elemente außer den Elementen CarrierID und ConnectionID.

    1. Passen Sie den Quelltext wie folgt an:

      Code Snippet
      1234567891011121314151617181920212223
      @UI.identification: [ { position: 30 } ] @UI.lineItem: [ { position: 30 } ] FlightDate; @UI.identification: [ { position: 40 } ] @UI.lineItem: [ { position: 40 } ] Price; @UI.identification: [ { position: 50 } ] @UI.lineItem: [ { position: 50 } ] PlaneTypeID;
  3. Ändern Sie die Position des Feldes PlaneTypeID auf der Object Page. Platzieren Sie es zwischen FlightDate und Price.

    Hinweis

    Die Position auf der Object Page wird mit der Annotation @UI.identifier angegeben.
    1. Ändern Sie den Wert der Annotation @UI.identifier: [ { position: } ] für das Element PlaneTypeID. Wählen Sie einen Wert, der zwischen den Werten für die Elemente FlightDate und Price liegt.

    2. Passen Sie den Quelltext wie folgt an:

      Code Snippet
      1234567
      @UI.identification: [ { position: 35 } ] @UI.lineItem: [ { position: 50 } ] PlaneTypeID;
  4. Aktivieren Sie die Metadatenerweiterung.

    1. Drücken Sie Strg + F3, um die Metadatenerweiterung zu aktivieren.

Aufgabe 4: Ergebnis überprüfen

Starten Sie die Vorschau des OData-UI-Service neu, und überprüfen Sie die Änderungen an der Benutzungsoberfläche.

Schritte

  1. Starten Sie die Vorschau des OData-UI-Service neu.

    1. Schließen Sie das Browserfenster oder die Browserregisterkarte, die die Vorschau enthält.

    2. Öffnen Sie die Service-Bindung ZUI_##FLIGHT_O4. Wählen Sie in der Liste Entitätsmenge und Assoziation auf der rechten Seite zunächst den Eintrag Flug und dann Vorschau....

  2. Stellen Sie auf der Berichtslistenseite sicher, dass die Drucktasten Anlegen und Löschen verschwunden sind.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.

  3. Stellen Sie sicher, dass auf der Berichtslistenseite keine administrativen Felder mehr angezeigt werden.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.

  4. Stellen Sie sicher, dass neben dem Feld Bearbeitungsstatus oben auf der Berichtslistenseite nur zwei Auswahlfelder angezeigt werden. Testen Sie deren Funktionalität.

    Hinweis

    Beachten Sie, dass die Selektionsfelder die Eingabe mehrerer Werte und Bereiche unterstützen.
    1. Geben Sie im Auswahlfeld Fluggesellschafts-ID einen Wert ein (z.B. LH), und wählen Sie Start.

    2. Wiederholen Sie dies mit anderen Werten.

  5. Navigieren Sie für jedes Datenset zur Object Page. Stellen Sie sicher, dass die Drucktaste Löschen verschwunden ist.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.

  6. Stellen Sie sicher, dass auf der Object Page keine administrativen Felder mehr angezeigt werden.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.

  7. Stellen Sie sicher, dass das Feld Flugzeugtyp nach dem Feld Flugdatum und vor dem Feld Flugpreis angezeigt wird.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.

  8. Wechseln Sie in den Bearbeitungsmodus, und stellen Sie sicher, dass der Wert des Felds Flugzeugtyp nicht geändert werden kann.

    1. Fahren Sie wie in den vorangegangenen Übungen fort.