Under Google I / O 2015 introduserte Google Design Support Library for Android-utviklere. Dette biblioteket gjør det enkelt for utviklere å implementere flere Material Design-konsepter i deres applikasjoner, fordi mange viktige elementer ikke var tilgjengelige i utgangspunktet ut av boksen. Utover at det er enkelt å bruke, er Design Support Library baklengs kompatibelt med API 7. Design Support Library kan inkluderes i Android-prosjektene dine ved å importere Gradle-avhengigheten.
kompilere 'com.android.support:design:22.2.0'
Det finnes to hovedkategorier av verktøy i Design Support Library:
Vi starter med å se på hvilke nye visuelle komponenter som er tilgjengelige for å legge til polish i appene dine.
EditText
Visninger har eksistert i Android siden begynnelsen, og mens de er enkle å bruke, har de egentlig ikke forandret seg mye. Med Design Support Library har Google introdusert en ny containervisning som heter TextInputLayout
. Denne nye visningen legger til funksjonalitet til standarden EditText
, for eksempel støtte for feilmeldinger og animerte tips for å gjøre brukergrensesnittet ditt pop.
Som vist i utsnittet nedenfor, TextInputLayout
kan inkluderes i layoutfilen din som en wrapper for en standard EditText
.
Gianluca Segato vil ta en nærmere titt på TextInputLayout
komponent i en kommende opplæring.
En av de mest overordnede brukergrensesnittkomponentene i Material Design apps er den flytende handlingsknappen. Siden introduksjonen har utviklerne enten måtte lage disse knappene fra bunnen av eller velge en av de mange tredjepartsbiblioteker som er designet spesielt rundt disse knappene.
Med Design Support Library, kan flytende handlingsknapper bli inkludert i et layout og forankret til en del av skjermen med noen enkle XML-linjer. Hver knapp er lett tilpassbar med ikoner og farger. To størrelser er tilgjengelige, standard (56 dp) og mini (40dp). En av de største fordelene er at disse knappene nå skal støttes av Google når designen utvikler seg.
Samtidig som ViewPager
og DrawerLayout
komponenter har vært tilgjengelig en stund gjennom v4 støtte bibliotek, Google har utvidet seg på dem ved å tilby to nye relaterte widgets. Den første er en offisiell versjon av det ofte brukte ViewPagerIndicator-biblioteket av Jake Wharton TabLayout
. Den andre er NavigationView
, som gir støtte for skuffens topptekst.
TabLayout
TabLayout
Komponenter kan ha innhold lagt til manuelt i kode ved å bruke en av addTab
metoder. Ta en titt på følgende eksempel.
tabLayout.addTab (tabLayout.newTab (). setText ("Tab 1")); tabLayout.addTab (tabLayout.newTab (). setText ("Tab 2")); tabLayout.addTab (tabLayout.newTab (). setText ("Tab 3"));
Alternativt kan du knytte TabLayout
komponenter med a ViewPager
. Dette oppnås ved å ringe setupWithViewPager ()
, passerer i ViewPager
som det første og eneste argumentet. Dette er en annen måte å endre seksjoner i ViewPager
. Det er verdt å merke seg at getPageTitle ()
må overstyres når du bruker TabLayout
med en ViewPager
å gi hver kategori et riktig navn.
NavigationView
NavigationView
er en ny widget som utvider funksjonaliteten til DrawerLayout
. Utviklere kan nå legge til topptekstlayouter til skuffen og markere valgte seksjoner med denne brukervennlige komponenten.
I tillegg til dette er det nå veldig greit å lage seksjoner og delseksjoner i skuffen gjennom menyen ressursfiler. For å komme i gang, a NavigationView
bare trenger å være assosiert med a DrawerLayout
i XML.
Mens Skål
meldingen har vært en stift av Android i mange år, en ny brukergrensesnitt widget kalt snackbar
er tilgjengelig for å gi lignende funksjonalitet med et forbedret utseende. Ikke bare gjør snackbar
presentere informasjon til brukeren i en kort periode, støtter den også en enkelt handling for å legge til kontekstbasert funksjonalitet til appene dine og kan bli avvist med en swiping-gestus.
snackbar
er implementert på samme måte som Skål
, selv om det bør bemerkes at å lage en krever en visning som kan brukes til å finne bunnen av appvisningen.
Snackbar.make (se "Action", Snackbar.LENGTH_LONG) .setAction ("Action!", Ny View.OnClickListener () @Override public void onClick (Vis v) Log.e ("App", "Action! "); ) .vise fram();
Hvordan et brukergrensesnitt oppfører seg og animerer er svært viktig i Material Design. For å lette dette har Google gitt ut flere komponenter i Design Support Library som hjelper til med vanlig bruk. Kerry Perez-Huanca vil se nærmere på dette aspektet av Design Support Library i en kommende opplæring.
Du har kanskje lagt merke til i forrige eksempel at FloatingActionButton
flyttet opp når snackbar
Visningen dukket opp. Dette er gjort ved hjelp av en ny widget kalt CoordinatorLayout
, som bryter opp visninger som skal flyttes for å gi plass til andre synspunkter.
Mange utviklere har bedt om en enklere måte å vise et parallaxbilde som fungerer med et raskt returdesignmønster, forsvinner eller vises som brukeren ruller. Du kan se denne oppførselen i Play-butikken for appoppføringer. For å la utviklere implementere dette uten mye tid på å skrive redundant kode, har Google utgitt CollapsingToolBarLayout
og AppBarLayout
utsikt. Ved hjelp av ulike alternativer i disse widgetene, kan utviklere knytte visninger til toppen av skjermen eller angi når disse visningene skal bli synlige ettersom brukeren ruller.
Designstøttebiblioteket har brakt mange etterlengtede verktøy til Android. Når det er sammenkoblet med AppCompat-biblioteket, blir det mye enklere å legge til Material Design til apps, samtidig som du opprettholder bakoverkompatibilitet.
Mange eksempler på hvordan du arbeider med disse nye komponentene finner du i Googles offisielle referanseprogram, CheeseSquare og Tuts + vil fortsette å gi grundige veiledninger om hvordan du implementerer disse nye funksjonene.