What about a desktop app?

As Android devs, we don't generally do desktop development. They might do some scripting, but as soon as you need a user interface and want to use Kotlin in your desktop app, things get quite desperate. Swing is an old tech that’s impervious to newcomers and full of gotchas; JavaFx and TornadoFX aren’t much better; and using frameworks like Qt from Kotlin is going to take a toll on your mental wellbeing.

Or at least, this used to be the case!

We’ll see how, with Compose for Desktop, you can take much of your existing UI skill set from Jetpack Compose and apply it to create tools that run on desktop computers. There are some gotchas and some differences to be aware of, and this talk will cover them pointing out what is and isn’t there yet in Compose for Desktop.

----

More info on the talk, and a list of all the links, can be found at: https://go.sebastiano.dev/desktop-app-2021

Transcript

1. A guide to Compose on desktop
   for the curious Android dev
   Sebastiano Poggi
   What about...
   a desktop app?
   @seebrock3r
   

   View Slide

2. Setting expectations
   

   View Slide

3. Different mindset
   Desktop-only APIs may differ
   Same idea
   

   View Slide

4. Different mindset
   Desktop-only APIs may differ
   Same idea
   

   View Slide

5. Notable differences
   • Lifecycle is much easier
   • Window chrome, menu bars, tray icons
   • Less restrictions
   • E.g., full filesystem access, no permissions system
   • Some things require "going down"
   • Swing and/or P/Invoke via JNI
   

   View Slide

6. https://www.jetbrains.com/toolbox-app/
   https://github.com/theapache64/stackzy
   

   View Slide

7. it's beta
   Some stuff may be missing or broken
   Builds upon Jetpack Compose stable
   

   View Slide

8. Getting started
   

   View Slide

9. GOTO:
   https:!"github.com/JetBrains/compose-jb/
   Compose for Desktop sources repo
   

   View Slide

10. Hold on!
    Only one link to write down:
    https:!"go.sebastiano.dev/desktop-app-2021
    Look out for the symbol
    

    View Slide

11. IDE support
    • Compose Multiplatform plugin
    • Also supports web
    • Android Studio and IntelliJ IDEA
    • Tooling is lagging behind Jetpack Compose's
    • No interactive preview and animation inspector
    • Missing many quality-of-life tweaks
    

    View Slide

12. Familiar faces
    • Core Compose libraries:
    runtime foundation ui material
    • Same packages and API names as Jetpack Compose
    • Compose compiler plugin
    • Requires Kotlin (duh)
    

    View Slide

13. What's different
    

    View Slide

14. Android-only APIs • No access to anything outside:
    • androidx.compose.*
    • java.*
    • kotlin.*
    • No permissions
    • No Android-only dependencies
    • Architecture Components
    • Other Jetpack libraries
    • Firebase
    • etc
    What's different
    Old-school UI
    Resources
    a11y
    UI testing
    

    View Slide

15. What's different
    • No Android Views
    • MapView, etc
    • No WebView equivalent
    • Interop with "classic" Java UI
    • Swing hosts Compose
    • Compose can wrap Swing
    • No activities and fragments
    • Different (easier) lifecycle
    • Swing windows
    Android-only APIs
    Old-school UI
    Resources
    a11y
    UI testing
    

    View Slide

16. What's different
    • Java resources system
    • No buckets
    • No concept of configuration
    • No orientation, display size, etc
    • I18n support is not built in
    • No RTL support yet
    • No animated GIFs
    • No animated vector drawables
    • Non-animated are supported
    • Resource refs not resolved
    • Lottie not supported yet
    • Maybe Skottie in the future?
    Android-only APIs
    Old-school UI
    Resources
    a11y
    UI testing
    

    View Slide

17. What's different
    • APIs are there, but not hooked up
    • semantics()
    • Work in progress
    • Should be there for 1.0.0
    • Current state:
    • Mostly works on macOS
    • Other OSes done next
    • No clue about ETAs, sorry
    Android-only APIs
    Old-school UI
    Resources
    a11y
    UI testing
    

    View Slide

18. What's different
    • Not entirely true, it's mostly the same
    • UI testing is the same as on Android
    • Except, of course, (much) faster
    • Use createComposeRule()
    • Additional API (e.g., mouse scroll)
    • Fun idea: run your UI tests on CfD
    • Screenshot testing is different
    • TestComposeWindow
    • WIP: APIs for animations
    Android-only APIs
    Old-school UI
    Resources
    a11y
    UI testing
    

    View Slide

19. Unique features
    

    View Slide

20. Unique features
    • Desktop is different from mobile
    • Unique needs == unique features
    • Windowing
    • Multiple windows at the same time
    • Compose handles JFrames for you
    

    View Slide

21. Unique features
    • Enhanced keyboard support
    • Keyboard shortcuts
    • Tooltips
    • Menus, tray icons, desktop notifications
    • Native installers (msi/exe, dmg/pkg, deb/rpm)
    • Output size saving tips
    • Notarization for macOS
    

    View Slide

22. Unique features
    • Scrollbars
    • Yes, Jetpack Compose still doesn't have those
    • Works with scroll modifiers and LazyColumn/LazyRow
    • Mouse events
    • Pointer movement (hover)
    • Modifier keys and mouse buttons
    

    View Slide

23. Unique features
    • Desktop-only components & integrations
    • Split panel
    • Video player
    • CEF-based WebView (outdated)
    • LWJGL integration
    

    View Slide

24. Unique features
    • Desktop-only components & integrations
    • Split panel
    • Video player
    • CEF-based WebView (outdated)
    • LWJGL integration
    EXPERIMENTAL
    

    View Slide

25. Libraries
    

    View Slide

26. Libraries
    • A lot of JVM-only libraries out there
    • Some direct replacements
    • Some Android libs make no sense on desktop
    • Well, most don't
    • Some Accompanist libs work on desktop
    • Pager, Placeholder, FlowLayout, Swipe-to-Refresh (?)
    

    View Slide

27. Libraries
    • No Play Services
    • No Firebase
    • Java or REST APIs for some
    • No Architecture Components
    • No ViewModel, Navigation, Room, Hilt, etc
    

    View Slide

28. Library alternatives
    Navigation Decompose
    Room SqlDelight
    Hilt Dagger
    Timber Arbor
    Coil/Glide/Picasso/... Hand-rolled !
    ViewModel Essenty's InstanceKeeper
    (but it's not really the same)
    

    View Slide

29. Theming
    

    View Slide

30. Theming
    • Material theme is fully supported
    • Material You will, as well
    • Material is not great on desktop
    • Huge touch targets for use with mouse
    • There is no "official" desktop-oriented UI framework
    

    View Slide

31. Kirill
    Aurora
    Grouchnikov's
    

    View Slide

32. Distribute your app
    

    View Slide

33. Distribute your app
    • Gradle tasks to build installers
    • OS-specific outputs
    • macOS is different
    • Requires notarisation
    • Signing to make Gatekeeper happy
    • Only required to distribute, not to run locally
    

    View Slide

34. Life outside app stores
    • No Play Store, Amazon Appstore, Samsung App Gallery
    • No auto-updates, built-in licensing and IAB
    • Some Java libs may help to compensate (e.g., update4j)
    • You may be able to publish on OS stores...
    • But mileage may vary
    • May be harder on macOS App Store
    

    View Slide

35. Closing remarks
    

    View Slide

36. Closing remarks
    • Kotlin Multiplatform support
    • Share business logic
    • Share some degree of UI code (Android and Desktop)
    • Web is totally different, hard to share
    • Check out Jake Wharton's Mosaic
    

    View Slide

37. Go and try it out!
    Report bugs
    File feature requests
    Have fun!
    

    View Slide

38. Go and try it out!
    Report bugs
    File feature requests
    Have fun!
    

    View Slide

39. ...questions?
    https:!"go.sebastiano.dev/desktop-app-2021
    

    View Slide