Tuesday 28 September 2021

Android Jetpack Compose Dropdown menu Example | Dropdown menu using DropdownMenu Composable

Dropdown menu:
       We are going to use DropdownMenu Composable for creating dropdown menu.



fun DropdownMenu(
expanded: Boolean,
onDismissRequest: () -> Unit,
modifier: Modifier = Modifier,
offset: DpOffset = DpOffset(0.dp, 0.dp),
properties: PopupProperties = PopupProperties(focusable = true),
content: @Composable ColumnScope.() -> Unit
)

In Above code if expanded is true, the popup menu with dropdown content will be shown.
onDismissRequest will be called when the menu should be dismiss,
@Composable
fun DropdownDemo() {
    var expanded by remember { mutableStateOf(false) }
    val items = listOf(
        "Apple", "Banana", "Cherry", "Grapes",
        "Mango", "Pineapple", "Pear"
    )
    var selectedIndex by remember { mutableStateOf(0) }
    Column(
        modifier = Modifier
            .fillMaxSize()
            .wrapContentSize(Alignment.TopStart)
            .padding(all = 5.dp)
    ) {
        Text(
            items[selectedIndex],
            modifier = Modifier
                .fillMaxWidth()
                .clickable(onClick = { expanded = true })
                .background(
                    Color.Red
                ),
            color = Color.White,
            fontSize = 20.sp,
            textAlign = TextAlign.Start
        )
        DropdownMenu(
            expanded = expanded,
            onDismissRequest = { expanded = false },
            modifier = Modifier
                .fillMaxWidth()
                .background(
                    Color.Gray
                )
        ) {
            items.forEachIndexed { index, s ->
                DropdownMenuItem(onClick = {
                    selectedIndex = index
                    expanded = false
                }) {
                    Text(text = s)
                }
            }
        }
    }
}

Hope this will help someone.
Enjoy Coding.......... :)

Friday 24 September 2021

Android Jetpack Compose Button Example | How to center a button in jetpack Compose | How to onclick listener on button in Jetpack Compose

Hi Friends,
             Today I am sharing a Sample of Jetpack Compose Button view. I will show you how
to set onclick listener on button in Jetpack Compose. How to style on Button in
Jetpack Compse , how to set height and width of button in Jetpack compose.

  Code:
   

  Hope this will help someone.
  Enjoy Coding........... :) 





Android Jetpack compose- Android Listview using Jetpack compose | Jetpack compose listview clicklistener

 Hello all, 
        Today I am going to share my anothere Android Jetpack Compose tutoria.
How to set clicklistener on listview in android Jetpack Compses, how to set clicklistener 
on button using Jetpack Compse.



I am sharing below code where I am handling list item click in jetpack compose.


Downlaod complete code from here
Hope this will help someone.
Enjoy Coding....... :)

Android Jetpack Compose Alert Dialog Sample | Jetpack Compose Dialog

 Hi Friends,  
               Today I am sharing the Jetpack Compse Alert Dialog Sample.

What is Alert Dialog?
- Alert dialog is a Dialog which interrupts the user with 
urgent information, details or actions.


Code:

Hope this will help someone.
Enjoy Coding........ :)



Thursday 23 September 2021

How to get Context in Jetpack Compose

Hello All,
            Many of us facing issue in using/getting context in JetPack Compose.
Here I am sharing a composbale function where I am using context for showing toast message.

 

Android Jetpack Compose- An easy way to RecyclerView | How to create a RecyclerView in Jetpack Compose | LazyColumn-JetPack Compose

 Hello Friends,
        Today I am going to share a my another JetPack Compose tutorial.
Here I am going to share you the creation of listview/recyclerview using 
Compose.



Creating a listview/recyclerview in Compose:
                                            Creating a listview/recyclerview in Compose is easy.
No Adapter. No View holder.


What is LazyColumn?
- A LazyColumn is a vertically scrolling list that only composes and lays out the currently visible items. It’s similar to a Recyclerview in the classic Android View system.


Download code from here
Hope this will help someone.
Enjoy Coding......................... :)

Wednesday 22 September 2021

Android Jetpack- Jetpack cardview sample

 Hi All,
         Today I am going to share Jetpack CardView sample. Here I am going to create a simple android cardview UI  withoutt using the android Xml and layout editor.

We are going to build the UI using Composable funtion(i.e: using Jetpack Compse).

Column :  We are going to use Column function for arranging the view vertically.
For arranging the view horizontally you can use Row function.

 

 Check MainActivity.kt file for Code,



Download complete code here

Hope this will help someone.
Enjoy coding.... :)

Tuesday 21 September 2021

Android Jetpack- Composable functions




Jetpack Compose is built around composable functions. These functions
let you define your app's UI programmatically by describing how it
should look and providing data dependencies, rather than 
focusing on the process of the UI's construction (initializing an 
element, attaching it to a parent, etc.).
To create a composable function, just add the @Composable annotation
to the function name.




Enjoy Coding.... :)

Saturday 4 September 2021

Android Jetpack Compose-Android Gradle plugin requires Java 11 to run. You are currently using Java 1.8

 Hi All, 
            Many of us facing below issue  while running the Android Jetpack 
Compose Project.

> Failed to apply plugin 'com.android.internal.application'.
    > Android Gradle plugin requires Java 11 to run. You are currently using Java 1.8.
    You can try some of the following options:
    - changing the IDE settings.
    - changing the JAVA_HOME environment variable.
    - changing `org.gradle.java.home` in `gradle.properties`.

In order to fix this issue we need to use Java 11. You can find it in Preferences > Build, Execution, Deployment > Build Tools > Gradle > Gradle JDK.



Hope this will help some one.
Enjoy Coding.......  :)



Wednesday 1 September 2021

Android Jetpack Compose- Android Studio with Jetpack Compose Getting Started | Jetpack Compose Tutoria


Hi All,
  
Today I am going to share my first JetPack Compose Tutorial. Here we learn how\nto setup android compose in android studio. We see the rquired dependency and other settings.

Step 1: Installation:  First we have to download Android Studio Arctic Fox. That’s because when we use Android Studio to develop our app with Jetpack Compose, we can benefit from smart editor features, such as New Project templates and the ability to immediately
preview our Compose UI.

Step2: Create android app :  After the installint of latest android studio from link now lets 
create an app.
  • Open Android Studio > select File > New > New Project from the menu bar.  
  • In the Select a Project Template window, select Empty Compose Activity and click Next.
  • In the Configure your project window, do the following:
    1. Set the NamePackage name, and Save location as you normally would.
    2. Note that, in the Language dropdown menu, Kotlin is the only available option because Jetpack Compose works only with classes written in Kotlin.
    3. In the Minimum API level dropdown menu, select API level 21 or higher.
  • Click Finish.  


   You can see below dependecny in your app build.gradle file which is required for Compose.
    
 



 For more check this tutorial

While setting it if you are facing issue of  "Android Gradle plugin requires Java 11 to run. You are currently using Java 1.8". Plesase check this tutorial

Hope this will help some one.
Enjoy Coding....... :)

 

Copyright @ 2013 Android Developers Blog.