Edytor nawigacji

Android Studio zawiera graficzny interfejs użytkownika, który umożliwia tworzenie i edytowanie wykresu nawigacji. Jest to w zasadzie edytor bazowego pliku zasobu XML.

Przegląd

Po dodaniu do aplikacji wykresu XML Android Studio otworzy go w edytorze nawigacji. W edytorze nawigacji możesz wizualnie edytować wykresy nawigacji lub bezpośrednio edytować bazowy kod XML.

1. Panel miejsc docelowych: zawiera hosta nawigacji i wszystkie miejsca docelowe w edytorze wykresów.
2. Edytor wykresów: zawiera wizualną reprezentację wykresu nawigacji Możesz przełączać się między widokiem Projekt a bazową reprezentacją XML w widoku Tekst.
3. Atrybuty: wyświetla atrybuty wybranego elementu na wykresie nawigacji.

Kliknij kartę Tekst , aby zobaczyć odpowiedni kod XML, który powinien wyglądać podobnie do tego fragmentu:

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/nav_graph">

</navigation>

Element <navigation> jest elementem głównym wykresu nawigacji. Gdy dodajesz do wykresu miejsca docelowe i łączące je działania, możesz zobaczyć odpowiednie <destination> i <action> elementy jako elementy podrzędne. Jeśli masz zagnieżdżone wykresy, pojawią się one jako elementy podrzędne <navigation>.

Dodawanie miejsc docelowych

Miejsce docelowe możesz utworzyć na podstawie istniejącego fragmentu lub aktywności. Możesz też użyć edytora nawigacji, aby utworzyć nowe miejsce docelowe lub utworzyć obiekt zastępczy, który później zastąpisz fragmentem lub aktywnością.

Ten przykład pokazuje, jak utworzyć nowe miejsce docelowe. Aby dodać nowe miejsce docelowe za pomocą edytora nawigacji:

1. W edytorze nawigacji kliknij ikonę Nowe miejsce docelowe , a następnie kliknij Utwórz nowe miejsce docelowe.
2. W wyświetlonym oknie Nowy komponent Androida utwórz fragment. Więcej informacji o fragmentach znajdziesz w omówieniu fragmentów.

Wróć do edytora nawigacji. Zobaczysz, że Android Studio dodało to miejsce docelowe do wykresu.

Rysunek 2 przedstawia przykład miejsca docelowego i miejsca docelowego zastępczego.

Inne sposoby dodawania miejsc docelowych do wykresu nawigacji znajdziesz w sekcji Dodatkowe miejsca docelowe.

Tworzenie miejsca docelowego na podstawie istniejącego fragmentu lub aktywności

Jeśli w edytorze nawigacji masz istniejący typ miejsca docelowego, który chcesz dodać do wykresu nawigacji, kliknij Nowe miejsce docelowe .

Następnie kliknij odpowiednie miejsce docelowe w wyświetlonym menu. Teraz możesz zobaczyć podgląd miejsca docelowego w widoku Projekt oraz odpowiedni kod XML w widoku Tekst wykresu nawigacji.

Tworzenie nowego miejsca docelowego fragmentu

Aby dodać nowy typ miejsca docelowego za pomocą edytora nawigacji:

1. W edytorze nawigacji kliknij ikonę Nowe miejsce docelowe .

   Następnie kliknij Utwórz nowe miejsce docelowe.

2. W wyświetlonym oknie Nowy komponent Androida utwórz fragment.

Wróć do edytora nawigacji. Zobaczysz, że Android Studio dodało to miejsce docelowe do wykresu.

Rysunek 3 przedstawia przykład miejsca docelowego i miejsca docelowego zastępczego.

Anatomia miejsca docelowego

Kliknij miejsce docelowe, aby je zaznaczyć, i zwróć uwagę na te atrybuty w panelu Atrybuty:

• Pole Typ wskazuje, czy miejsce docelowe jest zaimplementowane jako fragment, aktywność czy inna klasa niestandardowa w kodzie źródłowym.
• Pole Etykieta zawiera nazwę miejsca docelowego, która jest czytelna dla użytkownika. Może być wyświetlana w interfejsie, np. jeśli połączysz NavGraph z Toolbar za pomocą setupWithNavController(). Z tego powodu używaj ciągów zasobów.
• Pole Identyfikator zawiera identyfikator miejsca docelowego, który jest używany do odwoływania się do miejsca docelowego w kodzie.
• Menu Klasa pokazuje nazwę klasy powiązanej z miejscem docelowym. Kliknij to menu, aby zmienić powiązaną klasę na inny typ miejsca docelowego.

Kliknij kartę Tekst , aby wyświetlić widok XML wykresu nawigacji. Kod XML zawiera te same atrybuty id, name, label i layout co miejsce docelowe, jak w tym fragmencie:

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    app:startDestination="@id/blankFragment">
    <fragment
        android:id="@+id/blankFragment"
        android:name="com.example.cashdog.cashdog.BlankFragment"
        android:label="@string/label_blank"
        tools:layout="@layout/fragment_blank" />
</navigation>

NavHostFragment

Możesz też użyć narzędzia Layout Editor, aby dodać NavHostFragment do Activity:

1. Na liście plików projektu kliknij dwukrotnie plik XML układu aktywności, aby otworzyć go w narzędziu Layout Editor.
2. W panelu Paleta wybierz kategorię Kontenery lub wyszukaj „NavHostFragment”.
3. Przeciągnij widok NavHostFragment na aktywność.
4. W wyświetlonym oknie Wykresy nawigacji wybierz odpowiedni wykres nawigacji, który ma być powiązany z tym NavHostFragment, a następnie kliknij OK.

Łączenie miejsc docelowych

Działanie to logiczne połączenie między miejscami docelowymi. Działania są reprezentowane na wykresie nawigacji jako strzałki. Działania zwykle łączą jedno miejsce docelowe z innym, ale możesz też tworzyć działania globalne które przenoszą użytkownika do określonego miejsca docelowego z dowolnego miejsca w aplikacji.

Działania reprezentują różne ścieżki, którymi użytkownicy mogą się poruszać w aplikacji. Pamiętaj, że aby faktycznie przejść do miejsc docelowych, musisz napisać kod, który wykona nawigację.

Za pomocą edytora nawigacji możesz połączyć 2 miejsca docelowe:

1. Na karcie Projekt najedź kursorem na prawą stronę miejsca docelowego, z którego użytkownicy mają się poruszać. Po prawej stronie miejsca docelowego pojawi się kółko, jak pokazano na rysunku 4.

   

2. Przeciągnij kursor na miejsce docelowe, do którego użytkownicy mają się poruszać, i zwolnij przycisk myszy. Powstała linia między 2 miejscami docelowymi reprezentuje działanie, jak pokazano na rysunku 5.

   

3. Kliknij strzałkę, aby wyróżnić działanie. W panelu Atrybuty pojawią się te atrybuty:

   • Pole Typ zawiera wartość „Działanie”.
   • Pole Identyfikator zawiera identyfikator działania.
   • Pole Miejsce docelowe zawiera identyfikator fragmentu lub aktywności miejsca docelowego.

4. Kliknij kartę Tekst , aby przełączyć się na widok XML. Do źródłowego miejsca docelowego został dodany element działania. Działanie ma atrybut identyfikatora i atrybut miejsca docelowego, który zawiera identyfikator następnego miejsca docelowego, jak pokazano w tym przykładzie:

   xml <?xml version="1.0" encoding="utf-8"?> <navigation xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android" app:startDestination="@id/blankFragment"> <fragment android:id="@+id/blankFragment" android:name="com.example.cashdog.cashdog.BlankFragment" android:label="@string/label_blank" tools:layout="@layout/fragment_blank" > <action android:id="@+id/action_blankFragment_to_blankFragment2" app:destination="@id/blankFragment2" /> </fragment> <fragment android:id="@+id/blankFragment2" android:name="com.example.cashdog.cashdog.BlankFragment2" android:label="@string/label_blank_2" tools:layout="@layout/fragment_blank_fragment2" /> </navigation>

Na wykresie nawigacji działania są reprezentowane przez <action> elementy. Działanie zawiera co najmniej własny identyfikator i identyfikator miejsca docelowego, do którego ma zostać przeniesiony użytkownik.

Miejsca docelowe zastępcze

Do reprezentowania niezaimplementowanych miejsc docelowych możesz używać obiektów zastępczych. Obiekt zastępczy służy jako wizualna reprezentacja miejsca docelowego. W edytorze nawigacji możesz używać obiektów zastępczych tak samo jak innych miejsc docelowych.