Übungseinheit – Panel von Schaltflächen und dynamischen Menüs

  • 10 Minuten

Es gibt verschiedene Möglichkeiten, Eingaben bereitzustellen. Eingaben lösen bestimmte Ereignisse aus und führen einige Änderungen aus. Ui-Komponenten unterstützen Benutzer bei der Interaktion mit den Hologrammen in der Szene.

Erstellen eines statischen Bereichs mit Schaltflächen

  1. Klicken Sie im Hierarchiefenster mit der rechten Maustaste auf das RoverExplorer-Objekt , und wählen Sie "Leer erstellen" aus, um ein leeres Objekt als untergeordnetes Element des RoverExplorer hinzuzufügen. Benennen Sie die Objektschaltflächen, und konfigurieren Sie die Transformationskomponente wie folgt:

    • Position: X = -0,6, Y = 0,036, Z = -0,5
    • Drehung: X = 90, Y = 0, Z = 0
    • Skalierung: X = 1, Y = 1, Z = 1

    Screenshot von Unity mit neu erstelltem Schaltflächenobjekt, das ausgewählt und positioniert wurde.

  2. Navigieren Sie im Projektfenster zum Ordner Assets>MRTK.Tutorials.GettingStarted>Prefabs, ziehen Sie das PressableCylinderButton Prefab per Drag-and-Drop auf das Buttons-Objekt, klicken Sie mit der rechten Maustaste auf das PressableCylinderButton und wählen Sie Duplizieren, um eine Kopie zu erstellen. Wiederholen Sie diesen Vorgang, bis Sie insgesamt drei PressableCylinderButton-Objekte unter Buttons haben.

    Screenshot von Unity mit neu hinzugefügten PressableRoundButton-Prefabs.

    In einem Fenster werden Sie aufgefordert, TextMesh Pro zu importieren. Wählen Sie die erste Option für "TMP Essentials importieren" aus.

  3. Wählen Sie im Hierarchiebereich das Schaltflächenobjekt aus, und wählen Sie dann im Inspektorbereich " Komponente hinzufügen" aus, um die Objektleistenkomponente hinzuzufügen. Konfigurieren Sie sie wie folgt:

    • Richtung des Objektbalkenflusses: Horizontal
    • Abstand zwischen: X = 0,2, Y = 0

    Weisen Sie jedes Objekt unter Buttons der Liste Object Bar Objects (Objektleistenobjekte) in der Komponente Object Bar zu:

    Screenshot des Unity Buttons-Objekts mit hinzugefügter, konfigurierter und angewendeter GridObjectCollection-Komponente.

  4. Geben Sie den Schaltflächen im Bereich „Hierarchy“ (Hierarchie) die Namen Hints (Hinweise), Explode (Erweitern) und Reset (Zurücksetzen). Ändern Sie für jede Schaltfläche die SpeechRecognitionKeyword-Eigenschaft unter "Advanced StatefulInteractable Settings" in der Komponente " Pressable Button ", um den Schaltflächennamen zu entsprechen::

    Screenshot mit konfigurierten Schaltflächentextbeschriftungen.

  5. Wählen Sie im Hierarchiebereich das Schaltflächenobjekt "Hints " aus, und konfigurieren Sie dann im Inspektorfenster das PressableButton.OnClicked () -Ereignis wie folgt:

    • Zuweisen des RoverAssembly-Objekts zum Feld None (Object)
    • Wählen Sie in der Dropdownliste "Keine Funktion " die Option "PlacementHintsController>TogglePlacementHints" () aus, um diese Funktion als auszuführende Aktion festzulegen, wenn das Ereignis ausgelöst wird.

    Screenshot des konfigurierten OnClick-Ereignisses des Hints-Button-Objekts.

  6. Wählen Sie im Hierarchiebereich das Explode-Schaltflächenobjekt aus, und konfigurieren Sie dann im Inspektorfenster das PressableButton.OnClicked ()- Ereignis wie folgt:

    • Zuweisen des RoverAssembly-Objekts zum Feld None (Object)
    • Wählen Sie im Dropdownmenü "Keine Funktion " die Option "ExplodedViewController>ToggleExplodedView()" aus, um diese Funktion als auszuführende Aktion festzulegen, wenn das Ereignis ausgelöst wird.

    Screenshot von Unity mit konfiguriertem OnClick-Ereignis für Explode-Schaltflächenobjekt.

  7. Drücken Sie die Wiedergabetaste, um in den Spielmodus zu gelangen. Halten Sie die Leertaste gedrückt, um die Hand zu aktivieren, und klicken Sie dann mit der Maus auf die Schaltfläche Hinweise, um die Sichtbarkeit der Platzierungshinweisobjekte umzuschalten:

    Screenshot der geteilten Ansicht des Unity Play-Modus mit gedrückter Schaltfläche

  8. Mit der Schaltfläche Erweitern wird die erweiterte Ansicht aktiviert und deaktiviert:

    Screenshot: In der geteilten Ansicht von Unity im Wiedergabemodus wird auf die Schaltfläche „Explode“ (Erweitern) geklickt.

    Die Schaltfläche "Zurücksetzen " wird später im Modul implementiert.

Erstellen eines dynamischen Menüs, das dem Benutzer folgt

  1. Navigieren Sie im Projektbereich zum Ordner Pakete>MRTK-UX-Komponenten>Nahmenü, klicken Sie und ziehen das NearMenuBase-Prefab in das Hierarchiefenster, legen Sie die Transform-Position auf X = 0, Y = -0,4, Z = 0 fest und konfigurieren Sie es wie folgt:

    • Stellen Sie sicher, dass der Tracked Target Type der SolverHandler-Komponente auf "Head" festgelegt ist.
    • Aktivieren Sie das Kontrollkästchen neben der RadialView Solver-Komponente, damit sie standardmäßig aktiviert ist.

    Screenshot: In Unity wurde das „Near Menu“-Prefab neu hinzugefügt.

  2. Benennen Sie im Fenster „Hierarchy“ (Hierarchie) das Objekt in Menu um, und erweitern Sie das untergeordnete Objekt MenuContent-HorizontalLayout (Menu and Pin) > Buttons-GridLayout (Buttons), um die drei Schaltflächen anzuzeigen:

    Screenshot von Unity mit ausgewähltem Menü-Objekt und erweitertem ButtonCollection-Objekt.

  3. Benennen Sie die erste Schaltfläche im Buttons-GridLayout (Schaltflächen) in Indikator um, und konfigurieren Sie dann im Hierarchiefenster das Indikatorspielobjekt wie folgt:

    • Wählen Sie das Frontplate > AnimatedContent > Icon > Label-Objekt aus, und ändern Sie die TextMesh Pro-Komponente so, dass sie dem Namen der Schaltfläche entspricht. Stellen Sie sicher, dass das Label-Objekt in der Hierarchie aktiviert ist.
    • Konfigurieren Sie das PressableButton.OnClicked()-Ereignis, indem Sie das Indicator-Objekt, das wie ein Chevron aussieht, dem Feld None (Object) zuweisen und GameObject > SetActive (bool) aus der Dropdownliste No Function auswählen (überprüfen Sie, ob das Kontrollkästchen für das Argument aktiviert ist).
    • Wählen Sie das Frontplate > AnimatedContent > Icon > UIButtonFontIcon-Objekt aus, und ändern Sie das Symbol in das Suchsymbol in der Komponente "Schriftartsymbolauswahl ". Sie finden dies in der Liste der Symbole, oder legen Sie den aktuellen Symbolnamen auf Symbol 130 fest.

    Screenshot: In Unity wurde die Komponente „Button Config Helper“ des „Indicator“-Schaltflächenobjekts konfiguriert.

  4. Um das Chevron Indicator-Objekt zu deaktivieren, wählen Sie im Hierarchiebereich das Indikatorobjekt aus, das wie ein Chevron aussieht, und klicken Sie dann im Inspektorbereich:

    • Deaktivieren Sie das Kontrollkästchen neben dem Namen, um es standardmäßig inaktiv zu machen.
    • Verwenden Sie die Schaltfläche " Komponente hinzufügen ", um die Komponente "Directional Indicator Controller(Script)" hinzuzufügen.

    Screenshot von Unity mit ausgewähltem und deaktiviertem

  5. Benennen Sie die zweite Schaltfläche in TapToPlace um, und konfigurieren Sie dann das TapToPlace-Spielobjekt im Hierarchiefenster wie folgt:

    • Wählen Sie das Frontplate > AnimatedContent > Icon > Label-Objekt aus, und ändern Sie die TextMesh Pro-Komponente so, dass sie dem Namen der Schaltfläche entspricht. Stellen Sie sicher, dass das Label-Objekt in der Hierarchie aktiviert ist.
    • Konfigurieren Sie das PressableButton.OnClicked()-Ereignis, indem Sie das RoverExplorer-Objekt >RoverAssembly dem Feld Keine (Objekt) zuweisen und TapToPlace>bool Enabled in der Dropdownliste Keine Funktion auswählen. (Stellen Sie sicher, dass das Kontrollkästchen für das Argument aktiviert ist.)
    • Wählen Sie das Frontplate > AnimatedContent > Icon > UIButtonFontIcon-Objekt aus, und ändern Sie das Symbol in das Handsymbol in der Komponente "Schriftartsymbolauswahl ". Sie finden dies in der Liste der Symbole, oder legen Sie den aktuellen Symbolnamen auf Symbol 13 fest.

    Screenshot: In Unity wurde die Komponente „Button Config Helper“ des „TapToPlace“-Schaltflächenobjekts konfiguriert.

  6. Wählen Sie im Fenster "Hierarchie" das Objekt RoverAssembly aus, und konfigurieren Sie dann die Komponente "Zum Platzieren tippen" (Skript) im Inspektor-Fenster wie folgt:

    • Deaktivieren Sie das Kontrollkästchen neben dem Namen, um es standardmäßig inaktiv zu machen.
    • Wählen Sie im Ereignisabschnitt On Placing Stopped () das Plussymbol aus, um ein neues Ereignis hinzuzufügen.
    • Weisen Sie das RoverExplorer>RoverAssembly-Objekt dem Feld None (Object) zu.
    • Wählen Sie in der Dropdownliste "Keine Funktion " die Option "TapToPlace>bool Enabled " aus, um diesen Eigenschaftswert zu aktualisieren, wenn das Ereignis ausgelöst wird.
    • Stellen Sie sicher, dass das Kontrollkästchen für das Argument deaktiviert ist.

    Screenshot von Unity mit neu konfigurierter TapToPlace-Komponente.