Android Academy · Ders

Alt Gezinme ve Sekmeler

BottomNavigationView'ı NavController'a bağlayarak çok bölümlü gezinme, TabLayout, ViewPager2 ve TabLayoutMediator ile kaydırılabilir sekmeler uygulayın.

Alt Gezinme ve Sekmeler, CoddyKit'te ücretsiz bir Android Academy dersidir. Bu, 5 dersinin 5. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Android Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Android Academy kursu toplamda 5 dersten oluşur.

Gezinme Kalıpları

Android uygulamalarında üst düzey gezinme için kullanılan iki yaygın kalıp:

Alt Gezinme — 3–5 ana hedef için kullanılır. Her zaman görünürdür. Eşit öneme sahip bölümler (ör. Ana Sayfa, Arama, Profil) için en uygunudur.
Sekmeler — bir ekran içindeki ilişkili içerikler için kullanılır (ör. Tümü / Etkin / Tamamlandı). Kaydırma desteği için genellikle ViewPager2 ile birlikte kullanılır.

BottomNavigationView Yerleşimi

Activity yerleşiminize BottomNavigationView ve bir FragmentContainerView ekleyin:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/navHostFragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        app:navGraph="@navigation/nav_graph"
        app:defaultNavHost="true" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNav"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:menu="@menu/bottom_nav_menu" />

</LinearLayout>

Alt Gezinme Menü Öğeleri

Öğeleri res/menu/bottom_nav_menu.xml içinde tanımlayın. Her öğenin kimliği, gezinme grafiğindeki bir hedef kimliğiyle eşleşmelidir:

<!-- res/menu/bottom_nav_menu.xml -->
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/homeFragment"
        android:icon="@drawable/ic_home"
        android:title="Home" />
    <item
        android:id="@+id/searchFragment"
        android:icon="@drawable/ic_search"
        android:title="Search" />
    <item
        android:id="@+id/profileFragment"
        android:icon="@drawable/ic_person"
        android:title="Profile" />
</menu>

NavController'a Bağlama

BottomNavigationView bileşenini onCreate() içinde NavController'a bağlayın:

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val navHost = supportFragmentManager
            .findFragmentById(R.id.navHostFragment) as NavHostFragment
        val navController = navHost.navController

        binding.bottomNav.setupWithNavController(navController)

        // Hide bottom nav on detail screens:
        navController.addOnDestinationChangedListener { _, destination, _ ->
            binding.bottomNav.visibility = when (destination.id) {
                R.id.detailFragment -> View.GONE
                else -> View.VISIBLE
            }
        }
    }
}

Alt Gezinmede Rozetler

Alt gezinme öğelerinde bildirim rozetleri gösterin:

// Show a numbered badge:
val badge = binding.bottomNav.getOrCreateBadge(R.id.homeFragment)
badge.number = 5
badge.isVisible = true

// Show dot badge (no number):
val dotBadge = binding.bottomNav.getOrCreateBadge(R.id.searchFragment)
dotBadge.isVisible = true

// Remove badge:
binding.bottomNav.removeBadge(R.id.homeFragment)

TabLayout

TabLayout, genellikle kaydırılabilir içerik için ViewPager2 ile birlikte kullanılan yatay sekmeleri gösterir:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

</LinearLayout>

ViewPager2 + FragmentStateAdapter

Her sekme konumu için bir fragment sağlayan bir adaptör oluşturun:

class TasksPagerAdapter(fragment: Fragment) : FragmentStateAdapter(fragment) {

    override fun getItemCount() = 3

    override fun createFragment(position: Int): Fragment = when (position) {
        0 -> AllTasksFragment()
        1 -> ActiveTasksFragment()
        2 -> CompletedTasksFragment()
        else -> throw IllegalStateException("Unknown tab $position")
    }
}

TabLayoutMediator

ViewPager2 ile TabLayout bileşenlerini TabLayoutMediator kullanarak bağlayın:

// In Fragment.onViewCreated():
val adapter = TasksPagerAdapter(this)
binding.viewPager.adapter = adapter

TabLayoutMediator(binding.tabLayout, binding.viewPager) { tab, position ->
    tab.text = when (position) {
        0 -> "All"
        1 -> "Active"
        2 -> "Done"
        else -> ""
    }
}.attach()

// Disable swipe if needed:
binding.viewPager.isUserInputEnabled = false

Simgeli Sekme

TabLayout sekmelerine simgeler ekleyin:

TabLayoutMediator(binding.tabLayout, binding.viewPager) { tab, position ->
    when (position) {
        0 -> {
            tab.text = "Home"
            tab.setIcon(R.drawable.ic_home)
        }
        1 -> {
            tab.text = "Search"
            tab.setIcon(R.drawable.ic_search)
        }
        2 -> {
            tab.text = "Profile"
            tab.setIcon(R.drawable.ic_person)
        }
    }
}.attach()

Ekran Dışı Sayfa Sınırı

Varsayılan olarak ViewPager2 yalnızca bitişik sayfayı bellekte tutar. Sekmeler arasında geçiş yaparken sekmelerin etkin kalması gerekiyorsa offscreenPageLimit değerini artırın:

// Keep 2 pages on each side alive:
binding.viewPager.offscreenPageLimit = 2

// Note: FragmentStateAdapter saves and restores state for off-screen
// fragments even when offscreenPageLimit is 1 (default).
// Only increase this when you need views (not just state) to survive.

Alt Gezinme ve Sekmeler: Seçim

Doğru kalıbı seçmek için hızlı kılavuz:

Alt Gezinmeyi kullanın: farklı amaçlara sahip 3–5 üst düzey hedef olduğunda (Ana Sayfa, Arama, Bildirimler, Profil)
Sekmeleri kullanın: aynı türdeki içeriği filtrelerken veya kategorilere ayırırken (Tümü / Etkin / Arşivlenmiş görevler)
İkisini birleştirin: üst düzey bölümler için Alt Gezinmeyi, bir bölüm içindeki alt filtreleme için Sekmeleri kullanın

Hızlı Kontrol

Bir TabLayout'u ViewPager2'ye bağlayan ve sekme etiketlerini ayarlayan sınıf hangisidir?

Özet: Alt Gezinme ve Sekmeler

Çok bölümlü gezinmeyi doğru şekilde uygulama:

BottomNavigationView — eşit öneme sahip 3–5 hedef; menü kimlikleri, gezinme grafiğindeki hedef kimlikleriyle eşleşir
setupWithNavController() — otomatik sekme geçişi ve geri yığını
getOrCreateBadge() ile rozetler
TabLayout + ViewPager2 — aynı içeriğin kaydırılabilir, filtrelenmiş görünümleri
TabLayoutMediator — ikisini bağlar ve etiketleri ayarlar

Sırada: kodunuzu güvenilir tutmak için JUnit ile birim testi.

Sıkça Sorulan Sorular

“Alt Gezinme ve Sekmeler” dersi ücretsiz mi?

Evet — “Alt Gezinme ve Sekmeler” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Android Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Android Academy kursu toplamda 5 dersten oluşur.

“Alt Gezinme ve Sekmeler” dersinde ne öğreneceğim?

BottomNavigationView'ı NavController'a bağlayarak çok bölümlü gezinme, TabLayout, ViewPager2 ve TabLayoutMediator ile kaydırılabilir sekmeler uygulayın. Android Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

Android Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te Android Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 5 dersinin 5. dersidir.

“Alt Gezinme ve Sekmeler” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu Android Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her Android Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

← Android Academy Sayfasına Dön