Cuma Ağustos 21st, 2020

Kotlin Navigation Drawer

ile Ebubekir Sezer

Merhabalar, Popüler uygulamaların tasarımlarına baktığımız zaman ana sayfalarında yandan açılabilen menüler görebiliyoruz. Bu menüleri kotlin ile nasıl yapılacağını anlatmaya çalışacağım. Bu menüler Android dünyasında Navigation Drawer olarak geçiyor. Ben direk Android Studio’mu açıp bir empty bir kotlin projesi oluşturuyorum.

Bu proje içerisinde belli kütüphaneleri kullanacağız. DataBinding yapabilmemiz için Build.Gradle içerisinde databinding’i enable etmemiz gerekiyor ve projemde fragmentlar gösterebileceğim için Navigation kütüphanesinide ekliyorum.

Proje içerisinde activity yerine fragment kullanmak benim için daha iyi oluyor bu nedenle HomeFragment adında blank bir fragment oluşturuyorum ve herhangi bir tasarım yapmıyorum çünkü sadece Navigation Drawer yapacağım.  Fragment oluşturduktan sonra yönlendirmeleri yapabilmem için bir navigation dosyası oluşturuyorum ve burada HomeFragment’ımı ekliyorum.

Navigation’ımın çalışması için activity_main içerisinde bazı işlemler yapmamız gerekiyor. İlk olarak data binding yapabilmemiz için her şeyi layout tagleri altında yapacağım. Yandan açılan menü olması için daha sonra DrawerLayout tagleri içerisine alıyorum ve drawerLayout adında bir id veriyorum. Bir LinearLayout oluşturup içerisine fragment ekliyorum. Fragment içerisinde id olarak <strong>myNavigationHostFragment</strong> veriyorum. Daha sonra android:name’i ayarlıyorum ve navGraph’ı benim oluşturduğum navigation’ı veriyorum ve defaultNavHost’u true veriyorum.

Artık uygulamamız açıldığında oluşturduğumuz HomeFragment’ı gösterecek ama bir kaç ayarlamada MainActivity’de yapmamız gerekiyor. Şimdi Navigation Drawer’ı ekledik fakat ne göstereceğini ayarlamadık. LinearLayout altında bir NavigationView oluşturuyorum. Bu navigation view’ın id sini ve gerekli layout seçeneklerini veriyorum daha sonra menu özelliğine kendi oluşturduğumuz menüleri göstermemiz gerekiyor bunun için res klasörü altına bir menu oluşturuyorum ve 2 tane item ekliyorum.

Gerekli tasarımları layout dosyalarında oluşturduktan sonra MainActivity içerisinde ayarlamalarımız yaptık mı işlem tamamlanıyor. Main Activity içerisinde bir binding oluşturup daha sonra bu binding’in  atamasını yapıyoruz. Oluşturduğumuz fragment’ı bir navController içerisinde alıp setupActionBarWithNavController ile atıyoruz ve göstermesi gereken drawerLayout’u veriyoruz ve bunu binding içinde setup ediyoruz. Daha sonra onSupportNavigateUp fonksiyonunu override edip navigateUp fonksiyonu içerisinde de aynı işlemleri yapıyoruz.

Yukarıda gördüğünüz gibi yandan açılan bilen bir menü oluşturduk şimdi bu menüye bir başlık ekleyerek özelleştirebiliriz. Bunun için yeni bir layout oluşturuyorum ve içerisinde kendi oluşturduğum resimi ekliyorum. Navigation View içerisinde headerLayout’umuzu oluşturduğumuz  bu layout veriyoruz ve artık başlığı olan bir menü oluşturmuş olduk.

Yukarıda gördüğünüz şekilde menümüzü oluşturduk bu menüyü daha da özelleştirebilirsiniz. Projeye buraya tıklayarak erişebilirsiniz. Soru ve görüşlerinizi e-mail veya yorum olarak belirtirseniz sevinirim.

References: https://developer.android.com/guide/navigation/navigation-ui