I'd like to get started with Compose for Desktop s...
# compose-desktop
s
I'd like to get started with Compose for Desktop seriously, but I'm frustrated by the lack of more complex components / widgets, like tables with sorting / filtering, collapsible trees, etc. I guess that's due to Compose's roots in Android / mobile, where such components would not make sense due to screen size. While I'm aware of projects like https://github.com/JetBrains/jewel, I wonder whether there are any efforts to combine the Compose compiler with some existing desktop-ready components, like JavaFX. Getting rid of FXML in favor of the Compose compiler plus some DSL as a successor to TornadoFX(2) would be just awesome!
c
s
Yes, but its releases come too rarely, and it all looks too much like MS Office ribbon for my taste...
c
I doubt we’ll see something like a Composeable DSL for building JavaFX/TornadoFX UIs. Compose Desktop has Swing interop, but it still just inserts those Swing components into the normal Compose Skia layers, rather than natively building a fully-Swing UI. I definitely agree that the Material components feel too large and clumsy for most desktop apps or IntelliJ plugin UIs (which is how I’m using it, currently). Aurora is quite flexible and you don’t need to develop use the Ribbon-like UI layouts. You could create a custom theme and build your own layouts with Aurora components like buttons/dropdowns/etc.
s
FWIW we do have trees in Jewel 🙂
And we will eventually get tables
It's just it's mostly a one man show right now so things take time
😂 3
❤️ 2
s
s
We have - @HIGAN has helped out a bit earlier this year, but it's mostly me working on it these past few months
💪🏻 1
💪 2
💪🏾 2
k
Aurora (author here) will provide a fully featured ribbon component in the upcoming release 2.0 (probably a month or so away). But it also has a selection of what I’d call the “common” components such as buttons, comboboxes, checkboxes, switches, text fields, progress bars, etc that can be skinned using one of the bundled skins, or using a custom skin provided by the app. Not going to comment on how frequent the releases are. The main focus of release 2.0 is to get the ribbon out the door, and it’s a lot of functionality in there, so it is indeed taking some time.
As for the table, I commented over here on what a fully featured table would need to provide in terms of matching the feature set to what is found in other toolkits. Absolutely no plans to provide this in Aurora, since doing all of that is a multi-year full time effort.
v
It is a little worrying that there's no real table component from Google, Jetbrains or a third party after, what, two or three years? They are pretty much fundamental to any business focused desktop app. They might be hard, but surely they are important?
plus green 1
m
I don't know how elaborate you're looking for, but https://github.com/oleksandrbalan/lazytable supports desktop (as well as Android and iOS).
K 1
🔥 1
neat 1
💯 1
k
That would be the “barebones” layout structure, on top of which you’d have all those interlocking features of a desktop-grade grid table.
s
Yes, there are a ton of such simple tables. While I'm not interested in all the fancy features mentioned by @Kirill Grouchnikov, IMO sorting and filtering is a must have.
s
In a compose world, sorting and filtering is done by the data layer not the component
k
Any particular app or usecase might not need all those features, but in aggregate they do
s
It'd horrendously bad perf wise to have that happen during recomposition
c
I’d argue that with Compose it’s probably easier and better to just model the sort/filter behavior yourself in the ViewModel, so a barebones table layout is probably better. “Enterprise datatables” with all that stuff built in are useful when there’s not such a clear transformation from data to UI, like in most legacy UI frameworks
s
But the component needs UI elements for filtering and sorting that the user can interact with.
c
I’m actually very excited to see that library @Mark Murphy, and the 2D “canvas” library it’s built with. i’ve been wanting to find exactly that kind of widget for quite a while now
👍🏻 1
k
http://www.jidesoft.com/products/grids.htm (not super actively developed anymore) is a good example of the functionality complexity of a desktop grid
c
That table library works very nice! I threw together a basic storefront with lots of complicated filtering/sorting behavior using my Ballast MVI library, and it came together quite nicely! I can definitely see myself continuing to use this library for other projects. Source
🙌🏻 1
m
@Sebastian Schuberth I've looked at the possibility a bit in the past. You don't need the compose compiler to get 90% of the way there, just forking JavaFX and adding read recording to the properties library. So then you can set a thread local when you enter/leave a lambda and record what the properties it reads. If any of those properties change, re-run the lambda and recompute the result (which is itself a property of course).
That works OK for computations, where it works less well is building your entire UI if you want to use the Compose/React paradigm for that. But then you lose Scene Builder and such. To do that you'd need to do the same thing but implement reconciliation and animation of the new scene graph vs the existing attached graph.
s
Loosing scene builder doesn't sound all that bad... is there some code for your experiments somewhere @mikehearn?
m
Poor old Scene Builder. Guess I'm the only one who likes it. It was quite some years ago and I never did anything with Compose, just the read-tracking properties for computation, but that's very easy to duplicate. The trick is to be willing to fork the code. Fortunately JavaFX is very easy to compile so that's not a problem.
Because the properties system is so consistent it'd probably not be hard to wire up compose compiler to JavaFX. I would look at the experiments by Jake Wharton if you want to try. It's not documented how to do it but he has some demos on GitHub where he uses Compose Compiler to write a TUI toolkit.
s
Yeah, I had been thinking about using https://github.com/JakeWharton/mosaic https://github.com/cashapp/redwood with JavaFX before...
v
Are there any specific build or deployment instructions for Jewel?
s
I need to update the readme 😅 but it's a rather standard Gradle setup for building, and there are binaries available on https://packages.jetbrains.team/maven/p/kpm/public/ (specifically these: https://packages.jetbrains.team/maven/p/kpm/public/org/jetbrains/jewel/)
👍 1
👍🏻 1
v
Jewel looks something I could use instead of material3. Luckily I haven't built much of an app yet. At first glance, the only component I'm missing is circular progress indicators. Other thoughts - no scrollbar on text areas, the API is a bit inconsistent across components. And
MenuBar
crashes the app. But it's a start.
s
Circular progress indicators are coming
99% will be on the main branch by this week
👍 1
🚀 3
👍🏾 1
m
@seb you should distribute the jewel sampler app with conveyor!
s
@mikehearn we're waaaay too early to think about that 😄 For now, gradlew run works fine
v
I tried to integrate Jewel with my existing app, replacing material3. The gradle run command just... Sat there. No window opened, no errors appeared. I'll report back and raise a ticket if I can find out more.
s
Yes, please do! Check if you have any exceptions in the stdout. I hate to say this, but we have no such issue on our machines, so any details you can provide would be helpful
v
What is the
jewel
gradle plugin, do I need it, and where can I get it?
s
It's a configuration plugin for the jewel codebase. You don't need it. The sources are in buildSrc
v
I wonder if my attempt to convert the desktop JVM part of a multiplatform project is doomed to failure... Exception in thread "main" java.lang.UnsatisfiedLinkError: 'void org.jetbrains.skia.CanvasKt._nTranslate(long, float, float)'
s
Jewel depends on Compose Desktop, it won't work in a KMP project
We may port it to be Multiplatform at some point but right now it's not a priority
We have a lot of dependencies on the JVM and desktop APIs, so it's not easy. The primary goal of Jewel is to allow for desktop apps and IDE plugins, so Multiplatform is not a primary concern for 1.0
v
I know it wouldn't work in the android or other parts of KMP, but I had assumed it would work in desktopApp/jvmMain. I'll need to make a decision on my own priority then - KMP to do android and windows desktop with the horrid material3 theming 😀, or purely desktop app with Jewel.
s
Honestly, I don't have enough experience on KMP to even understand what's not working. I'd also expect it to work in jvmMain tbh
v
I do appreciate the time you've taken to reply to my queries, thank you.
s
No worries! Sorry I wasn't very helpful in the end 😅 if you do figure out what's blowing up, let me know!
v
I'll try to create a blank desktop app using Jewel. If that works, I'll stick to that plan. But otherwise I'll go back to KMP and material3.
👍 1
s
🤞
v
Compiled and running. Very difficult to override the default colours? I'd have to recreate pretty much all of
IntUiTheme
I think? I can pick at it - not too hard to override the
IntUiGlobalColors
object to change outlines and focus colours, but something like
ButtonStyle
isn't part of the
IntUiThemeDefinition
class that I can see.
k
Isn’t it supposed to be driven by a key-value property file that defines all the theme settings like colors, paddings, etc?
yes black 1
v
https://github.com/JetBrains/jewel/blob/main/themes/int-ui/int-ui-standalone/src/m[…]ins/jewel/themes/intui/standalone/styling/IntUiButtonStyling.kt - this is where the button colours are defined, pretty deep and not how material3 does it with a theme.kt file.
s
@Kirill Grouchnikov the LaF bridge, yes — the standalone theme doesn't have that ability since it's not running in the IDE. It relies on hardcoded defaults and your ability to override them (for as tedious as it may be)
@v79 that's a byproduct of the JetBrains design systems not having "semantic" colours. There is a palette and then a big 🤷 on what those values are used for
Darcula doesn't even have a real palette to begin with, it's only been formalised in Int UI