Sådan bruges fragmenter i dine Android-apps til et kraftfuldt og dynamisk brugergrænseflade

Indhold

Sådan bygger du dit første Android-fragment
Tilføjelse af layouts, visninger og kode
Koden
Brug fragmenter med flere forekomster
Lukker kommentarer
Android-udvikling:

Bemærk: Denne artikel antager, at du er bekendt med det grundlæggende i Android-udvikling og Java. Du skal allerede være i stand til at oprette grundlæggende layouts og bruge visninger, onClick og findViewByID. Hvis du griber fat i disse begreber, er du klar til at lære at bruge fragmenter!

Fragmenter er en kraftfuld funktion i god Android UI, der giver dig mulighed for at henvende dig til appdesign på en modulopbygget måde. Dette er forskellige visninger, der kan indeholde hele layout, og som leveres med deres egen ledsagende Java-kode. Ved at nedbryde dit brugergrænseflade på denne måde kan du oprette flere logiske layout, som det er lettere for dine brugere at forstå. Du kan give dem yderligere oplysninger og kontroller, uden at de behøver at forlade aktiviteten.

Se også: Problemfri fragmenter: Brug af Android's navigationsarkitekturkomponent

Fragmenter giver dig betydeligt flere muligheder i dit appdesign og kan forbedre brugeroplevelsen væsentligt

Hvad mere er, er, at fragmenter fungerer som klasser og genstande, idet du kan have flere forekomster af det samme fragment. Det betyder, at du kan bruge det samme layout igen og igen uden at skulle omskrive kode, eller endda vise to forskellige versioner side om side.

Kort sagt, mens dette endnu er en anden ting at lære, når det kommer til den tilsyneladende uendelige opgaveliste, der er involveret i Android-apps, det er noget, der kan give dig betydeligt flere muligheder i din appdesign og væsentligt forbedre brugeroplevelsen - hvilket gør det mere end værd at bruge tiden på at blive fortrolig .

Sådan bygger du dit første Android-fragment

Så hvad kunne vi gøre med fragmenter, der ikke ville give mening på nogen anden måde?

Måske har vi en liste over filer - måske er dette et billedgalleri - og vi vil gerne vise en beskrivelse og give brugeren mulighed for at slette eller dele. Den slags ting. Vi kunne sende dem til en ny 'Beskrivelse' -side hver gang ved hjælp af en separat aktivitet, men hvis du bruger fragmenter, kan vi opbevare dem på den ene side, der vil være mindre skurrende.

Åbn Android Studio og opret en liste med tilfældige billeder i activity_main.xml. Jeg bruger billeder af Dragon Ball Super fordi jeg er en nørd, og det er det, jeg har liggende på min pc ...

Nu skal vi oprette vores første fragment.

For at gøre dette vil du tage til Fil> Ny> Fragment. MainActivity.java skal vælges til venstre, når du gør dette, og du vælger et "tomt" fragment for nu. Derefter kan du vælge et navn, du er den nye oprettelse, som vi vil kalde 'Beskrivelse'. Fjern de to felter nedenunder - vi har ikke brug for det lige nu.

Når dette er gjort, finder du, at du nu ikke kun har en ny java-fil kaldet Description.java, men også en ny layoutfil kaldet fragment_description.xml - ligesom du havde oprettet en ny klasse! Dette betyder, at du placerer koden, der følger med dit nye fragment i sin egen separate java-fil.

Tilføjelse af layouts, visninger og kode

Den gode nyhed er, at det er meget let for os at tilføje visninger og et layout, når vi bruger fragmenter. Vi gør dette, ligesom vi normalt ville gøre ved at redigere fragment_timer.xml.

Lad os bruge et lineært layout igen, og denne gang tilføje nogle kontroller og beskrivende tekst. Du kan holde noget her lige nu.

Så nu er det næste spørgsmål: hvordan får du det til at dukke op i din app?

Du kan gøre dette ved at føje fragmentet til aktiviteten, ligesom du ville gøre et andet syn. Så gå til Activity_main.xml og tilføj visningen, så den optager en del af skærmen - måske nede i bunden.

Hvis du vil gøre det som jeg gjorde, brugte jeg et lodret lineært layout og gav alle billederne en vægt på 1 og fragmentet en vægt på 2.

Du vil bemærke, at forhåndsvisningen ikke viser dig det aktuelle fragment, bare en pladsholder. Bemærk ligeledes, at jeg har været nødt til at inkludere navnet på fragmentet i XML, så Android ved, hvor man kan finde det. Du har også brug for en ID for hvert fragment.

Koden

Som diskuteret vil den kode, vi har brug for at bruge fragmenter, gå i sin egen java-fil. I dette tilfælde er det filen Description.java.

Hvis du tjekker denne side ud, ser du, at der er en konstruktør (ligesom i enhver klasse, der opretter et objekt) og en metode kaldet onCreateView. Denne metode er hvor xml bruges til at oppustes den visning, og den er også ækvivalenten til din sædvanlige onCreate metode i en standardaktivitet.

For det meste kan du gøre ting, som du normalt ville gøre her. findViewByID fungerer, og du kan bruge dette til at ændre tekst osv. men du bliver nødt til at få referencen lidt anderledes. Skift den linje, der lyder:

return inflater.inflate (R.layout.fragment_description, container, falsk);

Til:

Se v = inflater.inflate (R.layout.fragment_description, container, falsk);

Og brug derefter:

v.findViewByID.

Nu kan du få adgang til dine synspunkter, som du normalt ville:

public View onCreateView (LayoutInflater inflater, ViewGroup container, Bundle gemtInstanceState) {View v = inflater.inflate (R.layout.fragment_description, container, falsk); Knap okButton = v.findViewById (R.id.Okay) ;; Button shareButton = v.findViewById (R.id.Del); okButton.setOnClickListener (ny View.OnClickListener () {public void onClick (View v) {Toast.makeText(getActivity (), "OK!", toast.LENGTH_LONG ).at vise(); }}); shareButton.setOnClickListener (ny View.OnClickListener () {public void onClick (View v) {Toast.makeText(getActivity (), "Deling ...", Toast.LENGTH_LONG ).at vise(); }}); return v; }}

Brug fragmenter med flere forekomster

Du kan se, hvordan det er meget lettere at oprette en strømlinet brugergrænseflade og kode, når vi bruger fragmenter. I stedet for at bruge layout-inden-layouts og derefter jonglere med masser af klik alle inden for en enkelt Java-fil. Hvad mere er, at denne 'modulære' tilgang tillader dig at bruge denne visning på tværs af aktiviteter og endda i menuer og andre dynamiske placeringer.

Men den virkelig seje del er det faktum, at du kan have flere forekomster af dette meget samme fragment, der alle findes på samme tid.

Dette er simpelt: du tilføjer blot mere end en visning og oppustes med den nøjagtige samme kode.

Nu kan du forhåbentlig begynde at se nogle af kraften ved at bruge fragmenter: Forestil dig at have en Recycler-visning (en rulleliste) med billeder, hver med detaljerne og kontrollerne lige under. Der behøver ikke være behov for at oprette et helt nyt layout hver gang, og du kan skjule visningerne, indtil brugeren klikkede på billedet!

Hvad mere er, er at du også kan generere nye fragmenter programmatisk. Alt hvad du behøver er et sted for fragmentet at gå i dit layout - såsom et rammlayout (som jeg vil kalde fragmentTarget) og så kan du gøre følgende:

Fragment tilføjetFragment = nyt Beskrivelse (); FragmentTransaction transaktion = getSupportFragmentManager (). BeginTransaction (); transaction.replace (R.id.fragmentTarget, tilføjetFragment); transaction.addToBackStack (null); transaction.commit ();

Sørg for at importere de nødvendige klasser - du bliver bedt om, når du prøver at bruge fragmenter i din kode. Bare sørg for at vælge den øverste mulighed, der siger 'v4'.

At være i stand til at tilføje fragmenter programmatisk er vigtigt, fordi det betyder, at vi kunne generere en dynamisk liste over billeder (som vi har downloadet, som er placeret i en bestemt mappe osv.) Og derefter få detaljerne til at vises med det samme for os.

Så i dette nye eksempel er det andet fragment tilføjet programmatisk.

Endelig kan du finde ud af, at du ønsker at ændre udseendet på dine fragmenter, afhængigt af hvor de er placeret. Den gode nyhed er, at du nemt kan gøre dette ved at videregive et ID som et bundt, når du opretter fragmentet og derefter uddrager den værdi i den anden ende.

Brug MainActivity.java:

Bundle bundle = nyt bundle (); bundle.putInt ("ID", 1); addedFragment.setArguments (bundle);

Og tilføj i Description.java:

int øje = 0; Bundle bundle = this.getArguments (); if (bundle! = null) {eyeD = bundle.getInt ("ID", 0); } switch (eyeD) {sag 1: ...

Derefter kunne du - for eksempel - få din app til at vise forskellige noter for hvert billede.

Lukker kommentarer

Så sådan bruger du fragmenter. Forhåbentlig forstås det grundlæggende, og dette indlæg har givet dig nok forståelse for, at du kan gå videre og finde ud af resten. Mere vigtigt er det, jeg håber, det har vist dig nogle af de mulige anvendelser af fragmenter og det potentiale, de tilbyder for smartere appdesign.

Hvis du vil se et andet eksempel på fragmenter i handling, skal du sørge for at tjekke mit nyeste indlæg om oprettelse af en brugerdefineret launcher!

Android-udvikling:

Sådan opretter du en VR-app til Android på kun 7 minutter
Lav din egen handling til Google Assistant
Root Android: Alt hvad du har brug for at vide!
En apps anatomi: En introduktion til aktivitetscykler
Android Jetpack: Hvad betyder de nylige meddelelser for Android's Support Library?