Clojurians Log v2
membrane
@smith.adriane Got furniture inventory working in about 45m — half the time was modifying the simulator, half was rendering it in membrane. So great!!! https://capture.dropbox.com/NlfuIwVUpN5AuDVQ
Oh, the best part! The number slider as a scrubber! https://capture.dropbox.com/wbNYMpqdTmmzePHm
@smith.adriane this code fails to compile:
(defui test-defui
[{:keys [mpos]}]
(ui/on
:mouse-move
(fn [mpos]
[[::set-mouse-pos $mpos mpos]])
(ui/label "Hello mouse!")))Unable to resolve symbol: $mpos in this context. I can work around it by renaming mpos in the fn to something else. Is this expected behaviour?
Yes, that is expected. $mpos is the reference for the current lexical value of mpos.
I can see how it might be convenient for your example to have $mpos refer to the mpos from the outer lexical scope, but I think maintaining that $sym is always the reference for the current lexical value of sym is important for reasoning about more complicated cases.
(defui test-defui
[{:keys [other-mpos]}]
(ui/on
:mouse-move
(fn [_]
(let [mpos other-mpos]
[[::set-mouse-pos $mpos mpos]]))
(ui/label "Hello mouse!")))
(ui/mouse-move (test-defui {:other-mpos 42}) [ 0 0])
;; ([:ui.membrane-ui/set-mouse-pos [(keypath :other-mpos) []] 42])Added this idea here, https://github.com/phronmophobic/membrane/discussions/66
Ok good to know it is expected 🙂
I'm open to changes if there are good reasons, but that's the current rationale.
Or maybe figuring out how to add warnings or better error messages.
I think a warning would be nice if possible. It took me some time figuring out what was going wrong. And I don’t have a strong opinion yet on whether the current way is good or could be better.
I’m also trying to get contextual state working. I’ve made the following toy example:
(def the-state (atom {:scale 1.0
:subs [{:x 0
:y 0
:text "hello"}
{:x 10
:y 10
:text "world"}]}))
(defui sub-component
[{:keys [x y text]}]
(ui/translate x y
(ui/label (str text))))
(defeffect ::scale
[$scale factor]
(dispatch! :update $scale #(* % factor)))
(defui main-component
[{:keys [^:membrane.component/contextual scale subs]}]
(ui/on-key-press
(fn [k]
(case k
"+"
[[::scale $scale 1.01]]
"-"
[[::scale $scale 0.99]]
[]))
(apply ui/scale scale scale
(for [sub subs]
(sub-component sub)))))
(skia/run (component/make-app #'main-component the-state) {:include-container-info true})scale value to propagate to all sub-components. However, with the ^:membrane.component/contextual meta information the app no longer works. How is this supposed to work?contextual state lives under the :membrane.component/context key of the app state.
(defui sub-component
[{:keys [x y text
^:membrane.component/contextual scale]}]
(ui/on
:mouse-down
(fn [_]
[[:set $scale 3.0]])
(ui/translate x y
(ui/label (str text "-" scale)))))
(defeffect ::scale
[$scale factor]
(dispatch! :update $scale #(* % factor)))
(defui main-component
[{:keys [^:membrane.component/contextual scale
subs]}]
(ui/on-key-press
(fn [k]
(case k
"+"
[[::scale $scale 1.01]]
"-"
[[::scale $scale 0.99]]
[]))
(apply ui/scale scale scale
(for [sub subs]
(sub-component sub)))))
(skia/run (make-app #'main-component the-state) {:include-container-info true})If you want it to live somewhere else, there are options, but it might depend on what you're trying to do.
Storing it under :membrane.component/context is fine, this works great, thanks!
Not urgent — I need to figure out how to get the heights of each room smaller, so I can crank up the density of rooms — is there an easy way I can tighten up the line spacing between the 3x “work remaining” lines? https://github.com/realgenekim/simulator-couch-paint/blob/6c9b6a9833f50f81622e426bb13d9412fefbc23f/src/ui/membrane_ui.clj#L276 Thank you! Another super fun couple of hours making great progress on my app!
Trying :height…. Can you feed in height of < 1.0? Nothing seems to work when I try that.. Hmm… no value I try seems to make a difference… https://github.com/realgenekim/simulator-couch-paint/blob/8ed0afb2f362a9702cf1a1eef5176a0e08507834/src/ui/membrane_ui.clj#L275
Wait a second.. I think it worked. Just didn’t update!
Never mind — it works! 🎉
I was doing the same thing.
Just setting the line :height to 1 seems to tighten everything. For whatever reason, adding emoji adjusts the default :height to something greater than 1.
That might also fix the couch error from earlier
Another gotcha here is that defui components use caching. That means if you update a function that component relies on, it won't re-evaluate the component unless it gets a new value to render. You can force the component to re-evaluate to by re-evaluating any defui component.
Baffled by this one — recording (this time in 4K, is that better?) font-size isn’t being picked up by component. Caching? Okay, let me try that. But, color changes, but not font size? https://capture.dropbox.com/HQelqbh1xxyglXTg (Gimme 30s. will check into repo.)
I bet if you make changes and then re-evaluate any defui component, that it will update everything.
Hmm. I’m reloading entire namespace everytime, which should re-eval all defui, yes?
yea
DOH! Big typo on my part. I think I found it.
oh, right. I think :font-size should be part of the style map.
Yes. Sorry about that!!! Okay, that’s a wrap for today! Wooot! Thx again!