How to Create a Navigation Drawer With Jetpack Compose - Android Studio Tutorial

Поділитися
Вставка
  • Опубліковано 25 січ 2025

КОМЕНТАРІ • 65

  • @sergiomendes7727
    @sergiomendes7727 2 роки тому +5

    After 5 years working with XML I start to use compose on my projects.
    Philip you are helping me a lot.

  • @mindfulnessrock
    @mindfulnessrock Рік тому +5

    As for those following along with this vid. There's indeed some edge cases of difference between material 2 and material 3. Most notably the DrawerContent is now somewhat inverted with the Scaffold.
    15:07
    You won't be able to do so, cuz those functions would probably be composable function, and you're calling them directly from an onClickCallback function (which is not a composable function). You can have the current screen id as a state, and hoist that when statement.

  • @nevardreik
    @nevardreik 2 роки тому +8

    Hey Philip, love how you briefly talked about accessibility in this tutorial. One thing we can do with the DrawBody composable to make it more accessible would be to add a `.semantics(mergeDescendants = true) { contentDescription = item.contentDescription }` to the LazyColumn Composable’s modifier. This creates a semantic tree node where the icon and text are merged to make one node. It helps people with screen readers so they don’t need to select the icon and then the menu item label independently.

    • @rollebonmarquis7574
      @rollebonmarquis7574 Рік тому

      One remark though. It seems like if you run the app, they will be read together by default. I don't know why though and idk if this was the case as well when the video was made...

  • @myfavourites6383
    @myfavourites6383 2 роки тому +3

    Bro really are you reading our minds, looking to implement this and you come with a Video

  • @iliachakarov7285
    @iliachakarov7285 2 місяці тому

    Very well made! Thx a ton !!

  • @SiTheMon777
    @SiTheMon777 2 роки тому +1

    Well you just fully answered today's job for me. Thanks Philipp

  • @harthholtz6462
    @harthholtz6462 9 місяців тому +1

    For all those who are wondering why the reproduction of this tutorial may not work properly, just a note. Compose is developing rapidly. In the Material 2 design, the navigation drawer is part of the scaffold. With the transition to Material 3, the navigation drawer has become an independent composable and can be implemented with NavController.

  • @sudhanshudubey8099
    @sudhanshudubey8099 Рік тому +4

    Thank you so much for these lessons!! I learnt a lot from all your videos. Can you please upload tutorials for Material3 design?? A lot of things are different. For example, navigation bar. They also removed rememberScaffoldState..which is confusing me even more :(

  • @programuoki-lt1465
    @programuoki-lt1465 2 роки тому

    Thank you very much, I still feel new in android when Jetpack came out. Need change thinking instead Designer usage "drag and drop" :)

  • @vuduc7563
    @vuduc7563 2 роки тому +1

    Hello. How I can get android studio theme like yours? Thank you!

  • @codelabspro
    @codelabspro 2 роки тому +1

    Thanks for this! You need to be on the latest version of compose 1.2.0 or higher for this to work correctly. Set compileSDK version to 32 or higher

  • @danielaalvarezs5612
    @danielaalvarezs5612 4 місяці тому

    Hello, what version of Android do you use?

  • @kubrix1222
    @kubrix1222 Рік тому

    How do you make the drawer not overlap the top bar when open?

  • @jellybeast4408
    @jellybeast4408 2 роки тому

    just used this in a current project :) tyvm

  • @John-qt6qk
    @John-qt6qk 2 роки тому

    I was waiting for this thanks

  • @guduguminchu
    @guduguminchu Рік тому

    navigationDrawerComposeTheme not found!

  • @ahmedassas5065
    @ahmedassas5065 2 роки тому

    HI PHILIPP :How to make the icons in the status bar black and the status bar white, please help me

  • @TVSanus
    @TVSanus 2 роки тому +1

    Material 3 doesn't have "drawerContent"?

  • @hisokadu06
    @hisokadu06 2 роки тому

    hello Philipp,
    Thx again for all the tutos explanation that is really nice of you.
    I have one issue i show a list of games in my app i tried to implement the nav drawer and it worked the only issue is its behind the search bar and the list of games...
    If anyone or even you got an idea why i would rly appreciate :).

  • @mohdotnet
    @mohdotnet 2 роки тому

    Lovely video than you .
    Could you kindly advise the learning path you took to brilliantly know kotlin and Android studio in the manner that you do

  • @kitarolivier
    @kitarolivier 2 роки тому

    Thank you very much for all your tutorials. It would be nice if you go a little further with explaing how to change the compose and show different composables their viewmodels when switching from Home screen to settings or another page. Thank you.

  • @vanshchaudhary2814
    @vanshchaudhary2814 2 роки тому +1

    What is the setup and theme of your android studio? Care to give info?

  • @roonyshekho8067
    @roonyshekho8067 2 роки тому

    How can I get these font colors?

  • @javimardeveloper
    @javimardeveloper 2 роки тому

    Hi Phillip, can you do a video on Canvas applied to cool shapes such as top bars / nav bars with wavy lines, or something eye catching... Thanks a lot man. Your content is awesome!!!
    BTW, can you update this video for M3? Danke schön!!

  • @CodePursuit
    @CodePursuit 8 місяців тому

    Thanks 🙃

  • @SainsFisic
    @SainsFisic 2 роки тому

    Nice and wonderfull for great lesson.

  • @eliezerbwana2526
    @eliezerbwana2526 2 роки тому

    Hello , thank you for these wonderful videos it's quite helpful

  • @nickgamespt2752
    @nickgamespt2752 7 місяців тому

    i may not be able to follow the guide but at least bro is nice to look at

  • @anuradhakulkarni1368
    @anuradhakulkarni1368 2 роки тому

    Thanks for this!!

  • @John-qt6qk
    @John-qt6qk 2 роки тому

    How to cut the width of the drawer

  • @ka61er
    @ka61er Рік тому +1

    seem like so much changed with material 3 but still easy just read document :v

  • @gulfappdeveloper2849
    @gulfappdeveloper2849 2 роки тому

    Thank you for helping

  • @sidharthkumar1499
    @sidharthkumar1499 2 роки тому

    can anyone help me when I import my project it's always showing loading but not load

  • @calond.o9690
    @calond.o9690 2 роки тому

    Can u make tutorial how to implement forgot password using KMongo?

  • @saravanamurali5168
    @saravanamurali5168 9 місяців тому

    Thanks bro

  • @victorperezcuadros6846
    @victorperezcuadros6846 2 роки тому

    You save me jajaja, thx for this tutorial.

  • @apoorvgupta2511
    @apoorvgupta2511 2 роки тому

    I used Navigation Drawer but after opening the drawers the underlying contents are visible, it means that the drawer is transparent

    • @PhilippLackner
      @PhilippLackner  2 роки тому

      Then give it a background 😂

    • @apoorvgupta2511
      @apoorvgupta2511 2 роки тому

      @@PhilippLackner Ok I'll try that 😅

    • @apoorvgupta2511
      @apoorvgupta2511 2 роки тому

      @@PhilippLackner just giving background is not enough we have give contents of the screen inside scaffold function
      Scaffold (...) {
      /*screen contents*/
      }

  • @tomislavkovacevic1
    @tomislavkovacevic1 Рік тому

    Thanks!

  • @mandroidx1474
    @mandroidx1474 2 роки тому

    Nice 💚💚

  • @Adam0001
    @Adam0001 2 роки тому

    Hello Philipp 👋
    Thank you for this great lesson 👏
    Could you make another lesson about how to design a screen like UA-cam in case watching the video and click on comments section and showing the comments at the same time
    But note, make the design in portrait and landscape mode
    I hope you understood me; cause my english is not good 🙃

  • @erfansn869
    @erfansn869 2 роки тому

    If Apple owners see the video banner, they will definitely have a stroke

  • @hoangtran-ir7lj
    @hoangtran-ir7lj 2 роки тому

    good project

  • @John-qt6qk
    @John-qt6qk 2 роки тому

    What about a bottomsheet vídeo?

  • @rkbgkgmjfm5155
    @rkbgkgmjfm5155 2 роки тому

    thanks for your content tho, it's only useful for university

  • @maskedredstonerproz
    @maskedredstonerproz 2 роки тому

    Already been able to do this by wrapping the NavHost() { } composable in modal drawer(idk if you did that too, at the time of writing the comment I'm at the 13th second of the video), among other things, like having the screens in a list, then call .forEach on the list, and define what each nav item itself is gonna look like(you can probably figure out how I handled the navigating yourself, after all, you are Philipp Lackner)
    But thanks for this

  • @jansprlak110
    @jansprlak110 2 роки тому +1

    Beta tester od roku 2016 oceňujem,,

  • @leas9019
    @leas9019 Рік тому

    thank you and you're beautiful

  • @Nick-cx4rs
    @Nick-cx4rs 2 роки тому +2

    Guys i have advice dont try this with material3 compose ...

  • @safionweb
    @safionweb Рік тому

    Awesome/

  • @vuduc7563
    @vuduc7563 2 роки тому

    Hello. How I can get android studio theme like yours? Thank you!

    • @PhilippLackner
      @PhilippLackner  2 роки тому +1

      it's called Xcode dark

    • @vuduc7563
      @vuduc7563 2 роки тому

      @@PhilippLackner thank you so much!

    • @vuduc7563
      @vuduc7563 2 роки тому

      @@PhilippLackner thank you so much!