package com.example.fragment import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.activity.enableEdgeToEdge import androidx.compose.foundation.layout.Box 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.Scaffold import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import androidx.navigation.NavController import androidx.navigation.compose.NavHost import androidx.navigation.compose.composable import androidx.navigation.compose.rememberNavController import com.example.fragment.ui.theme.FragmentTheme class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) enableEdgeToEdge() setContent { val nav_Controller = rememberNavController() NavHost(navController = nav_Controller, startDestination = "fragment1") { composable("fragment1"){ Fragment1(nav_Controller)} composable("fragment2"){ Fragment2(nav_Controller)} } } } } @Composable fun Fragment1(navController: NavController){ Column(modifier = Modifier.fillMaxSize()) { Spacer(modifier = Modifier.height(120.dp)) Text(text = "This is Fragment 1", color = Color.Magenta, fontSize = 30.sp) } Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) { Button(onClick = {navController.navigate("fragment2")}) { Text(text = "Go to Fragment 2", fontSize = 30.sp) } } } @Composable fun Fragment2(navController: NavController){ Column(modifier = Modifier.fillMaxSize()) { Spacer(modifier = Modifier.height(120.dp)) Text(text = "This is Fragment 2", color = Color.Magenta, fontSize = 30.sp) } Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) { Button(onClick = {navController.navigateUp()}) { Text(text = "Go Back to Fragment 1", fontSize = 30.sp) } } }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter