Eine Schaltfläche kommuniziert eine Aktion, die ausgeführt wird, wenn Nutzende sie berühren.
Schaltflächen sind Standardkomponenten des Open-Source-Projekts von Android (AOSP). Sie können entweder mit einer einfarbigen Hintergrundfarbe gefüllt oder mit einem transparenten Hintergrund ohne Füllung ausgefüllt werden. Die ausgefüllten Schaltflächen kennzeichnen eine primäre oder bevorzugte Aktion. Im Gegensatz zu Tabs können Schaltflächen einzeln oder in Gruppen angezeigt werden.
Anatomie
![Anatomie der Tasten](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-anatomy-1.png?authuser=0&hl=de)
2. Ausgefüllter Schaltflächencontainer, der die primäre oder bevorzugte Aktion angibt
3. Beschriftung der Schaltfläche
Technische Daten
Mindest- und Höchstlänge der Schaltfläche
![Das Schaltflächenlabel darf maximal 20 Zeichen lang sein. Die Mindestbreite der Schaltfläche beträgt 156 dp.](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-spec-1.png?authuser=0&hl=de)
Schaltfläche mit Symbol vs. Standardschaltfläche
![Schaltflächen können Symbole enthalten. Sind Symbole enthalten, werden sie in der Regel links vom Schaltflächentext angezeigt.](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-spec-3.png?authuser=0&hl=de)
Schaltflächen können als Elemente in anderen Komponenten erscheinen, z. B. in der App-Leiste oder in Dialogfeldern.
Platzierung der Schaltfläche in der App-Leiste
![Schaltflächen befinden sich auf der rechten Seite der App-Leiste](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-spec-2.png?authuser=0&hl=de)
Schaltfläche im Dialogfeld
![Schaltflächen in Dialogfeldern befinden sich in der Regel links unten im Dialogfeld](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-spec-4.png?authuser=0&hl=de)
Hero-Schaltfläche
![Die abgerundeten Ecken einer Hero-Schaltfläche betonen ihre Bedeutung](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-spec-5.png?authuser=0&hl=de)
Anpassbare
OEMs können ihre Marke reflektieren, indem sie das visuelle Erscheinungsbild einer Schaltfläche verändern. Beispiele:
- Akzentfarbe festlegen
- Benutzerdefinierte Symbole bereitstellen
- Benutzerdefinierte Schriftarten hinzufügen
- Darstellung von aktiven, inaktiven und deaktivierten Schaltflächen ändern
- Abmessungen, Eckenform und Placements für Schaltflächen festlegen
- Verwendung von Bewegungen, um Nutzenden Feedback zu geben
Im Integrationsleitfaden für die Auto-UI-Bibliothek findest du OEM-Anleitungen zum Anpassen der Komponenten.
Das Designsystem bietet spezifische Anleitungen für die Verwendung von Layout, Farbe, Typografie, Größe, Form und Bewegung, um Komponenten anzupassen.
Beispiele
![nicht ausgefüllte und ausgefüllte Schaltflächen](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-mock-1.png?authuser=0&hl=de)
![Deaktivierte ausgefüllte Schaltfläche](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-mock-2.png?authuser=0&hl=de)
![Dialogfeld für nicht gefüllte Schaltfläche](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-mock-3.png?authuser=0&hl=de)
![Dauer der Wellenbewegung der Schaltfläche](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-different-shapes.gif?authuser=0&hl=de)
![Wellenanimation der Schaltflächen](https://developers.google.cn/cars/design/automotive-os/components/images/buttons-ripple.gif?authuser=0&hl=de)