19 - SCAFFOLD - Jetpack Compose - Android Studio

hey guys and welcome back I'm Monson and in this video I want to talk about a scaffold a great feature of Jetpack compost let's see what is a scaffold [Music] a scaffold is like a main layout that's like this that can hold different features inside it different widgets and element I mean and it can locate each of them in the great position for that widget for example if you have a top wrap bar it can be inside the scaffold and the scaffold will be located on the top of the screen then the rest of the materials just like bottom navigation and the main content of the application Floating Action button drawer menu and also in the content we can have for example a column and inside the column an image a text and button and as you can see all of them are located inside the scaffold and each of them or in the best position for them now let's see how we can work with the scaffolding Android Studio here I have an empty project and I have added a scaffold inside this composable function we need these two annotations because the scaffold is using experimental material 3 API and all the time this API is changing so we need to add this annotation in order to make our application compatible within exchanges and as you can see here inside this scaffold we can have a modifier top or bottom snack bar hose Floating Action button the position of it and Etc today I'm going to show you briefly some of them and in the next videos we will create each of them uh like with all of the features that they have and you will customize them and Etc okay let's hear at the top bar and as you can see the top part is the composable function so inside it we can have the top app bar and as the title of it I'm going to add a text then Bottom bar around here inside it you can have a bottom up bar and inside it the text then let's have a floating action button foreign action button we can have icon and in this case I'm going to choose the ad then here a string value it can be anything and that's it for the uh here between parenthesis and as the content that will be located between the brackets I'm going to add the column a modifier the padding and this padding can be equal to this content padding variable then inside it we can have a text for example and to represent the main content of the application okay that's it let's check it on the emulator okay here we have the floating action button the Bottom bar top bar and the content uh accept it just like that and in the next videos I am going to show you how to create each of them and how to customize them and we will create this great layout together okay that was everything about the scaffold if you like this video please give me a thumbs up and if you haven't subscribed to the Channel please do it right now and in case of any question any suggestion any comment write them for me and I will be so happy to read them and answer them thank you very much bye

Channel: MkrDeveloper

Views: 3,736

Keywords: SCAFFOLD - jetpack compose Android studio | Kotlin, SCAFFOLD - Jetpack Compose - Android studio, SCAFFOLD jetpack tutorial, SCAFFOLD in jetpack compose android studio, SCAFFOLD in jetpack compose, jetpack compose SCAFFOLD, android jetpack compose SCAFFOLD, scaffold jetpack compose, SCAFFOLD in compose, Mkr Developer, mohsen mashkour, Jetpack compose mohsen mashkour, kotlin, jetpack compose tutorial, android jetpack compose, Jetpack compose, android development, top app bar

Id: Fv46Q0IeUc4

Length: 5min 56sec (356 seconds)

Published: Tue Aug 08 2023