Jetpack Compose Tutorial - Android Launched new Library Jetpack Compose

Google announced Jetpack Compose at I/O 2019. Compose is a declarative UI framework. Compose is replacement for view based android system which will be a part of android beginning.

Here we have created so many compose examples with Android studio for beginners who knows android and want to start with Compose tutorial

 

What is Composable?

Composable are the main building blocks of Jetpack Compose. A composable functions are normal kotlin functions by adding an annotation @Composable By seeing the composable function we thought that it takes an input and return something as output, but internally an action registered to add the element to the in-memory representation of the composable tree. The registered actions are called 'emmiting'

 

Properties of composable functions

Calling Context

Any funcitons which is annotated with @Composable can be transulated by Jetpack Compose compiler to a function which implicitly gets passed an instance of Composable context as parameter and this instance of context will also be farwards to its children inside that composable tree

    @Composable
fun DisplayName(name: String, sirname: String) {
	Column(modifier = Modifier.padding(16.dp)) {
	Text(text = name)
	Text(text = sirname, style = MaterialTheme.typography.subtitle2)
	}
}

Let's take a simple function with @Composable annotation, for this composable function jetpack compose compiler will add Composable parameter implicitly for each composable call on composable tree

So this will be internally looks like below

 fun DisplayName(name: String, sirname: String, $composer: Composer<*>) {
$composer.start(111)
Column(modifier = Modifier.padding(16.dp), $composer) {
		Text(
			text = name,
			$composer
		)
		Text(
			text = sirname,
			style = MaterialTheme.typography.subtitle2,
			 $composer
		)
	}
		$composer.end()
 }