Gezinme çekmecesi

Gezinme çekmecesi bileşeni, kullanıcıların uygulamanızın çeşitli bölümlerine gidebilmesini sağlayan kayan bir menüdür. Kullanıcılar, görünümü yana kaydırarak veya menü simgesine dokunarak etkinleştirebilir.

Gezinme Çekmecesi uygulamak için şu üç kullanım örneğini göz önünde bulundurun:

  • İçerik düzenleme: Kullanıcılara, haber veya blog uygulamaları gibi farklı kategoriler arasında geçiş yapma olanağı sağlayın.
  • Hesap yönetimi: Kullanıcı hesabı olan uygulamalarda hesap ayarlarına ve profil bölümlerine hızlı bağlantılar sağlayın.
  • Özellik keşfetme: Karmaşık uygulamalarda kullanıcıların keşfedilebilirliğini ve erişimini kolaylaştırmak için birden fazla özelliği ve ayarı tek bir menüde düzenleyin.

Materyal Tasarım'da iki tür gezinme çekmecesi vardır:

  • Standart: Bir ekrandaki diğer içeriklerle alan paylaşın.
  • Kalıcı: Ekrandaki diğer içeriklerin üzerinde görünür.

Örnek

Gezinme çekmecesi uygulamak için ModalNavigationDrawer composable'ı kullanabilirsiniz.

Aşağıdaki örnekte gösterildiği gibi bir ModalDrawerSheet ve çekmecenin içeriğini sağlamak için drawerContent alanını kullanın:

ModalNavigationDrawer(
    drawerContent = {
        ModalDrawerSheet {
            Text("Drawer title", modifier = Modifier.padding(16.dp))
            Divider()
            NavigationDrawerItem(
                label = { Text(text = "Drawer Item") },
                selected = false,
                onClick = { /*TODO*/ }
            )
            // ...other drawer items
        }
    }
) {
    // Screen content
}

ModalNavigationDrawer bir dizi ek çekmece parametresini kabul eder. Örneğin, çekmecenin sürüklemelere yanıt verip vermeyeceğini gesturesEnabled parametresiyle aşağıdaki örnekte gösterildiği gibi değiştirebilirsiniz:

ModalNavigationDrawer(
    drawerContent = {
        ModalDrawerSheet {
            // Drawer contents
        }
    },
    gesturesEnabled = false
) {
    // Screen content
}

Davranış denetimi

Çekmecenin nasıl açılıp kapanacağını kontrol etmek için DrawerState işlevini kullanın. drawerState parametresini kullanarak ModalNavigationDrawer adresine DrawerState iletmeniz gerekir.

DrawerState, open ve close işlevlerine ve mevcut çekmece durumuyla ilgili özelliklere erişim sağlar. Bu askıya alma işlevleri bir CoroutineScope gerektirir. Bunu rememberCoroutineScope kullanarak örneklendirebilirsiniz. Askıya alma işlevlerini, kullanıcı arayüzü etkinliklerine yanıt olarak da çağırabilirsiniz.

val drawerState = rememberDrawerState(initialValue = DrawerValue.Closed)
val scope = rememberCoroutineScope()
ModalNavigationDrawer(
    drawerState = drawerState,
    drawerContent = {
        ModalDrawerSheet { /* Drawer content */ }
    },
) {
    Scaffold(
        floatingActionButton = {
            ExtendedFloatingActionButton(
                text = { Text("Show drawer") },
                icon = { Icon(Icons.Filled.Add, contentDescription = "") },
                onClick = {
                    scope.launch {
                        drawerState.apply {
                            if (isClosed) open() else close()
                        }
                    }
                }
            )
        }
    ) { contentPadding ->
        // Screen content
    }
}