Fork me on GitHub
Slack Archive

This page is not created by, affiliated with, or supported by Slack Technologies, Inc.

2023-08-25

Channels

#matrix
<
2023-08-25
>
Bhougland20:08:37

I feel so dumb; I was playing with the counter app and put my name in the title then saved the file. I don't see how to get the hot reload working. This is what I see still (note the title text in the code)

👀 1
kennytilton22:08:03

Sorry, I missed this. Which intro were you following? How do you start the app?

kennytilton22:08:22

btw, hot reload happens when we save. My IDE is IntelliJ, it also saves automatically if I switch to a different app. What IDE are you using? Next, keep an eye on the terminal where you launched the app. You should see messages about reloading a second after you save.

kennytilton23:08:56

Found something...brb.

kennytilton23:08:35

Okay, the problem may be that I have confused things by doing a second version of the counter app counter_app.cljc and called it counter_app_flutter.cljd. I suspect you are editing that version, counter_app_flutter.cljd , but the flutter-mx repo comes set up to run counter_app.cljc. When we save, we do get recompile messages, but it is still running the other version, so we see no changes. To play with the *_flutter.cljd version, hack the main.cljd/main function to have this: 

(fx/run-fx-app
      (counter-flutter/make-app))
Or just start playing with counter_app.cljc. (That cljc is just an experiment I did to see if it worked. It did. 🙂 But .cljd is recommended. Sorry for throwing you off. I should hide that second version in the examples directory.

kennytilton00:08:35

I just pushed to https://github.com/kennytilton/flutter-mx . This version moves the second counter example under the examples (so it will not be where it was if you pull!). I think most folks would trip up on that. Sorry again for your trouble.

Bhougland01:08:29

Hi Kenny, this worked like a charm! I really appreciate the feedback. Sorry for my delay, I didn't have a chance to test it out again until this evening.

🎉 2
kennytilton06:08:37

np! Sorry again for the confusion. Let me know if you get stuck on anything else, I'll be happy to help.

Bhougland11:08:37

I was reading through the documentation, haven’t dived into the code, and you mention that the gui is the application state. Would an example of this be the map below the scaffold section?

kennytilton12:08:37

Yes, this second map under scaffold is where I chose to hang the state: 

{:name    :scaffo
 :counter (cI 0)}
The :counter prop is the state, and we will use the :name property to look up that state from the handler that changes it and the label that displays it. This choice changes as the app becomes more elaborate. In this example, we have two counters under the scaffold, so we need to be a bit more careful about where we hang our state (the scaffold is too global, if you will): https://github.com/kennytilton/flutter-mx/blob/main/examples/example/eg/x02_two_counters_ala_matrix.cljd

kennytilton13:08:19

Follow-up thought. If it helps, deciding where to hang data feels a lot like DB schema design. The visual structure, more or less a tree, entails a natural context or scope. We can leverage that in thinking about our data. So in the two-counter example, the state moved off the scaffold to the repeating counter structure. I imagine it started on the column, then I discovered Flutter needed an expanded widget for layout reasons, but I left the state on the column. With Flutter, we are always jugging these little wrappers, so no point in chasing which is the root. Column certainly seems more stable than expanded, is my thinking.

Bhougland13:08:43

I will take a look at this later. Btw, do you know if there is a somewhere I could view your talk with the Hoplon team?

kennytilton14:08:51

I think I have it somewhere. It was a little rough so we decided not to share. Lemme look.

kennytilton14:08:11

Found it. Uploading now. As I said, it is pretty rough. There was a struggle during the early part with the recording software. No surprise there. 🙂 In the meantime, have you seen this? https://www.youtube.com/watch?v=OkotzUNKkUE&amp;t=185s

kennytilton14:08:11

This should get you to https://drive.google.com/file/d/1dKKWb6kPEtoS7yaGBhSWnHdGyFM3WL2o/view?usp=sharing. I had to download sth called VLC Media player to play it. Have not found a way to convert it to sth friendlier. Hth!

kennytilton12:08:37

Yes, this second map under scaffold is where I chose to hang the state: 

{:name    :scaffo
 :counter (cI 0)}
The :counter prop is the state, and we will use the :name property to look up that state from the handler that changes it and the label that displays it. This choice changes as the app becomes more elaborate. In this example, we have two counters under the scaffold, so we need to be a bit more careful about where we hang our state (the scaffold is too global, if you will): https://github.com/kennytilton/flutter-mx/blob/main/examples/example/eg/x02_two_counters_ala_matrix.cljd

kennytilton13:08:19

Follow-up thought. If it helps, deciding where to hang data feels a lot like DB schema design. The visual structure, more or less a tree, entails a natural context or scope. We can leverage that in thinking about our data. So in the two-counter example, the state moved off the scaffold to the repeating counter structure. I imagine it started on the column, then I discovered Flutter needed an expanded widget for layout reasons, but I left the state on the column. With Flutter, we are always jugging these little wrappers, so no point in chasing which is the root. Column certainly seems more stable than expanded, is my thinking.