bjoli/bjogui
SHA256
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Keyed children, and eight more controls

Browse source 
A child is now known by its key, or by its place among the children with no
key. One whose identity was there before keeps its control, and the
controls are put in the new order by moving only those out of place. So a
list that is sorted, or has an item put in front, keeps its controls.

Text areas, sliders, progress bars, dropdowns, images, grids with cells and
spans, and scroll views. A grid's sizes are .NET properties and not
Avalonia's, so they are set by a setter of their own. A text is centred in
its height, so a label lines up with the control beside it.

🤖 Generated with [ECA](https://eca.dev) (anthropic/claude-opus-4-8)

Co-Authored-By: eca-agent <git@eca.dev>
This commit is contained in:
Linus Björnstam 2026-10-25 17:13:35 +01:00
parent 4f48282314
commit 95b6707cc1
4 changed files with 680 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

60
Readme.org
View file

@ -35,8 +35,11 @@ view. The next view is compared with the last one, control by control, and
only what differs is changed. So a control keeps its focus, its caret and its
scroll position when the model changes.
Children are matched by their place in the list. A child whose kind changes
gets a new control.
Children are matched by key, and those with no key by their place among
the others with none. Give each item of a list that can change order a key
with ~(keyed id view)~: a child that moves then keeps its control, and the
control is moved rather than made again. A child whose kind changes gets a
new control.
A control that is changed raises events of its own: a text input whose text
is set says that its text changed. Those events come while the controls are
@ -44,18 +47,44 @@ being changed, and they are dropped, so only the user's events are messages.
* The views: (bjogui view)
| Constructor | Control | Sends |
|--------------------------------------------------+--------------+-----------------------------|
| ~(text s)~ | ~TextBlock~ | nothing |
| ~(button label msg)~ | ~Button~ | ~msg~ on a click |
| ~(text-input value on-input)~ | ~TextBox~ | ~(on-input text)~ on a change |
| ~(checkbox label checked? on-toggle)~ | ~CheckBox~ | ~(on-toggle checked)~ |
| ~(column child ...)~, ~(row child ...)~ | ~StackPanel~ | nothing |
| Constructor | Control | Sends |
|------------------------------------------------------+---------------+-------------------------------|
| ~(text s)~ | ~TextBlock~ | nothing |
| ~(button label msg)~ | ~Button~ | ~msg~ on a click |
| ~(text-input value on-input)~ | ~TextBox~ | ~(on-input text)~ on a change |
| ~(text-area value on-input)~ | ~TextBox~, several lines | ~(on-input text)~ |
| ~(checkbox label checked? on-toggle)~ | ~CheckBox~ | ~(on-toggle checked)~ |
| ~(slider value minimum maximum on-change)~ | ~Slider~ | ~(on-change value)~ |
| ~(progress-bar value)~ | ~ProgressBar~ | nothing |
| ~(dropdown options selected on-select)~ | ~ComboBox~ | ~(on-select index)~ |
| ~(image path)~ | ~Image~ | nothing |
| ~(column child ...)~, ~(row child ...)~ | ~StackPanel~ | nothing |
| ~(grid #:columns #:rows child ...)~ | ~Grid~ | nothing |
| ~(scroll child)~ | ~ScrollViewer~ | nothing |
They take keywords where they apply: ~#:size~ (the font size of a text),
~#:width~, ~#:height~, ~#:margin~, ~#:padding~, ~#:spacing~ (between the
children of a column or a row), ~#:enabled~ and ~#:placeholder~. A size of
zero, the default, leaves the size to the control.
~#:wrap~ (a text breaks its lines at its width), ~#:width~, ~#:height~,
~#:margin~, ~#:padding~, ~#:spacing~ (between the children of a column, a row
or a grid), ~#:enabled~, ~#:placeholder~, ~#:step~ (a slider's arrow key) and
~#:maximum~ (a progress bar's full, 1 unless told otherwise). A size of zero,
the default, leaves the size to the control.
A grid's ~#:columns~ and ~#:rows~ are sizes as Avalonia writes them: ~"Auto"~
fits the content, ~"*"~ shares what is left, ~"2*"~ takes two shares, and a
number is pixels. ~(at row column view)~ puts a view in a cell, counting from
0, with ~#:row-span~ and ~#:column-span~.
#+BEGIN_SRC scheme
(grid #:columns "Auto,*" #:rows "Auto,Auto" #:spacing 6.0
(at 0 0 (text "Volume")) (at 0 1 (slider (.volume m) 0.0 10.0 Volume))
(at 1 0 (text "Colour")) (at 1 1 (dropdown ["red" "green" "blue"] (.colour m) Colour)))
(scroll (apply column (vec->array (vec-map (fun (t) (keyed (.id t) (text (.title t))))
(.todos m))))
#:height 200.0)
#+END_SRC
An image that cannot be read shows nothing.
* Work: commands and subscriptions
@ -124,11 +153,14 @@ cancelled, and the program ends.
#+BEGIN_SRC sh
bjo run tests/app.bjo # prints "bjogui ok"
bjo run tests/effects.bjo # prints "bjogui effects ok"
bjo run tests/controls.bjo # prints "bjogui controls ok"
bjo run examples/counter.bjo
bjo run examples/stopwatch.bjo
#+END_SRC
* Not yet
- Keyed children, for lists whose items move.
- More controls: lists, grids, images, scroll views, menus.
- A list box with a selection, tabs, menus and dialogs.
- Colours, borders and styles of one's own.
- A moved control is taken out of the panel and put back, so it may lose the
keyboard focus.