3 ms·

Changing attributes of UI elements defined in code vs some XML format is in my mind the same level of effort. button.SetBackground(<color>) or <button backgr

by rstat1 5y ago

Changing attributes of UI elements defined in code vs some XML format is in my mind the same level of effort. button.SetBackground(<color>) or <button backgroundColor="<color>" /> I see no difference there. EDIT: Ok the main difference I guess would be having to switch files (and thus context) which could be annoying. Plus there's also the non-zero performance impact from having to parse an XML format.

999900000999 5y ago
What if you have stacked elements, or elements within elements. <Box> <Button> <Icon/> </Button> </Box> In code it's something weird like Box(button( Icon() )))
- rstat1 5y ago
  Its entirely dependent on how w/e library your using implements that pattern. For the code I just recently wrote that does a similar thing, its literally just: button.SetIcon(<icon-path-or-font-glyph>) box.add(button) Doesn't really seem all that weird to me.
- dragonwriter 5y ago
  How is: Box( Button( Icon(...) ) ) Weirder than: <Box> <Button> <Icon ... /> </Button> </Box>
  - 999900000999 5y ago
    Now attach some callbacks. With XML I'm attaching my callbacks via code while defining the UI elsewhere. With pure code, I have to attach the callbacks directly to the object. Theirs a reason you don't just use JavaScript to define React components
    - dividuum 5y ago
      You're in the wrong thread. :-) The main benefit of most immediate mode guis I've seen is that it's trivial to expose internal values to a ui in one line of code. No callbacks, no looking for the right place in any XML file or similar. Instead you add these lines when you need them and they show up in a ui: checkbox(&godmode, "Activate Godmode") slider(&enemy_aggro, "Enemy aggression", 0, 100)
    - dragonwriter 5y ago
      > Now attach some callbacks. Not that any of this is relevant to immediate mode GUI, but the actual attachment of callbacks can be done identically in code no matter how the base UI design is done if you want it separately, but if you do it in code (whether with normal syntax or a funky transform like JSX) you can also have the option of direct attachment. > With pure code, I have to attach the callbacks directly to the object. No, you don't, but you can, and as it turns out, that's kind of popular. > Theirs a reason you don't just use JavaScript to define React components You can, in fact, but even when you use JSX, there is a reason you don't use actual (HT/X)ML code, but instead a language that compiles to, and let's you freely mix in, JavaScript.
      - 999900000999 5y ago
        Let's say you have a really complex UI. Would you really define your UI in code over XML or HTML
        setr 5y ago
        Yes. The more complex and more dynamic the UI, the worse the separation gets. The worst of it being when you’re writing code to generate your XML/HTML, and probably introducing a third “templating” language to continue the pretense that HTML/XML is not just standard data structures defined in a different syntax. The purpose of XML/HTML is to make your GUI specification independent of the programming language itself, and independent of any particular library (anyone can spit out an HTML <button>… it’s quite difficult for C++ to construct a Java Button class). And there’s some notion that it’s easier for “non-programmers” to edit, without being bogged down programming language details (its “easier” to learn HTML than Java… and as programmers we eat the cost by now having to learn both)
        999900000999 5y ago
        So now I'm assuming, you're approach would be to just have classes for your custom UI elements. It might just be a Unity thing, but up until they released their XML UI tools, I could not build a decent UI for the life of me. Basic things like getting buttons to appear where I want them to are very hard without XML
- elcritch 5y ago
  I prefer the best of both worlds. I've been making a YAML like widget syntax in code using an immediate mode GUI written in Nim. It let's me write things like: Horizontal: box 10.WPerc, 100, 8.Em, 2.Em Button: text: fmt"Clicked4: {self.count:4d}" setup: size 8.Em, 2.Em onClick: self.count.inc() https://github.com/elcritch/fidget/blob/devel/tests/basicwidget/basicwidget_v1.nim https://github.com/elcritch/fidget/blob/devel/tests/basicwid...
jayd16 5y ago
The nice thing about separating the view definition from the controller code is you can work on the view without actually running code. Most retained mode GUIs have standalone view editor. That's essentially not possible in immediate mode guis without a lot more mocking of code.

by rstat1 5y ago

999900000999 5y ago

What if you have stacked elements, or elements within elements. <Box> <Button> <Icon/> </Button> </Box> In code it's something weird like Box(button( Icon() )))

rstat1 5y ago
Its entirely dependent on how w/e library your using implements that pattern. For the code I just recently wrote that does a similar thing, its literally just: button.SetIcon(<icon-path-or-font-glyph>) box.add(button) Doesn't really seem all that weird to me.
dragonwriter 5y ago
How is: Box( Button( Icon(...) ) ) Weirder than: <Box> <Button> <Icon ... /> </Button> </Box>
- 999900000999 5y ago
  Now attach some callbacks. With XML I'm attaching my callbacks via code while defining the UI elsewhere. With pure code, I have to attach the callbacks directly to the object. Theirs a reason you don't just use JavaScript to define React components
  - dividuum 5y ago
    You're in the wrong thread. :-) The main benefit of most immediate mode guis I've seen is that it's trivial to expose internal values to a ui in one line of code. No callbacks, no looking for the right place in any XML file or similar. Instead you add these lines when you need them and they show up in a ui: checkbox(&godmode, "Activate Godmode") slider(&enemy_aggro, "Enemy aggression", 0, 100)
  - dragonwriter 5y ago
    > Now attach some callbacks. Not that any of this is relevant to immediate mode GUI, but the actual attachment of callbacks can be done identically in code no matter how the base UI design is done if you want it separately, but if you do it in code (whether with normal syntax or a funky transform like JSX) you can also have the option of direct attachment. > With pure code, I have to attach the callbacks directly to the object. No, you don't, but you can, and as it turns out, that's kind of popular. > Theirs a reason you don't just use JavaScript to define React components You can, in fact, but even when you use JSX, there is a reason you don't use actual (HT/X)ML code, but instead a language that compiles to, and let's you freely mix in, JavaScript.
    - 999900000999 5y ago
      Let's say you have a really complex UI. Would you really define your UI in code over XML or HTML
      - setr 5y ago
        Yes. The more complex and more dynamic the UI, the worse the separation gets. The worst of it being when you’re writing code to generate your XML/HTML, and probably introducing a third “templating” language to continue the pretense that HTML/XML is not just standard data structures defined in a different syntax. The purpose of XML/HTML is to make your GUI specification independent of the programming language itself, and independent of any particular library (anyone can spit out an HTML <button>… it’s quite difficult for C++ to construct a Java Button class). And there’s some notion that it’s easier for “non-programmers” to edit, without being bogged down programming language details (its “easier” to learn HTML than Java… and as programmers we eat the cost by now having to learn both)
        999900000999 5y ago
        So now I'm assuming, you're approach would be to just have classes for your custom UI elements. It might just be a Unity thing, but up until they released their XML UI tools, I could not build a decent UI for the life of me. Basic things like getting buttons to appear where I want them to are very hard without XML
elcritch 5y ago
I prefer the best of both worlds. I've been making a YAML like widget syntax in code using an immediate mode GUI written in Nim. It let's me write things like: Horizontal: box 10.WPerc, 100, 8.Em, 2.Em Button: text: fmt"Clicked4: {self.count:4d}" setup: size 8.Em, 2.Em onClick: self.count.inc() https://github.com/elcritch/fidget/blob/devel/tests/basicwidget/basicwidget_v1.nim https://github.com/elcritch/fidget/blob/devel/tests/basicwid...

jayd16 5y ago

The nice thing about separating the view definition from the controller code is you can work on the view without actually running code. Most retained mode GUIs have standalone view editor. That's essentially not possible in immediate mode guis without a lot more mocking of code.