From 7d23e5440d6f6208df57fa7d4f9cb9712c3387ca Mon Sep 17 00:00:00 2001 From: "DHNGL-ABHISHEKP\\Abhishek P" Date: Fri, 22 Mar 2024 02:12:04 +0530 Subject: [PATCH] Added new lesson --- .../lessons/lesson_23/LESSON_23.kt | 27 +++++++--- .../lessons/lesson_23/TabScreen.kt | 49 ++++++++++++------- .../utils/navigation/NavConstants.kt | 4 +- .../utils/navigation/NavDes.kt | 3 +- 4 files changed, 55 insertions(+), 28 deletions(-) diff --git a/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/LESSON_23.kt b/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/LESSON_23.kt index fd4cb26..e2fcdf3 100644 --- a/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/LESSON_23.kt +++ b/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/LESSON_23.kt @@ -16,17 +16,26 @@ import com.example.jetpack_compose_all_in_one.ui.theme.dp_15 import com.example.jetpack_compose_all_in_one.utils.LogicPager import com.example.jetpack_compose_all_in_one.utils.PagedLessonHeader +/** + * Composable function for Lesson 23. + * It displays the content of Lesson 23. + */ @Composable @Preview(showBackground = true) fun Lesson_23() { - LessonContent() + LessonContent() // Calls the LessonContent composable function to display Lesson 23 content. } +/** + * Composable function for the content of Lesson 23. + */ @OptIn(ExperimentalMaterial3Api::class) @Composable private fun LessonContent() { + // Remember the current page using mutable state val currentPage = rememberSaveable { mutableIntStateOf(0) } + // LogicPager composable for handling paging LogicPager( pageCount = 2, currentPage = currentPage @@ -34,27 +43,29 @@ private fun LessonContent() { Column( Modifier .fillMaxSize() - .padding(it) + .padding(it) // Apply padding to the column based on the pager state ) { + // Display the header for the paged lesson PagedLessonHeader( modifier = Modifier .fillMaxWidth() - .padding(dp_15), + .padding(dp_15), // Apply padding to the header currentPage = currentPage.intValue, - headers = stringArrayResource(R.array.lesson_23_header_text).toList(), + headers = stringArrayResource(R.array.lesson_23_header_text).toList(), // Get headers from string resource infoContent = listOf( "1", "2", "3", "4", "https://www.google.com" - ) + ) // Information content for the header ) + // Based on the current page, display different tab screens when (currentPage.intValue) { - 0 -> TabScreen() - 1 -> TabScreen() + 0 -> TabScreen() // Display TabScreen for page 0 + 1 -> TabScreen() // Display TabScreen for page 1 } } } -} \ No newline at end of file +} diff --git a/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/TabScreen.kt b/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/TabScreen.kt index b03a27f..c39c448 100644 --- a/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/TabScreen.kt +++ b/app/src/main/java/com/example/jetpack_compose_all_in_one/lessons/lesson_23/TabScreen.kt @@ -25,68 +25,83 @@ import androidx.compose.ui.graphics.Color import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp +/** + * Composable function representing a screen with tabs. + */ @ExperimentalMaterial3Api @Composable fun TabScreen() { + // State to track the index of the selected tab var selectedTabIndex by remember { mutableStateOf(0) } + // Scaffold composable for layout structure Scaffold( topBar = { TopAppBar( - title = { Text("Tab Demo") } + title = { Text("Tab Demo") } // Title for the top app bar ) }, content = { padding -> Column( modifier = Modifier .fillMaxSize() - .padding(padding), + .padding(padding), // Apply padding to the column content horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center ) { + // Display tabs with titles Tabs( - titles = listOf("Tab 1", "Tab 2", "Tab 3"), - selectedTabIndex = selectedTabIndex, + titles = listOf("Tab 1", "Tab 2", "Tab 3"), // Titles for the tabs + selectedTabIndex = selectedTabIndex, // Currently selected tab index onTabSelected = { index -> - selectedTabIndex = index + selectedTabIndex = index // Update the selected tab index } ) - Spacer(modifier = Modifier.height(16.dp)) - Text(text = "Content for Tab ${selectedTabIndex + 1}") + Spacer(modifier = Modifier.height(16.dp)) // Spacer for content separation + Text(text = "Content for Tab ${selectedTabIndex + 1}") // Content based on the selected tab } } ) } +/** + * Composable function for rendering tabs. + */ @Composable fun Tabs( - titles: List, - selectedTabIndex: Int, - onTabSelected: (Int) -> Unit + titles: List, // List of titles for the tabs + selectedTabIndex: Int, // Index of the currently selected tab + onTabSelected: (Int) -> Unit // Callback for tab selection ) { TabRow( - selectedTabIndex = selectedTabIndex, + selectedTabIndex = selectedTabIndex, // Index of the currently selected tab indicator = { tabPositions -> + // Customizing tab indicator position TabRowDefaults.Indicator( - modifier = Modifier.tabIndicatorOffset(tabPositions[selectedTabIndex]), - color = Color.Black + modifier = Modifier.tabIndicatorOffset(tabPositions[selectedTabIndex]), // Offset based on selected tab position + color = Color.Black // Color of the indicator ) } ) { + // Iterate over titles to create individual tabs titles.forEachIndexed { index, title -> Tab( - text = { Text(title) }, - selected = selectedTabIndex == index, - onClick = { onTabSelected(index) } + text = { Text(title) }, // Text for the tab + selected = selectedTabIndex == index, // Check if the tab is currently selected + onClick = { onTabSelected(index) } // Callback when the tab is clicked ) } } } +/** + * Preview function for TabScreen composable. + */ @Preview(showBackground = true) @Composable @ExperimentalMaterial3Api fun DefaultPreview() { - TabScreen() + TabScreen() // Displaying a preview of the TabScreen composable } + diff --git a/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavConstants.kt b/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavConstants.kt index f09e00e..f37dc1c 100644 --- a/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavConstants.kt +++ b/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavConstants.kt @@ -152,8 +152,8 @@ object NavConstants { const val LESSON_22 = "LESSON_22" const val LESSON_22_ABOUT = "Lesson 22: Media3 ExoPlayer" - const val LESSON_23 = "LESSON_22" - const val LESSON_23_ABOUT = "Lesson 22: Media3 ExoPlayer" + const val LESSON_23 = "LESSON_23" + const val LESSON_23_ABOUT = "Lesson 23: Tabs" const val QUOTE_2 = "quote2" const val QUOTE_2_ABOUT = "Swipe Quotes" diff --git a/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavDes.kt b/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavDes.kt index b5b5cdd..57db523 100644 --- a/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavDes.kt +++ b/app/src/main/java/com/example/jetpack_compose_all_in_one/utils/navigation/NavDes.kt @@ -542,7 +542,8 @@ sealed class NavDes(val data: INavigationDrawerItem, val customAppBarStringId: I Lesson19, Lesson20, Lesson21, - Lesson22 + Lesson22, + Lesson23 ), LESSONS ) )