Diseño de cajones para Android con arquitectura de navegación de Syed Shaheryar Sultan | Octubre de 2020

Hola, hoy repasaremos cómo hacerlo. Disposición del cajón utilizar Arquitectura de navegación de Android. Primero, primero necesitaremos agregar algunas dependencias para Arquitectura de navegación. Abra su proyecto build.gradle file y agregue la línea a continuación a las dependencias.

dependencies {    //rest of the code    classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.3.1"

}

luego abra el archivo build.gradle en el nivel de la aplicación y agréguelo debajo de la línea

apply plugin: 'kotlin-kapt'

apply plugin: "androidx.navigation.safeargs"

android {
//rest of the code
}dependencies {//rest of the dependencies//Android Navigation Architecture
implementation "androidx.navigation:navigation-fragment-ktx:2.3.1"
implementation "androidx.navigation:navigation-ui-ktx:2.3.1"

}

sincronice su proyecto después de agregar las dependencias requeridas. Después de una sincronización exitosa, haga clic derecho en su res carpeta Nuevo entonces Directorio de recursos de Android escoger navegación de Tipo de fuente. Repita el mismo procedimiento y agregue Menú Tipo de fuente. tuya res la carpeta se verá así.

res

Dentro los Menú, crear una nueva carpeta Archivo de recursos de menú y nombrarlo nav_menu luego adentro navegación crear una nueva carpeta Archivo de recursos de navegación y nombrarlo nav_graph. Déjelos en blanco por ahora, los veremos más tarde. Después de agregar ambos archivos res la carpeta se verá así.

Abre los tuyos activity_main.xml archivar y agregar Disposición del cajón, Barra de herramientas, Fragmento, Automóvil club británico NavigationView Ahora activity_main.xml se verá así.

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
android:id="@+id/drawer_layout"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

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

<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:titleTextColor="@color/white"
android:background="@color/design_default_color_primary"/>

<fragment
android:id="@+id/nav_host"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="@navigation/nav_graph" />

</LinearLayout>

<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:menu="@menu/nav_menu"
android:layout_gravity="start"/>

</androidx.drawerlayout.widget.DrawerLayout>

Abre los tuyos MainActivity.kt y agregue el código a continuación dentro onCreate método

setSupportActionBar(toolbar)

val navController = Navigation.findNavController(this, R.id.nav_host)
val navView = nav_view
NavigationUI.setupWithNavController(navView, navController)
NavigationUI.setupActionBarWithNavController(this, navController, drawer_layout)

Tuya onCreate se verá así

MainActivity.kt

Entonces llama y Sobrescribir método dentro MainActivity.kt y agregue debajo el código

override fun onSupportNavigateUp(): Boolean {
return NavigationUI.navigateUp(
Navigation.findNavController(this, R.id.nav_host),
drawer_layout
)
}

Su MainActivity.kt se verá así

MainActivity.kt

Después de agregar todo el código requerido dentro MainActivity.kt crear 2 espacios en blanco Fragmentos. Una vez creado Fragmentos Abre los tuyos nav_graph el archivo que ahora hemos dejado en blanco es el momento de agregar Fragmentos en esto nav_graph archivo. Haga clic en el botón Agregar fragmentos en nav_graph archivo y agregue ambos archivos Fragmentos que creamos.

nav_graph

Su nav_graph se verá así.

nav_graph

Entonces abre nav_menu el archivo que dejamos en blanco y agregamos 2 Menú artículos.

<item android:title="First Fragment"
android:id="@+id/firstFragment"/>

<item
android:title="Second Fragment"
android:id="@+id/secondFragment"/>

La clave es dar estos articulo mismo carné de identidad que le dimos Fragmentos dentro nav_graph de otra manera Fragmentos no se cargará. los nav_menu se verá así.

nav_menu

Ahora inicie la aplicación y vea la magia. puedes ver El primer fragmento se abre de forma predeterminada y cuando toca el icono hamburguesa El icono que ves es ambos Fragmentos que creamos.

Y despues de elegir el segundo Fragmento puedes ver hamburguesa el icono cambia a flecha hacia atrás.

Este fue un ejemplo básico que le mostró cómo puede crear Disposición del cajón con Arquitectura de navegación. Hay muchas cosas que puede personalizar para satisfacer sus necesidades, por lo que puede abrir estudio y comience a codificar.

Gracias.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *