Custom layouts and graphics in Compose

Sdílet
Vložit
  • čas přidán 1. 06. 2024
  • Jetpack Compose offers a variety of out-of-the-box solutions to quickly and easily build screens from scratch. But what happens when you need to go a step beyond and go fully custom? Learn how to create complex designs using a powerful combination of custom Compose Layouts and Graphics. We will cover things like laying out a custom graph, Compose drawing operations, and animations through a more hands on approach by building an intricate Sleep Tracker sample app in just 20 minutes.
    Resources:
    Compose Jetlagged → goo.gle/compose-jetlagged
    Custom layouts → goo.gle/compose-custom-layouts
    Images and graphics in Compose → goo.gle/compose-graphics-docs
    Speaker: Simona Stojanovic
    Watch more:
    Watch all the Android Dev Summit sessions → goo.gle/ADS-All
    Watch all the Modern Android Development sessions → goo.gle/ADS-MAD
    Subscribe to Android Developers → goo.gle/AndroidDevs
    #Featured #AndroidDevSummit #JetpackCompose
  • Věda a technologie

Komentáře • 57

  • @Zhuinden
    @Zhuinden Před 3 měsíci +4

    Really good talk, if only all Android talks were like this, direct and straight to the point, informative and powerful. No "agenda" like "you can remove Fragments with Navigation-Compose" despite providing 12% of the feature set, or something.

  • @12Playmobil
    @12Playmobil Před rokem +14

    Thank you for this video, very useful! Personally I am glad to see advanced topics covered in-depth about Compose and not only the introduction and beginner guide videos (which are also useful obviously). Would also appriciate a detailed video about Compose effects with real world scenarios.

  • @mwprogrammer
    @mwprogrammer Před rokem +14

    This is a personal view but feel like this is one of the areas where compose's function-centric way of building layouts shines. I like how building custom layouts feels a bit more systematic and less like you are trying to hack your way into making something look and act the way you want it too. Thank you for the presentation and excited for future development on this.

    • @AndroidDevelopers
      @AndroidDevelopers  Před rokem

      We are thrilled to hear that you are enjoying this feature! We truly love hearing from the community. We appreciate you, Chisomo 🙌

    • @jeepaholic326
      @jeepaholic326 Před rokem

      @@AndroidDevelopers and we Appreciate YOU ALL

  • @anjaxy3732
    @anjaxy3732 Před rokem +1

    Thank you very much! More in-depth videos like this, please!

  • @ruiguo8224
    @ruiguo8224 Před rokem

    Very impressed! Just few lines of code can make this magic!

  • @ashutoshpendse4273
    @ashutoshpendse4273 Před 11 měsíci

    Really a delightful presentation. A non-trivial app development with great explanation along the way!

  • @AlexanderRuskovski
    @AlexanderRuskovski Před rokem +14

    Well presented! Thank you! Really in-depth presentations rolled out last couple of days 🥰🤖

    • @AndroidDevelopers
      @AndroidDevelopers  Před rokem +1

      If you loved this video and want to see more from Android and Simona, take a look and give us a follow via the blog links below 😄
      Android on Medium → goo.gle/3NCyjec
      More from Simona on Medium → goo.gle/3NtlNh1

    • @cifricfranjo
      @cifricfranjo Před rokem

      @@AndroidDevelopers Thanks!

  • @mahmoudraafat
    @mahmoudraafat Před rokem +9

    Thank you for this perfect presentation. 💚

    • @AndroidDevelopers
      @AndroidDevelopers  Před rokem +2

      Thanks, Mahmoud! It's our pleasure to help you customize your creations 🎨
      If you're interested in learning more on the subject, be sure to scope out these resources:
      Custom layouts → goo.gle/compose-custom-layouts
      Images and graphics in Compose → goo.gle/compose-graphics-docs

  • @LightDante
    @LightDante Před 9 měsíci

    I love how they turn such complicated things (for me) into simple explanation

  • @dominikluchinger1504
    @dominikluchinger1504 Před rokem +8

    Very cool and helpful example, thanks

    • @AndroidDevelopers
      @AndroidDevelopers  Před rokem +1

      Thanks Dominik 😎
      We're happy to help you get the most out of your customization experience ⚒️

  • @nipunshah1373
    @nipunshah1373 Před rokem +4

    Completely Rich & Informative Video

    • @AndroidDevelopers
      @AndroidDevelopers  Před rokem

      We are happy to hear that the video was helpful, Nipun! Check out more about Jetpack Compose via this link: goo.gle/3n9Cnqf

  • @jovana.subotic
    @jovana.subotic Před rokem +9

    What an impeccable presentation! Very coherent and engaging

    • @AndroidDevelopers
      @AndroidDevelopers  Před rokem +2

      The Dev Summit was a series of awesome presentations!
      Make sure you check out our other Dev Summit sessions here: goo.gle/ADS-All

  • @McMouse88
    @McMouse88 Před 4 měsíci

    Thanks Simona, much appreciated for this stuff, it's really a good example )

  • @shahidabegumtultul9994
    @shahidabegumtultul9994 Před rokem +2

    Wow! awesome!!! helpful tips.

    • @AndroidDevelopers
      @AndroidDevelopers  Před rokem

      We have a ton of helpful tips here on CZcams for you!
      We recommend jumping over to our MAD skills series to check them out: goo.gle/3hLX8sg

  • @MishaAkopov
    @MishaAkopov Před rokem +6

    Could not you make it even harder? :D Thanks for the presentation

    • @yalcinozer4434
      @yalcinozer4434 Před 4 měsíci +1

      😄 Sometimes they make me to think like you

  • @simonSilverse
    @simonSilverse Před rokem

    Any existing bug bounty program? Last line of code at 09:51 should be 'sleepBarPlaceable.height' instead of 'barPlaceable.height'. I have looked into the source code at github and it appears fine though.

  • @kemel-7000
    @kemel-7000 Před 6 měsíci

    can you please say, how to create that kind of presentation with animation and code appearance? This isn't just a screenshot of AS night mode, right?

  • @sanek1985t
    @sanek1985t Před rokem +3

    Thanks

  • @raianmr2843
    @raianmr2843 Před rokem +2

    What's the online shader tool that she talks about?

  • @chrislagos44
    @chrislagos44 Před rokem

    Why do you repeat creating a paint object for each composable? I remember that in the old view canvas you only created one paint object. Seem like the layout and drawing command are all in the same file!

  • @willymarten5260
    @willymarten5260 Před 6 měsíci +1

    "In just 20 mins" ^^ Right of course

  • @SnoopyDoofie
    @SnoopyDoofie Před rokem +3

    14:32 Fourth line has a bug. The parameter should be "isExpanded" and not "expanded".

  • @johnhammer8668
    @johnhammer8668 Před 9 měsíci

    do we need to send the same modifier object to all the compose functions. In other words should all the children must use the modifier of the parent

  • @0324bence
    @0324bence Před rokem +2

    What is the advantage of using custom layouts? This layout could have been achieved by using simple columns and rows.

    • @negaaa5080
      @negaaa5080 Před rokem

      I have the same doubt

    • @seksky333
      @seksky333 Před rokem

      It works for most of the common scenarios. However, they don't handle the alignment wells in some edge cases. Then you could do some simple maths in the custom layout with your own logic to control where to place all of the children elements.

  • @DodiSdSdDodi-qs2qd
    @DodiSdSdDodi-qs2qd Před rokem

    Sarana hiburan komplit berada di Android, seberapa jauh pengetahuan yang dimiliki bisa diukur dikedalamannya, memori yang terpendam kilas balik bisa diungkap dan dinikmati lagi kenangan lama biasanya sangat kental diingat

  • @motorolacitrus
    @motorolacitrus Před rokem +1

    YAY

  • @coderbhai3701
    @coderbhai3701 Před rokem +2

    😍🎊👌⚡

  • @SiamakAshrafi
    @SiamakAshrafi Před rokem +1

    Great talk. Lots of dense content ... So we need to send you some money as we are now using this in our sleep tacking App ...

  • @seguramlk
    @seguramlk Před měsícem +1

    I've said that, time and time again. Android Team, CREATE A 1st PARTY CHART LIB

  • @VictorFarkas-fp2gl
    @VictorFarkas-fp2gl Před rokem

    what about a tutorial drawImageBitMap

  • @devgabriel6898
    @devgabriel6898 Před rokem

    Amazing video.. But this is very hard to follow and implement.

  • @domonk7450
    @domonk7450 Před rokem +1

    Not going to lie the completed app screen itself is hard to interpret for me

  • @AmitGupta-sf7oe
    @AmitGupta-sf7oe Před rokem +3

    Only Google Engineers would be able to understand such complexity. Yikes!

  • @dleonardo3238
    @dleonardo3238 Před 2 měsíci +1

    I'm loving compose but I'm just so bad at Ui😂

  • @brunokongawi7555
    @brunokongawi7555 Před rokem

    Is it me or the code for laying out components seem a bit verbose or boilerplate-y?

    • @ErnieZee
      @ErnieZee Před rokem

      what do you mean?

    • @brunokongawi7555
      @brunokongawi7555 Před rokem

      @@ErnieZee For context, I use Contour (from CashApp) quite extensively. Achieving the same results in terms of layout would be much more concise in my opinion.

    • @ErnieZee
      @ErnieZee Před rokem

      @@brunokongawi7555 what do you mean by more concise like give me a concrete explanation what exact lines you consider too verbose in this video.

  • @kristiyangerasimov6708
    @kristiyangerasimov6708 Před 4 měsíci

    What's with the emojis on top of the presentation? Looks like a facebook message group haha

  • @DodiSdSdDodi-qs2qd
    @DodiSdSdDodi-qs2qd Před rokem

    Teluduri sejarah peradaban manusia dari jaman serba tradisional sampai saat sekarang modernisasi disegala bidang

  • @D4rK7355608
    @D4rK7355608 Před rokem

    Hmmm, why you guys used Apple emojis? 🤔 (Idk why I paid attention to then) XD

    •  Před rokem +1

      Those are not Apple emojis.

    • @orvillelawrence
      @orvillelawrence Před rokem +1

      @ emerald card

  • @radu2173
    @radu2173 Před rokem +1

    Kinda too easy

  • @jansprlak110
    @jansprlak110 Před rokem +1

    Beta tester od roku 2016 oceňujem,,