Gezinme bileşeni, uygulamanızın gezinmesini yönetmek için bir gezinme grafiği kullanır. Gezinme grafiği, uygulamanızdaki her bir hedefi ve bunlar arasındaki bağlantıları içeren bir veri yapısıdır.
Hedef türleri
Barındırılan, iletişim kutusu ve etkinlik olmak üzere üç genel hedef türü vardır. Aşağıdaki tabloda, bu üç hedef türü ve amaçları özetlenmiştir.
Tür |
Açıklama |
Kullanım örnekleri |
---|---|---|
Barındırılan |
Gezinme ana makinesinin tamamını doldurur. Yani barındırılan bir hedefin boyutu, gezinme ana makinesinin boyutuyla aynıdır ve önceki hedefler görünmez. |
Ana ve ayrıntı ekranları. |
Dialog |
Yer paylaşımlı kullanıcı arayüzü bileşenlerini gösterir. Bu kullanıcı arayüzü, gezinme ana makinesinin konumuna veya boyutuna bağlı değildir. Önceki hedefler hedefin altında görünür. |
Uyarılar, seçimler, formlar. |
Etkinlik |
Uygulama içindeki benzersiz ekranları veya özellikleri temsil etmelidir. |
Gezinme bileşeninden ayrı olarak yönetilen yeni bir Android etkinliği başlatan gezinme grafiğinin çıkış noktası olarak görev yapar. Modern Android geliştirmesinde bir uygulama tek bir etkinlikten oluşur. Bu nedenle etkinlik hedefleri, üçüncü taraf etkinlikleriyle etkileşime geçerken veya taşıma sürecinin bir parçası olarak en iyi şekilde kullanılır. |
Bu belgede, en yaygın ve temel hedefler olan barındırılan hedeflere ilişkin örnekler yer almaktadır. Diğer hedefler hakkında bilgi için aşağıdaki kılavuzları inceleyin:
Çerçeveler
Her durumda aynı genel iş akışı geçerli olsa da bir gezinme ana makinesi ve grafiği tam olarak nasıl oluşturacağınız, kullandığınız kullanıcı arayüzü çerçevesine bağlıdır.
- Oluştur:
NavHost
kompozisyonunu kullanın. Kotlin DSL'yi kullanarak bunun için birNavGraph
oluşturun. Grafiği iki şekilde oluşturabilirsiniz:- NavHost'un bir parçası olarak: Gezinme grafiğini doğrudan
NavHost
eklemenin bir parçası olarak oluşturun. - Programatik olarak:
NavGraph
oluşturup doğrudanNavHost
öğesine iletmek içinNavController.createGraph()
yöntemini kullanın.
- NavHost'un bir parçası olarak: Gezinme grafiğini doğrudan
- Parçalar: Görünümler kullanıcı arayüzü çerçevesiyle parçalar kullanırken ana makine olarak bir
NavHostFragment
kullanın. Gezinme grafiği oluşturmanın birkaç yolu vardır:- Programatik olarak:
NavGraph
oluşturmak ve bunu doğrudanNavHostFragment
öğesine uygulamak için Kotlin DSL'yi kullanın.- Hem parçalar hem de Oluşturma için Kotlin DS ile kullanılan
createGraph()
işlevi aynıdır.
- Hem parçalar hem de Oluşturma için Kotlin DS ile kullanılan
- XML: Gezinme barındırıcınızı ve grafiğinizi doğrudan XML olarak yazın.
- Android Studio düzenleyicisi: Grafiğinizi XML kaynak dosyası olarak oluşturmak ve düzenlemek için Android Studio'daki GUI düzenleyicisini kullanın.
- Programatik olarak:
Oluştur
Compose'da gezinme grafiğinizi oluşturmak için NavHost
yazın.
Aşağıdaki örneği inceleyin:
val navController = rememberNavController()
NavHost(navController = navController, startDestination = "profile") {
composable("profile") { Profile( /* ... */ ) }
composable("friendslist") { FriendsList( /* ... */ ) }
// Add more destinations similarly.
}
NavHost
composable çağrısı, başlangıç hedefine karşılık gelen birNavController
ve birroute
dizesi iletir.NavHost
öğesine iletilen lambda en sonundaNavController.creatGraph()
yöntemini çağırır ve birNavGraph
döndürür.NavGraphBuilder.composable()
öğesine yapılan çağrılar, sonuçta ortaya çıkanNavGraph
hedefine hedefler ekler.- Bu durumda, hedefler
Profile
veFriendsList
oluşturulabilir öğeleridir."profile"
ve"friendslist"
rota dizeleri, iki hedefi tanımlayan anahtarlar haline gelir.
NavGraph
öğesini oluşturan lambdayı daha iyi anlamak için önceki snippet'le aynı grafiği oluşturmak için NavGraph
öğesini NavController.createGraph()
kullanarak ayrı olarak oluşturabilir ve doğrudan NavHost
öğesine aktarabilirsiniz:
val navGraph by remember(navController) {
navController.createGraph(startDestination = "profile") {
composable("profile") { Profile() }
composable("friendslist") { FriendsList() }
}
}
NavHost(navController, navGraph)
Minimum örnek
Birlikte çalışan NavController
ve NavHost
öğelerinin küçük ancak eksiksiz bir örneği:
// Define the Profile composable.
@Composable
fun Profile(onNavigateToFriendsList: () -> Unit) {
Text("Profile")
Button(onClick = { onNavigateToFriendsList() }) {
Text("Go to Friends List")
}
}
// Define the FriendsList composable.
@Composable
fun FriendsList(onNavigateToProfile: () -> Unit) {
Text("Friends List")
Button(onClick = { onNavigateToProfile() }) {
Text("Go to Profile")
}
}
// Define the MyApp composable, including the `NavController` and `NavHost`.
@Composable
fun MyApp() {
val navController = rememberNavController()
NavHost(navController, startDestination = "profile") {
composable("profile") { Profile(onNavigateToFriendsList = { navController.navigate("friendslist") }) }
composable("friendslist") { FriendsList(onNavigateToProfile = { navController.navigate("profile") }) }
}
}
Snippet'in gösterdiği gibi, NavController
öğesini derlemelerinize iletmek yerine NavHost
öğesine bir etkinlik gösterin. Diğer bir deyişle, bestelerinizde NavHost
öğesinin NavController.navigate()
çağrısı yapan bir lambda ilettiği () -> Unit
türünde bir parametre olmalıdır.
Parçalar
Önceki bölümlerde belirtildiği gibi, parçaları kullanırken Kotlin DSL, XML veya Android Studio düzenleyicisini kullanarak programlı bir şekilde gezinme grafiği oluşturma seçeneğiniz vardır.
Aşağıdaki bölümlerde bu farklı yaklaşımlar ayrıntılı olarak açıklanmaktadır.
Programatik olarak
Kotlin DSL, parçalar içeren gezinme grafiği oluşturmanın programatik bir yolunu sunar. Bu yöntem, birçok açıdan XML kaynak dosyası kullanmaya göre daha düzenli ve moderndir.
İki ekranlı bir gezinme grafiği uygulayan aşağıdaki örneği inceleyin.
Öncelikle, app:navGraph
öğesi içermemesi gereken NavHostFragment
öğesini oluşturmanız gerekir:
<FrameLayout 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">
<androidx.fragment.app.FragmentContainerView
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
Ardından, NavHostFragment
öğesinin id
değerini NavController.findNavController()
adresine iletin. Bu işlem, NavController'ı NavHostFragment
ile ilişkilendirir.
Ardından, NavController.createGraph()
çağrısı grafik ile NavController
ve dolayısıyla da NavHostFragment
arasında bağlantı oluşturur:
// Retrieve the NavController.
val navController = findNavController(R.id.nav_host_fragment)
// Add the graph to the NavController with `createGraph()`.
navController.graph = navController.createGraph(
startDestination = "profile"
) {
// Associate each destination with one of the route constants.
fragment<ProfileFragment>("profile") {
label = "Profile"
}
fragment<FriendsListFragment>("friendsList") {
label = "Friends List"
}
// Add other fragment destinations similarly.
}
DSL'nin bu şekilde kullanılması, önceki Oluşturma bölümünde açıklanan iş akışına çok benzer. Örneğin, hem burada hem de burada NavController.createGraph()
işlevi NavGraph
oluşturur. Benzer şekilde, NavGraphBuilder.composable()
grafiğe düzenlenebilir hedefler eklerken, burada NavGraphBuilder.fragment()
parça hedefi ekler.
Kotlin DSL'nin nasıl kullanılacağı hakkında daha fazla bilgi için NavGraphBuilder DSL ile grafik oluşturma bölümüne bakın.
XML
XML'yi doğrudan kendiniz yazabilirsiniz. Aşağıdaki örnek, önceki bölümde yer alan iki ekranlı örneğe eşdeğerdir.
Öncelikle bir NavHostFragment
oluşturun. Bu, gerçek gezinme grafiğini içeren
gezinme ana makinesi olarak görev yapar.
Minimum düzeyde NavHostFragment
uygulaması:
<FrameLayout 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">
<androidx.fragment.app.FragmentContainerView
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:navGraph="@navigation/nav_graph" />
</FrameLayout>
NavHostFragment
, app:navGraph
özelliğini içerir. Gezinme grafiğinizi gezinme ana makinesine bağlamak için bu özelliği kullanın. Aşağıda, grafiği nasıl uygulayabileceğinize dair bir örnek verilmiştir:
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/nav_graph"
app:startDestination="@id/profile">
<fragment
android:id="@+id/profile"
android:name="com.example.ProfileFragment"
android:label="Profile">
<!-- Action to navigate from Profile to Friends List. -->
<action
android:id="@+id/action_profile_to_friendslist"
app:destination="@id/friendslist" />
</fragment>
<fragment
android:id="@+id/friendslist"
android:name="com.example.FriendsListFragment"
android:label="Friends List" />
<!-- Add other fragment destinations similarly. -->
</navigation>
Farklı hedefler arasındaki bağlantıları tanımlamak için işlemleri kullanırsınız. Bu örnekte profile
parçası, friendslist
hedefine giden bir işlem içeriyor. Daha fazla bilgi için Gezinme işlemlerini ve parçalarını kullanma konusuna bakın.
Düzenleyici
Android Studio'daki Gezinme Düzenleyici'yi kullanarak uygulamanızın gezinme grafiğini yönetebilirsiniz. Bu, önceki bölümde görüldüğü gibi NavigationFragment
XML'nizi oluşturmak ve düzenlemek için kullanabileceğiniz bir GUI'dir.
Daha fazla bilgi için Gezinme düzenleyici konusuna bakın.
İç içe yerleştirilmiş grafikler
İç içe yerleştirilmiş grafikleri de kullanabilirsiniz. Bunun için, bir grafiği gezinme hedefi olarak kullanmak gerekir. Daha fazla bilgi için İç içe yerleştirilmiş grafikler konusuna bakın.
Ek Okumalar
Daha temel gezinme kavramları için aşağıdaki kılavuzlara bakın:
- Genel bakış: Gezinme bileşeniyle ilgili genel bakış bilgilerini okuduğunuzdan emin olun.
- Etkinlik hedefleri: Kullanıcıyı etkinliklere götüren hedeflerin nasıl uygulanacağına dair örnekler.
- İletişim kutusu hedefleri: Kullanıcıyı bir iletişim kutusuna yönlendiren hedeflerin nasıl oluşturulacağına dair örnekler.
- Bir hedefe gitme: Bir hedeften diğerine nasıl gideceğinizi gösteren ayrıntılı bir kılavuz.
- İç içe yerleştirilmiş grafikler: Bir gezinme grafiğinin diğerinin içine nasıl yerleştirileceğine dair ayrıntılı bir kılavuz.