State - Android Jetpack Compose - Part 6

[@CybercoderNaj]

DAMN! The Android videos by Google are so confusing. They assume we know 80% of what they speak. This video explained an important topic soo beautifully and simple language. I bet no one should have a problem with this!! Keep it going sir!❤️❤️

[@PhilippLackner]

Thanks a lot bro!!

[@nilanjanmukhopadhyay8369]

The Google thing you said is absolutely true. They make videos for them who wrote the Compose library themselves.

[@karentechnologies3990]

I agree google tutorials always sucks

[@OnlineEntrepreneurTools]

100% Agree! Thanks Philipp!

[@junaidmughal3806]

and the ladies are too distractive lol

[@sergiucodes]

I just finished watching an official android developers yt video before this and God it was tough! thanks God you make these videos and actually make sense! Thanks again man!

[@kravets_coding]

The best tutorials on Compose that found so far. Earch lesson has a topic and well organized. So in the future I can easy come back and review a specific topic.

[@alvaroisea2259]

best playlist on youtube to get you up and running with compose, thanks a lot!

[@PhilippLackner]

Thanks!

[@hadjsaidaoumer3058]

Thanks Philipp 🥰 , You are the best teacher 🙏

[@mamatasahoo1230]

Your videos are truely awesome . Learned in no time. Keep up the awesome work .

[@nilanjanmukhopadhyay8369]

Won't reiterate what other people have already said about the content. But man you look super cute in the videos. The voice is so relaxing. And in case you are reading the comment please give a love react. Your channel is going to the moon pretty soon. So, you won't be sitting idle and reading comments at that time.

[@PhilippLackner]

Thanks so much!!

[@Landofcoding]

Google documents somtimes make it complicated, i came here and i see things much easier thank you Philipp for your simplify

[@debanjandas6772]

After watching this video, I go to google document then it makes sense more.😄

[@tamildubbedmoviesnew952]

Your videos are so clearly explained dude...

[@Prashanth-wg1yh]

Minor edit to make the top box too change color: 1. the Colorbox composable function can be provided with the state parameter using MutableState 2. Within the box function modifier inside the Colorbox, to set the backgound, use the above state parameter. @Composable fun ColorBox(modifier: Modifier = Modifier,color: MutableState, updateColor: (Color) -> Unit){ Box(modifier.background(color.value) 3. While calling the ColorBox from within the Column function inside onCreate, just pass this state parameter. ColorBox(modifier = Modifier.fillMaxSize(0.5f), color){ color.value = it }

[@rajatchauhan4845]

You are blessed with art of teaching

[@offorjohn]

yea rajat you are 100% right

[@Trecoolerok]

Bro, thanks. You're a great in explanation complicated things easily.

[@YokoYokoOneTwo]

Yo, Can you explain me why (Color)->Unit works here? If it returns nothing then how can you pass value to {color.value=it}

[@Trecoolerok]

@@YokoYokoOneTwo in Java used method void setColor(int). This method returns nothing, so it's type (in Kotlin) is Unit

[@YokoYokoOneTwo]

@@Trecoolerok Oh i see... But its still not intuitive for me. I can imagine it as if we passed (val color) into (Colorbox) so that it will wait for any changes, but im not quite sure if thats ok. Can we call (val color) observer in that case?

[@smonkey001]

A little bit diving into the double wrapping of remember and mutableStateOf would be extra appreciated. Like what are those two functions return, what are the purposes of them and the mechanic of them. If I just pass Color around, what would be the consequences.

[@mehulbisht9708]

do composables get recomposed like activities and fragments on orientation changes? Does list position reset? Also, do you feel the lazycolumn to be laggy in comparison to the recyclerview?

[@PhilippLackner]

Yes they do get recomposed on orientation change. State resets unless you use rememberSaveable(), that survives orientation change. Or if you just put your state in a viewmodel. Lazy column feels smooth too me

[@hinrichwrage3004]

Google and the edu platforms like udacity still teach old garbage. It's such a trap! Thank you for your work! It is badly needed! BTW: I'm surprised how complicated it gets just to set a color in an event handler.

[@coffeedude]

What is the point of remember { } if I have my state saved in a viewmodel? Shouldn't I save it there or am I missing something?

[@jblacktube]

Thanks for the video! I totally got lost after the 9:30 mark, though. I think I may have gotten confused by the introduction of a lambda there

[@poornabhaskarduvvari2952]

Excellent explanation in understandable way. Plz go ahead with more & more videos. Thanks a lot.

[@PhilippLackner]

Thank you, I will

[@tmjromao]

Thanks for the clearly explanation. Didn't understood why, on ColorBox "updateColor lambda function" is defined as function parameters, between "( )" and is then on ColorBox body (not input parameter), between "{ }" suppose it's a characteristic of lambda functions....

[@mdazharuddin4684]

Yes! It's a kotlin syntactical sugar. If the last parameter of a function expects a lambda expression , then you can move it out of parentheses and if you are providing only the lambda and nothing else, you can also remove the parentheses altogether!

[@illusion9423]

It's called trailing lambdas, and one of Kotlin's best features imo It makes the code so much easier to read and write

[@fernandogoncalves1891]

So much work to handle an event.

[@Youtube-Mark]

clean and clear example, i better understood the state in Jetpack Compose, more over a new point internal and external state!, all this seams to be very messy , we must be in the state of compose all the time!

[@aneessaleh2870]

great video man just helping with the algorithms XD

[@tommy9x]

Not quite understand updatecolor, The Box in Main activity is different from the box in @composable? Why it can be clickable?

[@mdazharuddin4684]

The second example, where you moved the state up the ui hierarchy, is called State Hoisting

[@debanjandas6772]

I must admit it has a lot similarity with react

[@VitaliyLL]

Is there any specific reason to pass the modifier to a composable function from outside? Why we did that for our ColorBox?

[@natz8982]

@Philipp Lackner So at last part of video since color box write data it won't be recomposed right only Box will be recomposed because state has changed

[@caglarkullu9275]

It is very similar to flutter, so easy to learn. thank you

[@daniyar2718]

As usual good explanation, thanks a lot for your effort

[@PhilippLackner]

You're welcome

[@syprosegwako8297]

Thanks for great videos always! A question: can state hoisting cause a recomposition delay? I have experienced weird UI responses with textfields and buttons especially when my state is hoisted way up the viewmodel.

[@pembatamang8233]

Hey philpp what are the benefits of learning to build in compose ? Is this going to be multiplatform like flutter and more like web, android wear? feels like I am abandoning my past android development experience and starting from scratch

[@PhilippLackner]

The benefits right now are faster and more fun development with a lot of more freedom in UI design. The future will show how well it can be used in Kotlin Multiplatform

[@kirwakelvinkering3122]

Philip , kindly revisit what Manuel did on Saving UI state especially the savedState handle and help is make things simple . Thanks much bro. I feel like they should leave this summit thing for you .

[@historicalheros9684]

if lambda function return unit then how did we get new color , i didn't understand that

[@Ilamarea]

The color is a parameter of the lambda defined in ColorBox composable as Color(random, random, random, 1). We get access to that parameter with the word 'it' and pass it to color.value in the lambda body directly. So each time the button is clicked what gets called is 'Color(random, random, random, 1) -> { color.value = it }'

[@mracipayam]

We are calling Unit func in the constructer and it gives us a callback like color or whatever you want. You should look more example.

[@ingamenamech.4605]

how to change integer?

[@C6Silver]

Great video. While Jetpack Compose is certainly a major step up, it's amazing how much better and cleaner SwiftUI is. There was a time when Android was better than Apple in terms of UI creation, but that's in the past. Of course if you haven't used SwiftUI then you won't know what you're missing. 🙂

[@ammarseud5461]

When does a view get recomposed other than on configuration changes?

[@ammarseud5461]

Found out the answer to my own question: _Compose apps transform data into UI by calling composable functions. If your data changes, Compose re-executes these functions with the new data, creating an updated UI-this is called recomposition. Compose also looks at what data is needed by an individual composable so that it only needs to recompose components whose data has changed and skip recomposing those that are not affected._ _As mentioned in Thinking in Compose:_ _Composable functions can execute frequently and in any order, you must not rely on the ordering in which the code is executed, or on how many times this function will be recomposed._

[@samsh4021]

Thank you Philipp

[@shakilsarkar3579]

Thanks a lot for this amazing tutorial. how can i create different ui for portrait and landscape with jetpack compose?

[@PhilippLackner]

you can check in your code what the screen orientation is and then display different composables based on that. Don't have the code in my head right now

[@shakilsarkar3579]

ok thank you. and 1 last question can you make a video on how can i create different layouts for tabs and normal size phones?

[@Kunal-jp8tn]

Thank you so much for this video.

[@ionlytakeaction3773]

love watching these videos. A1 amazing fucking content . Keep it up my guy, definitely checking out the website.

[@alij3fer]

Thanks sir, how can support size different screens wath jetpack compose?

[@PhilippLackner]

You can use a BoxWithConstraints to get the screen measurements and then just do simple if-checks and show different components depending on different screen width. Similar to CSS media queries

[@mohammadnadeem5530]

Best development and SEO

[@dmytromarchuk3023]

Becoming JCompose guru)

[@CybercoderNaj]

You didn't give a flash warning for 7:02. 😫😫😫😫

[@spyro2008]

Thank you a lot!!!

[@AthulExe]

Can you please share how to read a raw text file from project using jetpack compose?

[@kalibra2121]

Bro i didn't get that part where you had to use the same modifier on ColorBox, you said otherwise it's pointless. In rest you used individual Modifier for every element :-?

[@michaelfournarakis8134]

so, android next gen will become the same as React, suppose something like redux comes next..

[@VictorFarkas-fp2gl]

is external state = state hoisting

[@shanmugapandian7770]

I m getting an error whenever I use Box

[@mohammadamirkanjoori138]

Nice

[@mkc0321]

you are awesome

[@funnymoment9164]

Thanks

[@imnithish]

great

[@talhashaikh1435]

Code Didnt Work For me

[@PhilippLackner]

Have you tried fixing it?

[@talhashaikh1435]

@@PhilippLackner I wrote exactly but didnt work ..may be my fault..and one more thing ..R.font in the font tutorial part5 i guess of this series ..font directory is also not working loke R.font.lexend in this "font" comes in red ..why ? i did exactly what you said ..Thanks Phillips

[@donfreecss1803]

@@talhashaikh1435 i passed for that, no font but reading stackowerflow somebody answer this: rename the letter to _ from - then paste to directory and doing that it works

[@donfreecss1803]

@@talhashaikh1435 Change to .background(color.value)

[@mracipayam]

Some changes about remember usage : var color by remember{ mutableStateOf(Color.Yellow)} Thank me later.

[@celesteh2272]

good video, thanks very much. but i can't understand where the "it" comes from😂

[@shalenmathew]

[@Attee_Q]

I made another version, without lambda function: pastebin link: 8XMrhS4B Working of the lambda function is hard to understand (for me).

[@MananGandhi]

First😁😁

[@pradeepkumarreddykondreddy7048]

I could not understand the concept of state clearly

[@PhilippLackner]

in the end, state describes any value that can change over time

[@vidsjust8349]

Compose made harder and complicated to do simple things, not easier like they pretend

[@JujareVinayak]

Pls don't place emulator over the code. Keep it in right right

[@saradhsavyasaj]

doesnt work , he would probably delete this

[@JamesBond-mq7pd]

what doesn't work? just google it bro. insted of val color = mutableStateOf(Color.Yellow) use var color by remember { mutableStateOf(Color.Yellow) } and set value like this color = Color( Random.nextFloat(), Random.nextFloat(), Random.nextFloat(), 1f )

[@amineayachi335]

thanks