Översikt över Android Design Support Library

Introduktion

Under Google I / O 2015 introducerade Google Design Support Library för Android-utvecklare. Det här biblioteket gör det enkelt för utvecklare att implementera mer materialkoncept i sina applikationer, eftersom många nyckelelement inte fanns tillgängliga från början. Utöver det enkla att använda, är Design Support Library bakåtkompatibelt med API 7. Design Support Library kan ingå i dina Android-projekt genom att importera Gradleberoende.

kompilera 'com.android.support:design:22.2.0'

1. Visuella komponenter

Det finns två huvudkategorier av verktyg i Design Support Library:

  • visuella komponenter
  • rörelse komponenter

Vi börjar med att titta på vilka nya visuella komponenter som finns tillgängliga för att lägga till polska i dina appar.

Material Text Input

Redigera text Visningar har funnits i Android sedan början, och medan de är enkla att använda har de inte riktigt förändrats mycket. Med Design Support Library har Google introducerat en ny containervy som heter TextInputLayout. Denna nya vy lägger till funktionalitet till standarden Redigera text, till exempel stöd för felmeddelanden och animerade tips som hjälper till att göra ditt användargränssnitt pop.

Som visas i nedanstående kod, TextInputLayout kan inkluderas i din layoutfil som en omslag för en standard Redigera text.

  

Gianluca Segato tar en närmare titt på TextInputLayout komponent i en kommande handledning.

Flytande åtgärdsknappar

En av de mest dominerande användargränssnittskomponenterna i Material Design apps är den flytande åtgärdsknappen. Sedan introduktionen måste utvecklarna antingen skapa dessa knappar från början eller välja ett av de många tredje partsbiblioteken som är utformade specifikt kring dessa knappar.

Med designstödsbiblioteket kan flytande åtgärdsknappar inkluderas i en layout och förankras till en del av skärmen med några enkla rader av XML. Varje knapp är lätt anpassningsbar med ikoner och färger. Två storlekar är tillgängliga, standard- (56dp) och mini (40dp). En av de största fördelarna är att dessa knappar nu kommer att stödjas av Google när deras design utvecklas.

Navigation Komponenter

Medan ViewPager och DrawerLayout komponenter har varit tillgängliga för ett tag genom v4 support bibliotek, Google har expanderat på dem genom att tillhandahålla två nya relaterade widgets. Den första är en officiell version av det vanliga VisPagerIndicator-biblioteket av Jake Wharton som heter TabLayout. Den andra är NavigationView, vilket ger stöd för läsarens huvudvy.

TabLayout

TabLayout komponenter kan ha innehåll till dem manuellt i kod genom att använda en av addTab metoder. Ta en titt på följande exempel.

tabLayout.addTab (tabLayout.newTab (). setText ("Tab 1")); tabLayout.addTab (tabLayout.newTab (). setText ("Tab 2")); tabLayout.addTab (tabLayout.newTab (). setText ("Tab 3"));

Alternativt kan du associera TabLayout komponenter med a ViewPager. Detta uppnås genom att ringa setupWithViewPager (), passerar i ViewPager som det första och enda argumentet. Detta är ett annat sätt att ändra sektioner i ViewPager. Det bör nämnas att getPageTitle () måste överrullas vid användning TabLayout med en ViewPager att ge varje flik ett riktigt namn.

NavigationView

NavigationView är en ny widget som utökar funktionaliteten hos DrawerLayout. Utvecklare kan nu lägga till huvudlayouter i lådan och markera valda avsnitt med denna lättanvända komponent.

Utöver detta är det nu väldigt enkelt att skapa sektioner och underavsnitt i lådan genom menyfunktionsfiler. För att komma igång, a NavigationView behöver helt enkelt vara associerad med a DrawerLayout i XML.

   

Förhöjda Toasts

Medan Rostat bröd Meddelandet har varit en häftning av Android i flera år, en ny användargränssnitt widget kallad Snackbar är tillgänglig för att ge liknande funktioner med ett förbättrat utseende. Inte bara gör Snackbar presentera information till användaren under en kort tid, stöder den också en enda åtgärd för att lägga till kontextbaserad funktionalitet till dina appar och kan avfärdas med en svepande gest.

Snackbar implementeras på liknande sätt som Rostat bröd, men det bör noteras att skapa en kräver en vy som kan användas för att hitta botten av appdisplayen.

Snackbar.make (se "Åtgärd", Snackbar.LENGTH_LONG) .setAction ("Action!", Ny View.OnClickListener () @Override public void onClick (Visa v) Log.e ("App", "Action! ");   ) .show();

2. rörelse komponenter

Hur ett användargränssnitt fungerar och animerar är mycket viktigt i Material Design. För att underlätta detta har Google släppt flera komponenter i Design Support Library som hjälper till med allmänt bruk. Kerry Perez-Huanca kommer att titta närmare på denna aspekt av Design Support Library i en kommande handledning.

Reaktiva vyer

Du kanske har märkt i det föregående exemplet att FloatingActionButton flyttade upp när Snackbar vyn visade sig. Detta görs med en ny widget som heter CoordinatorLayout, som omsluter åsikter som ska flyttas för att göra plats för andra synpunkter.

Förbättrad snabb retur och verktygsfält

Många utvecklare har bett om ett enklare sätt att visa en parallellbild som fungerar med ett snabbt återvändande designmönster, försvinner eller återkommer när användaren rullar. Du kan se detta beteende i Play Butik för applistan. För att låta utvecklare genomföra detta utan mycket tid för att skriva överflödig kod, har Google släppt CollapsingToolBarLayout och AppBarLayout vyer. Med hjälp av olika alternativ inom dessa widgets kan utvecklare rita visningar överst på skärmen eller ange när dessa visningar ska bli synliga när användaren rullar.

Slutsats

Design Support Library har tagit många långa väntade verktyg till Android. När det är parat med AppCompat-biblioteket blir det mycket lättare att lägga till materialdesign till appar samtidigt som bakåtkompatibiliteten bibehålls.

Många exempel på hur man arbetar med dessa nya komponenter finns i Googles officiella referensprogram, CheeseSquare och Tuts + fortsätter att ge djupgående handledning om hur man implementerar dessa nya funktioner.