Während Google I / O 2015 führte Google die Design Support Library für Android-Entwickler ein. Diese Bibliothek macht es Entwicklern einfach, weitere Material Design-Konzepte in ihre Anwendungen zu implementieren, da viele Schlüsselelemente anfangs nicht sofort verfügbar waren. Die Design Support Library ist einfach zu verwenden und abwärtskompatibel zu API 7. Die Design Support Library kann in Ihre Android-Projekte aufgenommen werden, indem Sie die Gradle-Abhängigkeit importieren.
'com.android.support:design:22.2.0' kompilieren
In der Design Support Library gibt es zwei Hauptkategorien von Tools:
Wir beginnen mit einem Blick darauf, welche neuen visuellen Komponenten verfügbar sind, um Ihre Apps aufpolieren zu können.
Text bearbeiten
Ansichten gibt es von Anfang an in Android, und obwohl sie einfach zu verwenden sind, haben sie sich nicht wirklich geändert. Mit der Design Support Library hat Google eine neue Containeransicht eingeführt TextInputLayout
. Diese neue Ansicht erweitert den Standard um weitere Funktionen Text bearbeiten
, B. Unterstützung für Fehlermeldungen und animierte Hinweise, damit Ihre Benutzeroberfläche schnell angezeigt wird.
Wie im folgenden Ausschnitt gezeigt, TextInputLayout
kann als Wrapper für einen Standard in Ihre Layoutdatei eingefügt werden Text bearbeiten
.
Gianluca Segato wird sich das genauer ansehen TextInputLayout
Komponente in einem kommenden Tutorial.
Eine der vorherrschenden Komponenten der Benutzeroberfläche in Material Design-Apps ist die schwebende Aktionsschaltfläche. Seit ihrer Einführung mussten Entwickler diese Schaltflächen entweder von Grund auf neu erstellen oder eine der zahlreichen Bibliotheken von Drittanbietern auswählen, die speziell für diese Schaltflächen entwickelt wurden.
Mit der Design Support Library können schwebende Aktionsschaltflächen in ein Layout eingefügt und mit ein paar einfachen XML-Zeilen an einem Teil des Bildschirms verankert werden. Jede Schaltfläche lässt sich leicht mit Symbolen und Farben anpassen. Zwei Größen stehen zur Verfügung, Standard (56 dp) und Mini (40 dp). Einer der größten Vorteile ist, dass diese Schaltflächen jetzt von Google unterstützt werden, wenn sich ihr Design weiterentwickelt.
Während ViewPager
und Schubladenlayout
Komponenten sind seit einiger Zeit durch die erhältlich v4-unterstützungsbibliothek, Google hat sie mit zwei neuen zugehörigen Widgets erweitert. Die erste ist eine offizielle Version der allgemein verwendeten ViewPagerIndicator-Bibliothek von Jake Wharton TabLayout
. Der zweite ist der Navigationsansicht
, Dies bietet Unterstützung für die Schubladenkopfansichten.
TabLayout
TabLayout
Komponenten können Inhalte manuell im Code hinzugefügt werden addTab
Methoden. Schauen Sie sich das folgende Beispiel an.
tabLayout.addTab (tabLayout.newTab (). setText ("Tab 1")); tabLayout.addTab (tabLayout.newTab (). setText ("Tab 2")); tabLayout.addTab (tabLayout.newTab (). setText ("Tab 3"));
Alternativ können Sie verknüpfen TabLayout
Komponenten mit einem ViewPager
. Dies wird durch Aufrufen erreicht setupWithViewPager ()
, vorbei in der ViewPager
als erstes und einziges Argument. Dies ist eine weitere Möglichkeit, Abschnitte in der zu ändern ViewPager
. Es ist darauf hinzuweisen, dass getPageTitle ()
muss bei der Verwendung überschrieben werden TabLayout
mit einer ViewPager
jedem Tab einen eigenen Namen geben.
Navigationsansicht
Navigationsansicht
ist ein neues Widget, das die Funktionalität von erweitert Schubladenlayout
. Entwickler können jetzt der Schublade Header-Layouts hinzufügen und ausgewählte Abschnitte mit dieser benutzerfreundlichen Komponente markieren.
Darüber hinaus ist es jetzt sehr einfach, Abschnitte und Unterabschnitte in der Schublade über Menü-Ressourcendateien zu erstellen. Um anzufangen, a Navigationsansicht
muss einfach mit einem verbunden werden Schubladenlayout
in XML.
Während Toast
Nachricht ist seit Jahren ein Grundnahrungsmittel von Android, ein neues Widget für die Benutzeroberfläche Imbissbude
ist verfügbar, um ähnliche Funktionen mit einem verbesserten Aussehen bereitzustellen. Nicht nur das Imbissbude
Um dem Benutzer Informationen für einen kurzen Zeitraum zu präsentieren, unterstützt er auch eine einzige Aktion zum Hinzufügen von kontextbasierten Funktionen zu Ihren Apps und kann mit einer Wischbewegung abgewiesen werden.
Imbissbude
wird ähnlich implementiert Toast
, Es sollte jedoch beachtet werden, dass das Erstellen einer Ansicht eine Ansicht erfordert, die zum Auffinden des unteren Bereichs der App-Anzeige verwendet werden kann.
Snackbar.make (view, "Action", Snackbar.LENGTH_LONG) .setAction ("Action!", Neue View.OnClickListener () @Override public void onClick (Ansicht v) Log.e ("App", "Action! "); ) .Show();
Wie sich eine Benutzeroberfläche verhält und animiert, ist in Material Design sehr wichtig. Um dies zu erleichtern, hat Google mehrere Komponenten in der Design Support Library veröffentlicht, die bei häufig verwendeten Anwendungsfällen hilfreich sind. Kerry Perez-Huanca wird sich in einem kommenden Tutorial mit diesem Aspekt der Design Support Library befassen.
Sie haben vielleicht im vorherigen Beispiel bemerkt, dass die FloatingActionButton
aufgerückt, wenn die Imbissbude
Ansicht erschienen. Dies geschieht mit einem neuen Widget namens KoordinatorLayout
, welche Ansichten umhüllt, die verschoben werden sollten, um Platz für andere Ansichten zu schaffen.
Viele Entwickler haben nach einem einfacheren Weg gefragt, um ein Parallaxenbild anzuzeigen, das mit einem schnellen Entwurfsmuster arbeitet und beim Scrollen des Benutzers verschwindet oder wieder erscheint. Sie können dieses Verhalten im Play Store für App-Einträge sehen. Damit Entwickler dies ohne viel Zeit für das Schreiben von redundantem Code implementieren können, hat Google veröffentlicht CollapsingToolBarLayout
und AppBarLayout
Ansichten. Mithilfe verschiedener Optionen in diesen Widgets können Entwickler Ansichten an den oberen Bildschirmrand anfügen oder festlegen, wann diese Ansichten beim Scrollen des Benutzers sichtbar werden sollen.
Die Design Support Library hat Android viele lang erwartete Tools zur Verfügung gestellt. In Verbindung mit der AppCompat-Bibliothek wird das Hinzufügen von Materialdesign zu Apps viel einfacher, während die Abwärtskompatibilität erhalten bleibt.
Viele Beispiele für die Arbeit mit diesen neuen Komponenten finden Sie in der offiziellen Referenz-App von Google, CheeseSquare, und Tuts + wird weiterhin ausführliche Anleitungen zur Implementierung dieser neuen Funktionen bereitstellen.