Lekce 1 - Android fragmenty - Úvod

V dnešním Android tutoriálu si řekneme, co je to fragment. Založíme si nový projekt a rovnou jeden fragment vytvoříme.

Co je to fragment

Fragment je definován třídou odvozenou od třídy Fragment a XML návrhem svého vzhledu. Fragment má mnoho společného s aktivitou. Vzhled fragmentu vytváříme XML návrhem, který potom propojujeme s kódem jeho Java třídy.

Vizuálně lze fragment popsat jako prostor v GUI aktivity pro zobrazení jiného libovolného XML návrhu. Každý zobrazený fragment je vždy součástí aktivity.

Výhody použití fragmentů

Fragmentem můžeme plnohodnotně nahradit zobrazení jiné aktivity. Použití fragmentů nabízí široké možnosti k definování vlastních animací při svém zobrazování nebo zavírání. Fragmentem můžeme vyplnit obsah celé aktivity nebo jen její část.

Fragmentu můžeme nastavit libovolné rozměry a můžeme mu určit konkrétní pozici v aktivitě, podobně jako jakékoliv komponentě GUI. Dokonce můžeme mít v aktivitě umístěno více fragmentů. Větším počtem fragmentů například snadno docílíme rozdělení obsahu aktivity do několika samostatných částí. Tímto způsobem můžeme přizpůsobovat vzhled a rozložení aplikace velikosti a aktuální orientaci displeje:

Obrázek zobrazuje dva fragmenty v různých konfiguracích jedné aktivity na různých velikostech displeje. Na velkém displeji je dostatek místa na zobrazení obou fragmentů. Na zařízení s malým displejem je v jednom okamžiku zobrazen pouze jeden fragment.

Fragmenty vzájemně nahrazujeme pomocí navigace ze strany uživatele.

Životní cyklus fragmentu

I přes to, že fragment patří aktivitě, má vlastní životní cyklus přijímající vlastní vstupní události. Životní cyklus fragmentu se podobá životnímu cyklu aktivity, a také obsahuje některé stejné metody zpětného volání, jako například onCreate(), onStart(), onPause() a onStop(). Protože je fragment součástí aktivity, je jeho životní cyklus na této aktivitě zcela závislý.

Životní cyklus fragmentu může probíhat pouze, když je aktivita aktivní.

Životní cyklus fragmentu je následující:

Fragment je vždy součástí aktivity. V aktivitě může být fragment umístěn napevno při vytváření GUI aplikace v XML kódu nebo může být do aktivity přidán až za běhu aplikace do předem připraveného kontejneru (layoutu).

Způsob umístění fragmentu do aktivity

Existují dva způsoby, jak v aktivitě fragment zobrazit. Pokud má být fragment umístěn neměnně, stejně jako jakákoliv komponenta, stačí jej definovat v XML návrhu GUI aktivity, ve které bude umístěn. Pokud budeme chtít fragment zobrazovat (nahrazovat jinými fragmenty) až za běhu aplikace, budeme jej vytvářet a umisťovat do aktivity programově v Java kódu.

Pevně umístěný fragment

Zde máme příklad deklarace pevně umístěného fragmentu přímo v XML rozvržení GUI aktivity:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:weightSum="1">

    <fragment
        android:name="FragmentA"
        android:id="@+id/fragment_a"
        android:layout_weight="0.5"
        android:layout_width="0dp"
        android:layout_height="match_parent" />

    <fragment
        android:name="FragmentB"
        android:id="@+id/fragment_b"
        android:layout_weight="0.5"
        android:layout_width="0dp"
        android:layout_height="match_parent" />

</LinearLayout>

Uvedený příklad XML kódu vytváří LinearLayout s horizontálním uspořádáním a v něm dva různé fragmenty vedle sebe. Takto vytvořené fragmenty jsou nedílnou součástí aktivity a nelze je z aktivity odebrat nebo je nahradit jinými fragmenty.

Tento způsob jsme si představili jen pro úplnost a nebudeme se jím dále podrobněji zabývat. Dále se budeme soustředit jen na práci s fragmenty za běhu aplikace.

Umístění fragmentu za běhu aplikace

Tímto způsobem práce s fragmenty se budeme zabývat v následujících lekcích tohoto kurzu. Výkladem nás bude samozřejmě doprovázet ukázkový projekt jednoduché aplikace, na které si vše popsané vyzkoušíme.

Vytvoření ukázkového projektu

Náš ukázkový projekt bude pro přehlednost obsahovat několik aktivit. Každá aktivita se bude týkat konkrétní ukázky práce s fragmenty. V Android Studiu tedy vytvoříme nový projekt Fragments:

Do políčka Name napíšeme Fragments, do políčka Package name napíšeme cz.itnetwork.fragments. Jako programovací jazyk zvolíme Javu. Nastavení potvrdíme tlačítkem Finish:

V zobrazeném vývojovém prostředí budeme mít vygenerované soubory MainActivity.java a activity_main.xml. Těchto souborů si zatím všímat nebudeme. Nejdříve vytvoříme náš první fragment.

Vytvoření prvního fragmentu

Náš první fragment pojmenujeme FirstFragment. Zde máme obrázek s jeho požadovaným vzhledem:

Pohledem na uvedený obrázek nelze rozeznat, zda jde o běžnou aktivitu a nebo o fragment v aktivitě umístěný. Fragment se žlutým pozadím zabírá celý dostupný prostor své mateřské aktivity. Ve skutečnosti vyplňuje prostor již zmíněného kontejneru (layoutu), který má parametry nastavené tak, aby byl v aktivitě maximálně roztažen.

Práce na novém fragmentu se skládá ze dvou částí:

• XML kód s návrhem GUI fragmentu
• Java kód fragmentu

XML kód fragmentu FirstFragment

Způsob vytvoření XML návrhu fragmentu se nijak neliší od vytváření XML návrhu aktivity. Dokonce nám nic nebrání v použití XML návrhu fragmentu jako XML návrh aktivity a naopak. Soubory s XML návrhy fragmentů umisťujeme ve struktuře projektu do složky res/layout/. Tedy na stejné místo jako XML návrhy aktivit.

Vytvoříme tedy nový XML soubor:

V otevřeném okně zadáme název nového souboru a potvrdíme tlačítkem OK:

Vytvořený XML soubor upravíme tak, aby obsahoval následující kód:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FFF9DA">

    <TextView
        android:id="@+id/textView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:gravity="center_horizontal|center_vertical"
        android:text="Náš první fragment"
        android:textColor="@color/black"
        android:textSize="34sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Náš první fragment má žluté pozadí a obsahuje pouze jeden element <TextView>.

Java kód fragmentu FirstFragment

Ve struktuře projektu klikneme pravým tlačítkem myši na složku se soubory s Java kódem. V zobrazeném menu, přes položku New, klikneme na Java Class:

V otevřeném okně vyplníme název vytvářené třídy FirstFragment. Dále zkontrolujeme, že je vybrána volba Class a potvrdíme klávesou Enter:

Bude vytvořen nový soubor s názvem FirstFragment.java. Soubor upravíme následovně:

public class FirstFragment extends Fragment {

    TextView label;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.first_fragment, container, false);
        label = view.findViewById(R.id.textView);
        label.setText("Toto je náš první fragment!");
        return view;
    }
}

V hlavičce třídy máme zápis extends Fragment. Tímto je dáno, že je naše třída odvozena od třídy Fragment. Dále deklarujeme proměnnou label typu TextView k uložení reference na element <TextView> v XML návrhu fragmentu.

Následuje přepsání metody onCreateView(), což je metoda životního cyklu fragmentu. Tato metoda slouží k vytvoření GUI fragmentu. Zde pomocí třídy LayoutInflater vytvoříme objekt typu View, tvořící Java reprezentaci XML návrhu fragmentu. Z tohoto View nyní získáváme reference na jednotlivé komponenty fragmentu. V našem případě jde o jeden TextView, kterému vzápětí nastavujeme požadovaný text.

V příští lekci, Android fragmenty - Vytvoření prvního fragmentu, vytvoříme novou aktivitu, ve které zobrazíme náš první fragment FirstFragment.

 

Měl jsi s čímkoli problém? Zdrojový kód vzorové aplikace je ke stažení každých pár lekcí. Zatím pokračuj dál, a pak si svou aplikaci porovnej se vzorem a snadno oprav.