Clojurians Log v2

yay, it works, charts have now labels

The bindings are manually written. It wasn't too much trouble to set the font manager, https://github.com/phronmophobic/membrane/commit/50434e1e7fd563aed207ac55371da06e5c38df59. The change seemed to fix things locally. I'll try to make a release later today. Thanks for tracking down the cause! The font manager for skia used to be handled implicitly. I assume the font manager became a required parameter when skia no longer automatically provided a font manager.

Sweet, that's a quick turnaround! 🎉 When I tried to build skia locally last time, it failed to fetch some dependencies, so I will wait for the build to confirm on my side, but no rush.

Rebuilding now...

Ok, it should be fixed in skialib "0.17-beta"

There are lots of examples for scrolling. Unfortunately, there's not much documentation. There's a lot of flexibility for how and when to do layout. Can you provide a bit more context for what you're trying to achieve? I think I could give a better answer with a bit more context.

I am hacking on a work in progress data visualization library. I have some example charts. I can get them to scroll if I hard code the size: https://github.com/dundalek/clj-compost/blob/c7140adaea7faa61f28b0c28401fdca8b0d3e8f8/examples/membrane/src/examples/membrane.clj#L113 Which looks like:

I would like the scrollable area to fill all remaining space of the window and therefore the scrollbar to stick to the edge.

You'll want to want to set the :include-container-info key to true when calling skia/run. That will pass the container size to the top level component, app. You can then fetch the container size from the context like:

(let [[cw ch :as size] (:membrane.stretch/container-size context)]
  ...)

I haven't tested this code, but it could look something like:

(defui sidebar [_]
  (ui/label "Sidebar placeholder"))

(defui chart-examples [{:keys [width height]}]
  (let [body (apply ui/vertical-layout
                    (->> examples
                         (mapcat (fn [[label viz]]
                                   [(ui/label label)
                                    (compost-svg {:viz viz
                                                  :width 600
                                                  :height 300})]))))
        body (if container-size
               (basic/scrollview
                {:body body
                 :$body nil
                 :scroll-bounds [width height]})
               body)]
    body))

(defui app [_]
  (let [[cw ch] (:membrane.stretch/container-size context)
        sidebar-view (sidebar {})
        [sw sh] (ui/bounds sidebar-view)

        chart-width (- cw sw)
        chart-height (- ch sh)]
    (ui/horizontal-layout
     sidebar-view
     (chart-examples {:width chart-width
                      :height chart-height}))))

In general, I don't really like scrollviews. They have their place (eg. tableviews), but imo they are way overused. I have noticed that the first question I get from folks trying membrane is something related to scrollviews 🤷 .

You can do the scrollview here, but I might suggest aspect filling the remaining space with the chart rather than using a scrollview.

I think there's still a lot of room for improvement for supporting space filling UIs in membrane. It's a multi level problem though. I think some of the improvement will be better documentation, some improvements will be better layout components in the standard library, some improvements will be better techniques, and some improvements will be for various tools.

I guess people me included are set a bit in the web way, it is hard to break old habits.

Horizontally I can fill it, vertically I think the scroll is suitable here because it is a showcase of multiple charts.

There's a lot of flexibility for how to do layout since layout isn't coupled to a main thread. I still haven't quite figured out what the best practices should be.

I haven't had any performance issues, but I like the idea of making it easy to push layout work to compile time.

In the example I included a placeholder sidebar component, how can I measure its width so that I can subtract it from the window container size?

It's in the example code above.

(defui app [_]
  (let [[cw ch] (:membrane.stretch/container-size context)
        sidebar-view (sidebar {})
        [sw sh] (ui/bounds sidebar-view)

        chart-width (- cw sw)
        chart-height (- ch sh)]
    (ui/horizontal-layout
     sidebar-view
     (chart-examples {:width chart-width
                      :height chart-height}))))

You can just call ui/bounds on any view (on any thread).

there's also ui/width and ui/height.

sorry, I overlooked that

no problem. I'm also realizing I subtracted the sidebar height in the example, which is wrong.

great, I also copied subtracting 7 pixel offset for scrollbar from Easel's component picker and it looks as expected now. Thanks for the help 🙏

Yea, I need to fix that too. 🤦‍♂️