Programming Tutorials

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.foundation.lazy.GridCells import androidx.compose.foundation.lazy.LazyVerticalGrid import androidx.compose.foundation.lazy.items import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.Card import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp class MainActivity : AppCompatActivity() { ...

Compose LazyRow Content Padding & Spacing The LazyRow is a list widget of the jetpack compose library. The LayRow displays a horizontally scrolling list that only composes and lays out the currently visible items. The content of LazyRow is its items. The following jetpack compose tutorial will demonstrate to us how we can set padding to the LazyRow content and also set the spacing between its items. The LazyRow widget constructor has an argument name ‘contentPadding’ whose data type is ‘PaddingValues’. So, we can define the LazyRow content padding using this argument. The LazyRow content padding value puts padding around the entire content, not for a single item. We can set the padding value for the LazyRow content to all sides or any specific side or sides. LazyRow content spacing means it puts space between each item of LazyRow. The LazyRow constructor has another argument name ‘horizontalArrangement’ whose data type is ‘Arrangement.Horizontal. The ‘horizontalArrangemen...

Compose LazyColumn Content Spacing & Padding The LazyColumn is a list widget of the jetpack compose library. LazyColumn is a similar widget to the RecyclerView widget. The LayColumn displays a vertically scrolling list that only composes and lays out the currently visible items. The content of LazyColumn is its items. The following jetpack compose tutorial will demonstrate how we can set the padding around the LazyColumn content and also how we can set the spacing between its items. The LazyColumn widget constructor has an argument name ‘contentPadding’ whose data type is ‘PaddingValues’. So, we can define the LazyColumn content padding using this argument. The LazyColumn content padding value actually puts padding around all its content, not for a single item. We can set the padding value for the LazyColumn content to all sides or any specific side/sides. On the other hand, LazyColumn content spacing means, it puts space between each item of LazyColumn. LazyColumn constr...

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.material.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.text.font.Font import androidx.compose.ui.text.font.FontFamily import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ val ptSansRegular = F...

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.material.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.text.font.Font import androidx.compose.ui.text.font.FontFamily import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ val customFontBold = Font(R.font.ptsansbold) val customFontRe...

MainActivity.kt package com.cfsuman.jetpackcompose import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import androidx.activity.compose.setContent import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.colorResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { MainContent() } } @Composable fun MainContent(){ Column( modifier = Modifier .background( colorResource(id = R.color.layoutBackgroundColor) )...

Introduction This code demonstrates how to retrieve dimension resources in Jetpack Compose. Dimension resources are XML files that store various dimension values used throughout your application's layout. Jetpack Compose provides a convenient way to access these values within your composable functions. Breakdown dimens.xml file: The code starts by defining two dimension resources in the dimens. xml file located in the res/values directory. These resources, named 'defaultPadding' and 'textPadding', hold the values 32dp and 24dp, respectively. Dimension values in Jetpack Compose can be specified in various units, including dp (density-independent pixels). Accessing dimension resources in composables: The MainActivity class in this example showcases how to access these dimension resources within composable functions. The MainContent composable function utilizes the dimensionResource function to retrieve the padding values defined in the dimens. xml file....