Gezinme Düzenleyici

Android Studio, gezinme grafiği oluşturup düzenlemenize olanak tanıyan bir GUI içerir. Bu, temelde temel alınan XML kaynak dosyasının düzenleyicisidir.

Genel Bakış

Uygulamanıza bir XML grafiği ekledikten sonra Android Studio, grafiği Navigation Editor'da (Gezinme Düzenleyici) açar. Gezinme Düzenleyici'de gezinme grafiklerini görsel olarak düzenleyebilir veya temel XML'yi doğrudan düzenleyebilirsiniz.

Şekil 1. Gezinme Düzenleyicisi
  1. Hedefler paneli: Grafik Düzenleyici'deki gezinme ana makinenizi ve tüm hedefleri listeler.
  2. Grafik Düzenleyici: Gezinme grafiğinizin görsel bir temsilini içerir. Tasarım görünümü ile Metin görünümündeki temel XML gösterimi arasında geçiş yapabilirsiniz.
  3. Özellikler: Gezinme grafiğinde seçilen öğenin özelliklerini gösterir.

İlgili XML'i görmek için Metin sekmesini tıklayın. Bu XML, aşağıdaki snippet'e benzer görünmelidir:

<?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>

<navigation> öğesi, bir gezinme grafiğinin kök öğesidir. Grafiğinize hedefler ve bağlantı işlemleri ekledikçe, ilgili <destination> ve <action> öğelerini burada alt öğeler olarak görebilirsiniz. [İç içe yerleştirilmiş grafikleriniz][2] varsa bunlar alt <navigation> öğeleri olarak görünür.

Hedef ekleme

Mevcut bir parçadan veya etkinlikten hedef oluşturabilirsiniz. Ayrıca, yeni bir hedef oluşturmak veya daha sonra bir parça ya da etkinlikle değiştirmek üzere yer tutucu oluşturmak için gezinme düzenleyiciyi de kullanabilirsiniz.

Bu örnekte, yeni bir hedef oluşturma işlemi gösterilmektedir. Gezinme Düzenleyici'yi kullanarak yeni bir hedef eklemek için aşağıdakileri yapın:

  1. Gezinme Düzenleyici'de Yeni Hedef simgesini ve ardından Yeni hedef oluştur'u tıklayın.
  2. Açılan New Android Component (Yeni Android Bileşeni) iletişim kutusunda parçanızı oluşturun. Parçalar hakkında daha fazla bilgi için [parçalara genel bakış][3] başlıklı makaleyi inceleyin.

Gezinme Düzenleyici'ye döndüğünüzde Android Studio'nun bu hedefi grafiğe eklediğini görürsünüz.

Şekil 2'de bir hedef ve [yer tutucu hedef][4] örneği gösterilmektedir.

Şekil 2. Hedef ve yer tutucu

Gezinme grafiğinize hedef eklemenin diğer yolları için [Ek hedefler][5] başlıklı makaleyi inceleyin.

Mevcut bir parçadan veya etkinlikten hedef oluşturma

Gezinme Düzenleyici'de, gezinme grafiğinize eklemek istediğiniz mevcut bir hedef türünüz varsa Yeni Hedef'i tıklayın.

Ardından, gösterilen açılır listede ilgili hedefi tıklayın. Artık Tasarım görünümünde hedefle ilgili bir önizleme ve gezinme grafiğinizin Metin görünümünde ilgili XML'yi görebilirsiniz.

Yeni bir parça hedefi oluşturma

Gezinme Düzenleyici'yi kullanarak yeni bir hedef türü eklemek için aşağıdakileri yapın:

  1. Gezinme Düzenleyici'de Yeni Hedef simgesini tıklayın.

    Ardından Yeni hedef oluştur'u tıklayın.

  2. Açılan New Android Component (Yeni Android Bileşeni) iletişim kutusunda parçanızı oluşturun.

Gezinme Düzenleyici'ye döndüğünüzde Android Studio'nun bu hedefi grafiğe eklediğini görürsünüz.

Şekil 3'te bir hedef ve [yer tutucu hedef][2] örneği gösterilmektedir.

Şekil 3. Hedef ve yer tutucu

Hedefin anatomisi

Bir hedefi tıklayarak seçin ve Özellikler panelinde aşağıdaki özellikleri not edin:

  • Tür alanı, hedefin kaynak kodunuzda parça, etkinlik veya başka bir özel sınıf olarak uygulanıp uygulanmadığını gösterir.
  • Etiket alanı, hedef için kullanıcı tarafından okunabilir adı içerir. Bu, kullanıcı arayüzünde gösterilebilir. Örneğin, [NavGraph][10] öğesini [setupWithNavController()][11] kullanarak bir Toolbar öğesine bağlarsanız. Bu nedenle, bu değer için kaynak dizeleri kullanın.
  • ID alanı, kodda hedefi belirtmek için kullanılan hedef kimliğini içerir.
  • Sınıf açılır listesinde, hedefle ilişkili sınıfın adı gösterilir. İlişkili sınıfı başka bir hedef türüyle değiştirmek için bu açılır listeyi tıklayın.

Gezinme grafiğinizin XML görünümünü göstermek için Metin sekmesini tıklayın. XML, hedef için aşağıdaki snippet'te olduğu gibi aynı id, name, label ve layout özelliklerini içerir:

<?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>

Ayrıca, [Layout Editor][1]'ı kullanarak da bir etkinliğe NavHostFragment ekleyebilirsiniz. Bunun için aşağıdaki adımları uygulayın:

  1. Proje dosyaları listenizde, etkinliğinizin düzen XML dosyasını çift tıklayarak Layout Editor'da açın.
  2. Palet bölmesinde Kapsayıcılar kategorisini seçin veya "NavHostFragment"i arayın.
  3. NavHostFragment görünümünü etkinliğinize sürükleyin.
  4. Açılan Gezinme Grafikleri iletişim kutusunda, bu NavHostFragment ile ilişkilendirilecek ilgili gezinme grafiğini seçin ve Tamam'ı tıklayın.

Hedefleri bağlama

İşlem, hedefler arasındaki mantıksal bağlantıdır. Eylemler, gezinme grafiğinde oklarla gösterilir. İşlemler genellikle bir hedefi başka bir hedefe bağlar. Bununla birlikte, uygulamanızın herhangi bir yerinden belirli bir hedefe gitmenizi sağlayan [global işlemler][6] de oluşturabilirsiniz.

İşlemlerle, kullanıcıların uygulamanızda izleyebileceği farklı yolları temsil edersiniz. Hedeflere gitmek için gezinme işlemini gerçekleştirecek kodu yazmanız gerektiğini unutmayın.

Gezinme Düzenleyici'yi kullanarak iki hedefi bağlamak için aşağıdakileri yapabilirsiniz:

  1. Tasarım sekmesinde, kullanıcıların gezinmesini istediğiniz hedefin sağ tarafında işaretçiyi bekletin. Şekil 4'te gösterildiği gibi, hedefin sağ tarafında bir daire görünür.

    Şekil 4. İşlem bağlantısı olan bir hedef daire
  2. İmlecinizi, kullanıcıların gitmesini istediğiniz hedefin üzerine sürükleyip bırakın. İki hedef arasındaki sonuç çizgisi, Şekil 5'te gösterildiği gibi bir işlemi temsil eder.

    Şekil 5. Hedefleri bir işlemle bağlama
  3. İşlemi vurgulamak için oku tıklayın. Aşağıdaki özellikler Özellikler panelinde görünür:

    • Tür alanı "İşlem"i içeriyor.
    • ID alanı, işlemin kimliğini içerir.
    • Hedef alanı, hedef parçasının veya etkinliğin kimliğini içerir.
  4. XML görünümüne geçmek için Metin sekmesini tıklayın. Kaynak hedefe artık bir işlem öğesi ekleniyor. İşlemin bir kimliği ve sonraki hedefin kimliğini içeren bir hedef özelliği vardır. Bu durum aşağıdaki örnekte gösterilmiştir:

    <?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>
    

Gezinme grafiğinizde işlemler <action> öğeleriyle gösterilir. Bir işlemde en azından kendi kimliği ve kullanıcının yönlendirilmesi gereken hedefin kimliği bulunur.

Yer tutucu hedefler

Uygulanmamış hedefleri temsil etmek için yer tutucular kullanabilirsiniz. Yer tutucu, bir hedefin görsel temsilidir. Yer tutucuları, diğer herhangi bir hedef gibi gezinme düzenleyicide kullanabilirsiniz.

[1]: /studio/write/layout-editor [2]: /guide/navigation/navigation-nested-graphs [3]: /guide/components/fragments [4]: /guide/navigation/navigation-create-destinations#placeholders [5]: /guide/navigation/navigation-create-destinations [6]: /guide/navigation/navigation-global-action [10]: /reference/androidx/navigation/NavGraph [11]: /reference/androidx/navigation/ui/NavigationUI#setupWithNavController(androidx.appcompat.widget.Toolbar,%20androidx.navigation.NavController)