Navegación básica con Jetpack Compose en Android | Operating systems, scripting, PowerShell and security

Android, Kotlin

Contenidos

Importar la biblioteca de Jetpack Navigation Compose
MainActivity.kt

Importar la biblioteca de Jetpack Navigation Compose

implementation("androidx.navigation:navigation-compose:2.4.0")

1	implementation("androidx.navigation:navigation-compose:2.4.0")

MainActivity.kt

package com.example.myapplication

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import androidx.navigation.NavHostController
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.rememberNavController


class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MyApplication()
        }
    }
}

@Composable
fun MyApplication() {
    val navController = rememberNavController()
    Navigation(navController = navController)
}

@Composable
fun Navigation(navController: NavHostController) {
    NavHost(navController = navController, startDestination = "first") {
        composable("first") {
            FirstScreen(navController)
        }
        composable("second") {
            SecondScreen(navController)
        }
    }
}

@Composable
fun FirstScreen(navController: NavHostController) {
    Surface(modifier = Modifier.fillMaxSize()) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(16.dp),
            verticalArrangement = Arrangement.Center,
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Text(
                text = "First Fragment",
                style = MaterialTheme.typography.bodyLarge
            )
            Spacer(modifier = Modifier.height(16.dp))
            Button(
                onClick = { navController.navigate("second") }
            ) {
                Text(text = "Go to Second Fragment")
            }
        }
    }
}

@Composable
fun SecondScreen(navController: NavHostController) {
    Surface(modifier = Modifier.fillMaxSize()) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(16.dp),
            verticalArrangement = Arrangement.Center,
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Text(
                text = "Second Fragment",
                style = MaterialTheme.typography.bodyMedium
            )
            Spacer(modifier = Modifier.height(16.dp))
            Button(
                onClick = { navController.popBackStack() }
            ) {
                Text(text = "Go back to First Fragment")
            }
        }
    }
}

package com.example.myapplication

import android.os.Bundle

import androidx.activity.ComponentActivity

import androidx.activity.compose.setContent

import androidx.compose.foundation.layout.Arrangement

import androidx.compose.foundation.layout.Column

import androidx.compose.foundation.layout.Spacer

import androidx.compose.foundation.layout.fillMaxSize

import androidx.compose.foundation.layout.height

import androidx.compose.foundation.layout.padding

import androidx.compose.material3.Button

import androidx.compose.material3.MaterialTheme

import androidx.compose.material3.Surface

import androidx.compose.material3.Text

import androidx.compose.runtime.Composable

import androidx.compose.ui.Alignment

import androidx.compose.ui.Modifier

import androidx.compose.ui.unit.dp

import androidx.navigation.NavHostController

import androidx.navigation.compose.NavHost

import androidx.navigation.compose.composable

import androidx.navigation.compose.rememberNavController

class MainActivity : ComponentActivity() {

override fun onCreate(savedInstanceState: Bundle?) {

super.onCreate(savedInstanceState)

setContent {

MyApplication()

}

@Composable

fun MyApplication() {

val navController = rememberNavController()

Navigation(navController = navController)

}

@Composable

fun Navigation(navController: NavHostController) {

NavHost(navController = navController, startDestination = "first") {

composable("first") {

FirstScreen(navController)

}

composable("second") {

SecondScreen(navController)

}

@Composable

fun FirstScreen(navController: NavHostController) {

Surface(modifier = Modifier.fillMaxSize()) {

Column(

modifier = Modifier

.fillMaxSize()

.padding(16.dp),

verticalArrangement = Arrangement.Center,

horizontalAlignment = Alignment.CenterHorizontally

) {

Text(

text = "First Fragment",

style = MaterialTheme.typography.bodyLarge

)

Spacer(modifier = Modifier.height(16.dp))

Button(

onClick = { navController.navigate("second") }

) {

Text(text = "Go to Second Fragment")

}

@Composable

fun SecondScreen(navController: NavHostController) {

Surface(modifier = Modifier.fillMaxSize()) {

Column(

modifier = Modifier

.fillMaxSize()

.padding(16.dp),

verticalArrangement = Arrangement.Center,

horizontalAlignment = Alignment.CenterHorizontally

) {

Text(

text = "Second Fragment",

style = MaterialTheme.typography.bodyMedium

)

Spacer(modifier = Modifier.height(16.dp))

Button(

onClick = { navController.popBackStack() }

) {

Text(text = "Go back to First Fragment")

}

Navegación básica con Jetpack Compose en Android (Kotlin, Android)

Importar la biblioteca de Jetpack Navigation Compose

MainActivity.kt

LIBRO DE POWERSHELL

LO ÚLTIMO

VÍDEOS