Kotlin Jetpack Compose

Hello everyone, Jetpack Compose help us to develop Android UI with writing less code and simplifier. Jetpack Compose, it is a tool that you do not need to write XML to develop Android UI. In the developer.android website, definition of the Jetpack compose is made like that “Jetpack Compose is a modern toolkit for building native Android UI”.

For the try Jetpack Compose we need to install the latest Canary version of the Android Studio Preview. By clicking here you can download. Jetpack Compose is not ready to use in the our production apps for now.

Jetpack Compose build the UI using the composable functions. Using the these composable functions we can create the ui. For the create composable function we need to add the @Composable annotation.

To start the use composable functions i created an Empty Compose Activity. When the project created, we see that there are some composable functions like ‘Greeting’ and ‘DefaultPreview’.

It is looks like making a design with Flutter. So we can easily make our design by looking at the documentation.

Now let’s try to add our UI design by looking at the documentation. Our UI design will be like we have a user profile picture, name, and some information about the user. In my scenario, our user is Cristiano Ronaldo. After these design we have pictures of the user. Let’s start the make that design.

Firstly i created a function with the name of profileDesign and make annotation to @Composable. Then started to make design. In the design i used Material Design, you can find more information about the Material Design by clicking here. We can understand the what we did from the codes, so here is the codes:

We can see that making a UI design using the jetpack compose is really easy. I tried to make a simple design. If you have any question you can reach me by the social accounts.

References: https://developer.android.com/jetpack/compose/tutorial