glimmer-dsl-libui 0.2.24 → 0.3.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +34 -0
- data/README.md +1153 -921
- data/VERSION +1 -1
- data/examples/area_gallery.rb +19 -19
- data/examples/area_gallery2.rb +91 -89
- data/examples/area_gallery3.rb +19 -19
- data/examples/area_gallery4.rb +91 -89
- data/examples/basic_image.rb +19 -0
- data/examples/basic_image2.rb +13 -0
- data/examples/basic_image3.rb +23 -0
- data/examples/basic_image4.rb +17 -0
- data/examples/basic_image5.rb +75 -0
- data/examples/basic_table_color.rb +1 -11
- data/examples/basic_table_color2.rb +39 -0
- data/examples/basic_table_image.rb +2 -14
- data/examples/basic_table_image2.rb +44 -0
- data/examples/basic_table_image_text.rb +2 -13
- data/examples/basic_table_image_text2.rb +44 -0
- data/examples/basic_transform.rb +3 -6
- data/examples/basic_transform2.rb +34 -0
- data/examples/color_the_circles.rb +1 -3
- data/examples/dynamic_area.rb +1 -3
- data/examples/dynamic_area2.rb +5 -7
- data/examples/form_table.rb +4 -0
- data/examples/grid.rb +4 -4
- data/examples/histogram.rb +4 -8
- data/examples/meta_example.rb +50 -10
- data/examples/snake.rb +1 -3
- data/examples/tetris.rb +15 -18
- data/examples/tic_tac_toe/board.rb +4 -2
- data/examples/tic_tac_toe.rb +1 -3
- data/glimmer-dsl-libui.gemspec +0 -0
- data/lib/glimmer/dsl/libui/control_expression.rb +1 -1
- data/lib/glimmer/dsl/libui/shape_expression.rb +6 -1
- data/lib/glimmer/libui/control_proxy/area_proxy.rb +1 -0
- data/lib/glimmer/libui/control_proxy/column.rb +2 -2
- data/lib/glimmer/libui/control_proxy/image_part_proxy.rb +0 -1
- data/lib/glimmer/libui/control_proxy/image_proxy.rb +159 -12
- data/lib/glimmer/libui/control_proxy/table_proxy.rb +15 -2
- data/lib/glimmer/libui/control_proxy/window_proxy.rb +1 -1
- data/lib/glimmer/libui/control_proxy.rb +7 -7
- data/lib/glimmer/libui/image_path_renderer.rb +30 -0
- data/lib/glimmer/libui/shape.rb +44 -1
- metadata +29 -19
data/README.md
CHANGED
|
@@ -1,10 +1,14 @@
|
|
|
1
|
-
# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for LibUI 0.
|
|
1
|
+
# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for LibUI 0.3.3
|
|
2
2
|
## Prerequisite-Free Ruby Desktop Development GUI Library
|
|
3
3
|
[](http://badge.fury.io/rb/glimmer-dsl-libui)
|
|
4
4
|
[](https://gitter.im/AndyObtiva/glimmer?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
|
|
5
5
|
|
|
6
6
|
[Glimmer](https://github.com/AndyObtiva/glimmer) DSL for [LibUI](https://github.com/kojix2/LibUI) is a prerequisite-free Ruby desktop development GUI library. No need to pre-install any prerequisites. Just install the gem and have platform-independent native GUI that just works!
|
|
7
7
|
|
|
8
|
+
Mac | Windows | Linux
|
|
9
|
+
----|---------|------
|
|
10
|
+
 |  | 
|
|
11
|
+
|
|
8
12
|
[LibUI](https://github.com/kojix2/LibUI) is a thin [Ruby](https://www.ruby-lang.org/en/) wrapper around [libui](https://github.com/andlabs/libui), a relatively new C GUI library that renders native controls on every platform (similar to [SWT](https://www.eclipse.org/swt/), but without the heavy weight of the [Java Virtual Machine](https://www.java.com/en/)).
|
|
9
13
|
|
|
10
14
|
The main trade-off in using [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) as opposed to [Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt) or [Glimmer DSL for Tk](https://github.com/AndyObtiva/glimmer-dsl-tk) is the fact that [SWT](https://www.eclipse.org/swt/) and [Tk](https://www.tcl.tk/) are more mature than mid-alpha [libui](https://github.com/andlabs/libui) as GUI toolkits. Still, if there is only a need to build a small simple application, [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) could be a good convenient choice due to having zero prerequisites beyond the dependencies included in the [Ruby gem](https://rubygems.org/gems/glimmer-dsl-libui). Also, just like [Glimmer DSL for Tk](https://github.com/AndyObtiva/glimmer-dsl-tk), its apps start instantly and have a small memory footprint. [LibUI](https://github.com/kojix2/LibUI) is a promising new GUI toolkit that might prove quite worthy in the future.
|
|
@@ -28,17 +32,9 @@ include Glimmer
|
|
|
28
32
|
window('hello world').show
|
|
29
33
|
```
|
|
30
34
|
|
|
31
|
-
Mac
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
Windows
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
Linux
|
|
40
|
-
|
|
41
|
-
|
|
35
|
+
Mac | Windows | Linux
|
|
36
|
+
----|---------|------
|
|
37
|
+
 |  | 
|
|
42
38
|
|
|
43
39
|
Basic Table Progress Bar
|
|
44
40
|
|
|
@@ -77,17 +73,9 @@ window('Task Progress', 300, 200) {
|
|
|
77
73
|
}.show
|
|
78
74
|
```
|
|
79
75
|
|
|
80
|
-
Mac
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
Windows
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
Linux
|
|
89
|
-
|
|
90
|
-
|
|
76
|
+
Mac | Windows | Linux
|
|
77
|
+
----|---------|------
|
|
78
|
+
 |  | 
|
|
91
79
|
|
|
92
80
|
Area Gallery
|
|
93
81
|
|
|
@@ -98,50 +86,50 @@ include Glimmer
|
|
|
98
86
|
|
|
99
87
|
window('Area Gallery', 400, 400) {
|
|
100
88
|
area {
|
|
101
|
-
path { # declarative stable path
|
|
89
|
+
path { # declarative stable path (explicit path syntax for multiple shapes sharing attributes)
|
|
102
90
|
square(0, 0, 100)
|
|
103
91
|
square(100, 100, 400)
|
|
104
|
-
|
|
92
|
+
|
|
105
93
|
fill r: 102, g: 102, b: 204
|
|
106
94
|
}
|
|
107
|
-
|
|
95
|
+
|
|
96
|
+
path { # declarative stable path (explicit path syntax for multiple shapes sharing attributes)
|
|
108
97
|
rectangle(0, 100, 100, 400)
|
|
109
98
|
rectangle(100, 0, 400, 100)
|
|
110
|
-
|
|
99
|
+
|
|
111
100
|
# linear gradient (has x0, y0, x1, y1, and stops)
|
|
112
101
|
fill x0: 10, y0: 10, x1: 350, y1: 350, stops: [{pos: 0.25, r: 204, g: 102, b: 204}, {pos: 0.75, r: 102, g: 102, b: 204}]
|
|
113
102
|
}
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
103
|
+
|
|
104
|
+
polygon(100, 100, 100, 400, 400, 100, 400, 400) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
117
105
|
fill r: 202, g: 102, b: 104, a: 0.5
|
|
118
106
|
stroke r: 0, g: 0, b: 0
|
|
119
107
|
}
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
108
|
+
|
|
109
|
+
polybezier(0, 0,
|
|
110
|
+
200, 100, 100, 200, 400, 100,
|
|
111
|
+
300, 100, 100, 300, 100, 400,
|
|
112
|
+
100, 300, 300, 100, 400, 400) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
123
113
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
124
114
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
125
115
|
}
|
|
126
|
-
path { # declarative stable path
|
|
127
|
-
polyline(100, 100, 400, 100, 100, 400, 400, 400, 0, 0)
|
|
128
116
|
|
|
117
|
+
polyline(100, 100, 400, 100, 100, 400, 400, 400, 0, 0) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
129
118
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
130
119
|
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
120
|
+
|
|
121
|
+
arc(404, 216, 190, 90, 90, false) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
134
122
|
# radial gradient (has an outer_radius in addition to x0, y0, x1, y1, and stops)
|
|
135
123
|
fill outer_radius: 90, x0: 0, y0: 0, x1: 500, y1: 500, stops: [{pos: 0.25, r: 102, g: 102, b: 204, a: 0.5}, {pos: 0.75, r: 204, g: 102, b: 204}]
|
|
136
124
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
137
125
|
}
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
126
|
+
|
|
127
|
+
circle(200, 200, 90) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
141
128
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
142
129
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
143
130
|
}
|
|
144
|
-
|
|
131
|
+
|
|
132
|
+
text(161, 40, 100) { # declarative stable text
|
|
145
133
|
string('Area Gallery') {
|
|
146
134
|
font family: 'Arial', size: (OS.mac? ? 14 : 11)
|
|
147
135
|
color :black
|
|
@@ -199,20 +187,16 @@ window('Area Gallery', 400, 400) {
|
|
|
199
187
|
}.show
|
|
200
188
|
```
|
|
201
189
|
|
|
202
|
-
Mac
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
Windows
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
Linux
|
|
211
|
-
|
|
212
|
-
|
|
190
|
+
Mac | Windows | Linux
|
|
191
|
+
----|---------|------
|
|
192
|
+
 |  | 
|
|
213
193
|
|
|
214
194
|
[Check Out Many More Examples Over Here!](#examples)
|
|
215
195
|
|
|
196
|
+
Mac | Windows | Linux
|
|
197
|
+
----|---------|------
|
|
198
|
+
 |  | 
|
|
199
|
+
|
|
216
200
|
NOTE: [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) is feature-complete and in beta mode (though the C [libui](https://github.com/andlabs/libui) is still mid-alpha). Please help make better by contributing, adopting for small or low risk projects, and providing feedback. The more feedback and issues you report the better.
|
|
217
201
|
|
|
218
202
|
Other [Glimmer](https://rubygems.org/gems/glimmer) DSL gems you might be interested in:
|
|
@@ -238,6 +222,14 @@ Other [Glimmer](https://rubygems.org/gems/glimmer) DSL gems you might be interes
|
|
|
238
222
|
- [Extra Operations](#extra-operations)
|
|
239
223
|
- [Table API](#table-api)
|
|
240
224
|
- [Area API](#area-api)
|
|
225
|
+
- [Area Path Shapes](#area-path-shapes)
|
|
226
|
+
- [Area Text](#area-text)
|
|
227
|
+
- [Area Image](#area-image)
|
|
228
|
+
- [Colors](#colors)
|
|
229
|
+
- [Area Draw Params](#area-draw-params)
|
|
230
|
+
- [Area Listeners](#area-listeners)
|
|
231
|
+
- [Area Methods/Attributes](#area-methods-attributes)
|
|
232
|
+
- [Area Transform Matrix](#area-transform-matrix)
|
|
241
233
|
- [Smart Defaults and Conventions](#smart-defaults-and-conventions)
|
|
242
234
|
- [Custom Keywords](#custom-keywords)
|
|
243
235
|
- [API Gotchas](#api-gotchas)
|
|
@@ -270,6 +262,7 @@ Other [Glimmer](https://rubygems.org/gems/glimmer) DSL gems you might be interes
|
|
|
270
262
|
- [Basic Area](#basic-area)
|
|
271
263
|
- [Dynamic Area](#dynamic-area)
|
|
272
264
|
- [Area Gallery](#area-gallery)
|
|
265
|
+
- [Basic Image](#basic-image)
|
|
273
266
|
- [Histogram](#histogram)
|
|
274
267
|
- [Basic Transform](#basic-transform)
|
|
275
268
|
- [Login](#login)
|
|
@@ -373,7 +366,7 @@ gem install glimmer-dsl-libui
|
|
|
373
366
|
Or install via Bundler `Gemfile`:
|
|
374
367
|
|
|
375
368
|
```ruby
|
|
376
|
-
gem 'glimmer-dsl-libui', '~> 0.
|
|
369
|
+
gem 'glimmer-dsl-libui', '~> 0.3.3'
|
|
377
370
|
```
|
|
378
371
|
|
|
379
372
|
Add `require 'glimmer-dsl-libui'` at the top, and then `include Glimmer` into the top-level main object for testing or into an actual class for serious usage.
|
|
@@ -444,7 +437,7 @@ w.libui # => #<Fiddle::Pointer:0x00007fde53997980 ptr=0x00007fde51352a60 size=0
|
|
|
444
437
|
|
|
445
438
|
### Supported Keywords
|
|
446
439
|
|
|
447
|
-
These are all the supported keywords. Note that some keywords do not represent controls, but produce objects that are used as the property values of controls (e.g. `image`
|
|
440
|
+
These are all the supported keywords. Note that some keywords do not represent controls, but produce objects that are used as the property values of controls (e.g. `image` can be used as a control under `area` or alternatively build objects to use in `cell_rows` for a `table` with an `image_column`)
|
|
448
441
|
|
|
449
442
|
Keyword(Args) | Properties | Listeners
|
|
450
443
|
------------- | ---------- | ---------
|
|
@@ -473,7 +466,7 @@ Keyword(Args) | Properties | Listeners
|
|
|
473
466
|
`group(text as String)` | `margined` (Boolean), `title` (`String`) | None
|
|
474
467
|
`horizontal_box` | `padded` (Boolean) | None
|
|
475
468
|
`horizontal_separator` | None | None
|
|
476
|
-
`image(width as Numeric, height as Numeric)` |
|
|
469
|
+
`image(file as String = nil, width as Numeric = nil, height as Numeric = nil)` | `file` (`String` path or URL), `width`, `height` | None
|
|
477
470
|
`image_part(pixels as String [encoded image rgba byte array], width as Numeric, height as Numeric, byte_stride as Numeric [usually width*4])` | None | None
|
|
478
471
|
`image_column(name as String)` | None | None
|
|
479
472
|
`image_text_column(name as String)` | None | None
|
|
@@ -715,7 +708,9 @@ Learn more by checking out [examples](#examples).
|
|
|
715
708
|
|
|
716
709
|
The `area` control is a canvas-like control for drawing paths that can be used in one of two ways:
|
|
717
710
|
- Declaratively via stable paths: useful for stable paths that will not change often later on. Simply nest `path` and figures like `rectangle` and all drawing logic is generated automatically. Path proxy objects are preserved across redraws assuming there would be relatively few stable paths (mostly for decorative reasons).
|
|
718
|
-
- Semi-declaratively via on_draw listener dynamic paths: useful for more dynamic paths that will definitely change very often. Open an `on_draw` listener block that receives
|
|
711
|
+
- Semi-declaratively via on_draw listener dynamic paths: useful for more dynamic paths that will definitely change very often. Open an `on_draw` listener block that receives an [`area_draw_params`](#area-draw-params) argument and nest `path` and figures like `rectangle` and all drawing logic is generated automatically. Path proxy objects are destroyed (thrown-away) at the end of drawing, thus having less memory overhead for drawing thousands of dynamic paths.
|
|
712
|
+
|
|
713
|
+
Note that when nesting an `area` directly underneath `window` (without a layout control like `vertical_box`), it is automatically reparented with `vertical_box` in between the `window` and `area` since it would not show up on Linux otherwise.
|
|
719
714
|
|
|
720
715
|
Here is an example of a declarative `area` with a stable path (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
721
716
|
|
|
@@ -739,9 +734,11 @@ window('Basic Area', 400, 400) {
|
|
|
739
734
|
}.show
|
|
740
735
|
```
|
|
741
736
|
|
|
742
|
-
|
|
737
|
+
Mac | Windows | Linux
|
|
738
|
+
----|---------|------
|
|
739
|
+
 |  | 
|
|
743
740
|
|
|
744
|
-
Here is the same example using a semi-declarative `area` with `on_draw` listener that receives a `area_draw_params` argument and a dynamic path (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
741
|
+
Here is the same example using a semi-declarative `area` with `on_draw` listener that receives a [`area_draw_params`](#area-draw-params) argument and a dynamic path (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
745
742
|
|
|
746
743
|
```ruby
|
|
747
744
|
require 'glimmer-dsl-libui'
|
|
@@ -767,21 +764,268 @@ window('Basic Area', 400, 400) {
|
|
|
767
764
|
|
|
768
765
|
Check [examples/dynamic_area.rb](#dynamic-area) for a more detailed semi-declarative example.
|
|
769
766
|
|
|
767
|
+
#### Area Path Shapes
|
|
768
|
+
|
|
770
769
|
`path` can receive a `draw_fill_mode` argument that can accept values `:winding` or `:alternate` and defaults to `:winding`.
|
|
771
770
|
|
|
772
771
|
Available nested `path` shapes:
|
|
773
772
|
- `rectangle(x as Numeric, y as Numeric, width as Numeric, height as Numeric)`
|
|
774
773
|
- `square(x as Numeric, y as Numeric, length as Numeric)`
|
|
775
774
|
- `arc(x_center as Numeric, y_center as Numeric, radius as Numeric, start_angle as Numeric, sweep as Numeric, is_negative as Boolean)`
|
|
776
|
-
- `
|
|
777
|
-
- `
|
|
778
|
-
- `
|
|
779
|
-
- `
|
|
780
|
-
- `
|
|
775
|
+
- `circle(x_center as Numeric, y_center as Numeric, radius as Numeric)`
|
|
776
|
+
- `line(x as Numeric, y as Numeric)`: must be placed in a figure (check `polyline`/`polygon` alternatives that do not require a `figure`)
|
|
777
|
+
- `bezier(c1_x as Numeric, c1_y as Numeric, c2_x as Numeric, c2_y as Numeric, end_x as Numeric, end_y as Numeric)`: must be placed in a figure (check `polybezier` alternative that does not require a `figure`)
|
|
778
|
+
- `polygon(point_array as Array of Arrays of Numeric or Array of Numeric)`: shortcut for a closed figure of lines; can receive points as [[x1, y1], [x2, y2], ...] or [x1, y1, x2, y2, ...]
|
|
779
|
+
- `polyline(point_array as Array of Arrays of Numeric or Array of Numeric)`: shortcut for an open figure of lines; can receive points as [[x1, y1], [x2, y2], ...] or [x1, y1, x2, y2, ...]
|
|
780
|
+
- `polybezier(point_array as Array of Arrays of Numeric or Array of Numeric)`: shortcut for an open figure of beziers; can receive points as [[start_x1, start_y1], [c1_x2, c1_y2, c2_x2, c2_y2, end_x2, end_y2], [c1_x3, c1_y3, c2_x3, c2_y3, end_x3, end_y3], ...] or [start_x1, start_y1, c1_x2, c1_y2, c2_x2, c2_y2, end_x2, end_y2, c1_x3, c1_y3, c2_x3, c2_y3, end_x3, end_y3, ...]
|
|
781
781
|
- `figure(x=nil as Numeric, y=nil as Numeric)` (composite that can contain other shapes) (can set `closed true` to connect last point to first point automatically)
|
|
782
782
|
|
|
783
783
|
Check [examples/area_gallery.rb](#area-gallery) for an overiew of all `path` shapes.
|
|
784
784
|
|
|
785
|
+
Mac | Windows | Linux
|
|
786
|
+
----|---------|------
|
|
787
|
+
 |  | 
|
|
788
|
+
|
|
789
|
+
#### Area Text
|
|
790
|
+
|
|
791
|
+
To draw `text` in an `area`, you simply nest a `text(x, y, width)` control directly under `area` or inside a `on_draw` listener, and then nest attributed `string {[attributes]; string_value}` controls underneath it returning an actual `String` (think of them as the `<span>` or `<p>` element in html, which contains a string of text). Alternatively, you can nest attributed `string(string_value) {[attributes]}` if `string_value` is a short single-line string. An attributed `string` value can be changed dynamically via its `string` property.
|
|
792
|
+
|
|
793
|
+
`text` has the following properties:
|
|
794
|
+
- `default_font`:
|
|
795
|
+
- `align`: `:left` (default), `:center`, or `:right` (`align` currently seems not to work on the Mac)
|
|
796
|
+
- `x`: x coordinate in relation to parent `area` top-left corner
|
|
797
|
+
- `y`: y coordinate in relation to parent `area` top-left corner
|
|
798
|
+
- `width` (default: area width - x*2): width of text to display
|
|
799
|
+
|
|
800
|
+
`string` has the following properties:
|
|
801
|
+
- `font`: font descriptor hash consisting of `:family`, `:size`, `:weight` (`[:minimum, :thin, :ultra_light, :light, :book, :normal, :medium, :semi_bold, :bold, :ultra_bold, :heavy, :ultra_heavy, :maximum]`), `:italic` (`[:normal, :oblique, :italic]`), and `:stretch` (`[:ultra_condensed, :extra_condensed, :condensed, :semi_condensed, :normal, :semi_expanded, :expanded, :extra_expanded, :ultra_expanded]`) key values
|
|
802
|
+
- `color`: rgba, hex, or [X11](https://en.wikipedia.org/wiki/X11_color_names) color
|
|
803
|
+
- `background`: rgba, hex, or [X11](https://en.wikipedia.org/wiki/X11_color_names) color
|
|
804
|
+
- `underline`: one of `:none`, `:single`, `:double`, `:suggestion`, `:color_custom`, `:color_spelling`, `:color_grammar`, `:color_auxiliary`
|
|
805
|
+
- `underline_color`: one of `:spelling`, `:grammar`, `:auxiliary`, rgba, hex, or [X11](https://en.wikipedia.org/wiki/X11_color_names) color
|
|
806
|
+
- `open_type_features`: Open Type Features (https://www.microsoft.com/typography/otspec/featuretags.htm) consist of `open_type_tag`s nested in content block, which accept (`a`, `b`, `c`, `d`, `Integer`) arguments.
|
|
807
|
+
- `string`: string value (`String`)
|
|
808
|
+
|
|
809
|
+
Example (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
810
|
+
|
|
811
|
+
```ruby
|
|
812
|
+
window('area text drawing') {
|
|
813
|
+
area {
|
|
814
|
+
text {
|
|
815
|
+
default_font family: 'Helvetica', size: 12, weight: :normal, italic: :normal, stretch: :normal
|
|
816
|
+
|
|
817
|
+
string {
|
|
818
|
+
font family: 'Georgia', size: 13, weight: :medium, italic: :normal, stretch: :normal
|
|
819
|
+
color r: 230, g: 100, b: 50, a: 0.5
|
|
820
|
+
background r: 230, g: 200, b: 250, a: 0.8
|
|
821
|
+
underline :single
|
|
822
|
+
underline_color :spelling
|
|
823
|
+
open_type_features {
|
|
824
|
+
open_type_tag 'l', 'i', 'g', 'a', 0
|
|
825
|
+
open_type_tag 'l', 'i', 'g', 'a', 1
|
|
826
|
+
}
|
|
827
|
+
|
|
828
|
+
"This is a demonstration\n" \
|
|
829
|
+
"of a very long\n" \
|
|
830
|
+
"attributed string\n" \
|
|
831
|
+
"spanning multiple lines\n\n"
|
|
832
|
+
}
|
|
833
|
+
|
|
834
|
+
string('This is a short unattributed string')
|
|
835
|
+
}
|
|
836
|
+
}
|
|
837
|
+
}.show
|
|
838
|
+
```
|
|
839
|
+
|
|
840
|
+
You may checkout [examples/basic_draw_text.rb](#basic-draw-text) and [examples/custom_draw_text.rb](#custom-draw-text) for examples of using `text` inside `area`.
|
|
841
|
+
|
|
842
|
+
Mac | Windows | Linux
|
|
843
|
+
----|---------|------
|
|
844
|
+
 |  | 
|
|
845
|
+
|
|
846
|
+
#### Area Image
|
|
847
|
+
|
|
848
|
+
**(ALPHA FEATURE)**
|
|
849
|
+
|
|
850
|
+
[libui](https://github.com/andlabs/libui) does not support `image` rendering outside of `table` yet.
|
|
851
|
+
However, [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) adds a special `image(file as String path or web URL, width as Numeric, height as Numeric)` custom control that renders an image unto an `area` pixel by pixel (and when possible to optimize, line by line).
|
|
852
|
+
|
|
853
|
+
Given that it is very new and is not a [libui](https://github.com/andlabs/libui)-native control, please keep these notes in mind:
|
|
854
|
+
- It only supports the `.png` file format.
|
|
855
|
+
- [libui](https://github.com/andlabs/libui) pixel-by-pixel rendering performance is slow.
|
|
856
|
+
- Including an `image` inside an `area` `on_draw` listener improves performance due to not retaining pixel/line data in memory.
|
|
857
|
+
- Supplying `width` and `height` (2nd and 3rd arguments) greatly improves performance when shrinking image.
|
|
858
|
+
|
|
859
|
+
Currently, it is recommended to use `image` with very small `width` and `height` values only.
|
|
860
|
+
|
|
861
|
+
Setting a [`transform` `matrix`](#area-transform-matrix) is supported under `image` just like it is under `path` and `text` inside `area`.
|
|
862
|
+
|
|
863
|
+
Example of using `image` declaratively (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
864
|
+
|
|
865
|
+
Mac | Windows | Linux
|
|
866
|
+
----|---------|------
|
|
867
|
+
 |  | 
|
|
868
|
+
|
|
869
|
+
```ruby
|
|
870
|
+
require 'glimmer-dsl-libui'
|
|
871
|
+
|
|
872
|
+
include Glimmer
|
|
873
|
+
|
|
874
|
+
window('Basic Image', 96, 96) {
|
|
875
|
+
area {
|
|
876
|
+
image(File.expand_path('icons/glimmer.png', __dir__), 96, 96)
|
|
877
|
+
}
|
|
878
|
+
}.show
|
|
879
|
+
```
|
|
880
|
+
|
|
881
|
+
Example of better performance via `on_draw` (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
882
|
+
|
|
883
|
+
```ruby
|
|
884
|
+
require 'glimmer-dsl-libui'
|
|
885
|
+
|
|
886
|
+
include Glimmer
|
|
887
|
+
|
|
888
|
+
window('Basic Image', 96, 96) {
|
|
889
|
+
area {
|
|
890
|
+
on_draw do |area_draw_params|
|
|
891
|
+
image(File.expand_path('icons/glimmer.png', __dir__), 96, 96)
|
|
892
|
+
end
|
|
893
|
+
}
|
|
894
|
+
}.show
|
|
895
|
+
```
|
|
896
|
+
|
|
897
|
+
Example of using `image` declaratively with explicit properties (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
898
|
+
|
|
899
|
+
```ruby
|
|
900
|
+
require 'glimmer-dsl-libui'
|
|
901
|
+
|
|
902
|
+
include Glimmer
|
|
903
|
+
|
|
904
|
+
window('Basic Image', 96, 96) {
|
|
905
|
+
area {
|
|
906
|
+
image {
|
|
907
|
+
file File.expand_path('icons/glimmer.png', __dir__)
|
|
908
|
+
width 96
|
|
909
|
+
height 96
|
|
910
|
+
}
|
|
911
|
+
}
|
|
912
|
+
}.show
|
|
913
|
+
```
|
|
914
|
+
|
|
915
|
+
Example of better performance via `on_draw` with explicit properties (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
916
|
+
|
|
917
|
+
```ruby
|
|
918
|
+
require 'glimmer-dsl-libui'
|
|
919
|
+
|
|
920
|
+
include Glimmer
|
|
921
|
+
|
|
922
|
+
window('Basic Image', 96, 96) {
|
|
923
|
+
area {
|
|
924
|
+
on_draw do |area_draw_params|
|
|
925
|
+
image {
|
|
926
|
+
file File.expand_path('icons/glimmer.png', __dir__)
|
|
927
|
+
width 96
|
|
928
|
+
height 96
|
|
929
|
+
}
|
|
930
|
+
end
|
|
931
|
+
}
|
|
932
|
+
}.show
|
|
933
|
+
```
|
|
934
|
+
|
|
935
|
+
If you need to render an image pixel by pixel (e.g. to support a format other than `.png`) for very exceptional scenarios, you may use this example as a guide, including a line-merge optimization for neighboring horizontal pixels with the same color:
|
|
936
|
+
|
|
937
|
+
```ruby
|
|
938
|
+
# This is the manual way of rendering an image unto an area control.
|
|
939
|
+
# It could come in handy in special situations.
|
|
940
|
+
# Otherwise, it is recommended to simply utilize the `image` control that
|
|
941
|
+
# can be nested under area or area on_draw listener to automate all this work.
|
|
942
|
+
|
|
943
|
+
require 'glimmer-dsl-libui'
|
|
944
|
+
require 'chunky_png'
|
|
945
|
+
|
|
946
|
+
include Glimmer
|
|
947
|
+
|
|
948
|
+
puts 'Parsing image...'; $stdout.flush
|
|
949
|
+
|
|
950
|
+
f = File.open(File.expand_path('icons/glimmer.png', __dir__))
|
|
951
|
+
canvas = ChunkyPNG::Canvas.from_io(f)
|
|
952
|
+
f.close
|
|
953
|
+
canvas.resample_nearest_neighbor!(96, 96)
|
|
954
|
+
data = canvas.to_rgba_stream
|
|
955
|
+
width = canvas.width
|
|
956
|
+
height = canvas.height
|
|
957
|
+
puts "Image width: #{width}"
|
|
958
|
+
puts "Image height: #{height}"
|
|
959
|
+
|
|
960
|
+
puts 'Parsing colors...'; $stdout.flush
|
|
961
|
+
|
|
962
|
+
color_maps = height.times.map do |y|
|
|
963
|
+
width.times.map do |x|
|
|
964
|
+
r = data[(y*width + x)*4].ord
|
|
965
|
+
g = data[(y*width + x)*4 + 1].ord
|
|
966
|
+
b = data[(y*width + x)*4 + 2].ord
|
|
967
|
+
a = data[(y*width + x)*4 + 3].ord
|
|
968
|
+
{x: x, y: y, color: {r: r, g: g, b: b, a: a}}
|
|
969
|
+
end
|
|
970
|
+
end.flatten
|
|
971
|
+
puts "#{color_maps.size} pixels to render..."; $stdout.flush
|
|
972
|
+
|
|
973
|
+
puts 'Parsing shapes...'; $stdout.flush
|
|
974
|
+
|
|
975
|
+
shape_maps = []
|
|
976
|
+
original_color_maps = color_maps.dup
|
|
977
|
+
indexed_original_color_maps = Hash[original_color_maps.each_with_index.to_a]
|
|
978
|
+
color_maps.each do |color_map|
|
|
979
|
+
index = indexed_original_color_maps[color_map]
|
|
980
|
+
@rectangle_start_x ||= color_map[:x]
|
|
981
|
+
@rectangle_width ||= 1
|
|
982
|
+
if color_map[:x] < width - 1 && color_map[:color] == original_color_maps[index + 1][:color]
|
|
983
|
+
@rectangle_width += 1
|
|
984
|
+
else
|
|
985
|
+
if color_map[:x] > 0 && color_map[:color] == original_color_maps[index - 1][:color]
|
|
986
|
+
shape_maps << {x: @rectangle_start_x, y: color_map[:y], width: @rectangle_width, height: 1, color: color_map[:color]}
|
|
987
|
+
else
|
|
988
|
+
shape_maps << {x: color_map[:x], y: color_map[:y], width: 1, height: 1, color: color_map[:color]}
|
|
989
|
+
end
|
|
990
|
+
@rectangle_width = 1
|
|
991
|
+
@rectangle_start_x = color_map[:x] == width - 1 ? 0 : color_map[:x] + 1
|
|
992
|
+
end
|
|
993
|
+
end
|
|
994
|
+
puts "#{shape_maps.size} shapes to render..."; $stdout.flush
|
|
995
|
+
|
|
996
|
+
puts 'Rendering image...'; $stdout.flush
|
|
997
|
+
|
|
998
|
+
window('Basic Image', 96, 96) {
|
|
999
|
+
area {
|
|
1000
|
+
on_draw do |area_draw_params|
|
|
1001
|
+
shape_maps.each do |shape_map|
|
|
1002
|
+
path {
|
|
1003
|
+
rectangle(shape_map[:x], shape_map[:y], shape_map[:width], shape_map[:height])
|
|
1004
|
+
|
|
1005
|
+
fill shape_map[:color]
|
|
1006
|
+
}
|
|
1007
|
+
end
|
|
1008
|
+
end
|
|
1009
|
+
}
|
|
1010
|
+
}.show
|
|
1011
|
+
```
|
|
1012
|
+
|
|
1013
|
+
One final note is that in Linux, table images grow and shrink with the image size unlike on the Mac where table row heights are constant regardless of image sizes. As such, you may be able to repurpose a table with a single image column and a single row as an image control with more native libui rendering if you are only targeting Linux with your app.
|
|
1014
|
+
|
|
1015
|
+
Check out [examples/basic_image.rb](#basic-image) (all versions) for examples of using `image` Glimmer custom control.
|
|
1016
|
+
|
|
1017
|
+
#### Colors
|
|
1018
|
+
|
|
1019
|
+
`fill` and `stroke` accept [X11](https://en.wikipedia.org/wiki/X11_color_names) color `Symbol`s/`String`s like `:skyblue` and `'sandybrown'` or 6-char hex or 3-char hex-shorthand (as `Integer` or `String` with or without `0x` prefix)
|
|
1020
|
+
|
|
1021
|
+
Available [X11 colors](https://en.wikipedia.org/wiki/X11_color_names) can be obtained through `Glimmer::LibUI.x11_colors` method.
|
|
1022
|
+
|
|
1023
|
+
Check [Basic Transform](#basic-transform) example for use of [X11](https://en.wikipedia.org/wiki/X11_color_names) colors.
|
|
1024
|
+
|
|
1025
|
+
Check [Histogram](#histogram) example for use of hex colors.
|
|
1026
|
+
|
|
1027
|
+
#### Area Draw Params
|
|
1028
|
+
|
|
785
1029
|
The `area_draw_params` argument for `on_draw` block is a hash consisting of the following keys:
|
|
786
1030
|
- `:context`: the drawing context object
|
|
787
1031
|
- `:area_width`: area width
|
|
@@ -793,7 +1037,9 @@ The `area_draw_params` argument for `on_draw` block is a hash consisting of the
|
|
|
793
1037
|
|
|
794
1038
|
In general, it is recommended to use declarative stable paths whenever feasible since they require less code and simpler maintenance. But, in more advanced cases, semi-declarative dynamic paths could be used instead, especially if there are thousands of dynamic paths that need maximum performance and low memory footprint.
|
|
795
1039
|
|
|
796
|
-
|
|
1040
|
+
#### Area Listeners
|
|
1041
|
+
|
|
1042
|
+
`area` supported listeners are:
|
|
797
1043
|
- `on_key_event {|area_key_event| ...}`: general catch-all key event (recommend using fine-grained key events below instead)
|
|
798
1044
|
- `on_key_down {|area_key_event| ...}`
|
|
799
1045
|
- `on_key_up {|area_key_event| ...}`
|
|
@@ -821,14 +1067,14 @@ The `area_mouse_event` `Hash` argument for mouse events that receive it (e.g. `o
|
|
|
821
1067
|
|
|
822
1068
|
The `area_key_event` `Hash` argument for keyboard events that receive it (e.g. `on_key_up`, `on_key_down`) consist of the following hash keys:
|
|
823
1069
|
- `:key`: key character (`String`)
|
|
824
|
-
- `:key_value`: key value (`Integer`). Useful in rare cases for numeric processing of keys instead of dealing with as `:key` character `String`
|
|
1070
|
+
- `:key_value` (alias: `:key_code`): key code value (`Integer`). Useful in rare cases for numeric processing of keys instead of dealing with as `:key` character `String`
|
|
825
1071
|
- `:ext_key`: non-character extra key (`Symbol`) from `Glimmer::LibUI.enum_symbols(:ext_key)` such as `:left`, `:right`, `:escape`, `:insert`
|
|
826
1072
|
- `:ext_key_value`: non-character extra key value (`Integer`). Useful in rare cases for numeric processing of extra keys instead of dealing with as `:ext_key` `Symbol`
|
|
827
1073
|
- `:modifier`: modifier key pressed alone (e.g. `:shift` or `:control`)
|
|
828
1074
|
- `:modifiers`: modifier keys pressed simultaneously with `:key`, `:ext_key`, or `:modifier`
|
|
829
1075
|
- `:up`: indicates if key has been released or not (Boolean)
|
|
830
1076
|
|
|
831
|
-
|
|
1077
|
+
#### Area Methods/Attributes
|
|
832
1078
|
|
|
833
1079
|
To redraw an `area`, you may call the `#queue_redraw_all` method, or simply `#redraw`.
|
|
834
1080
|
|
|
@@ -838,6 +1084,8 @@ To redraw an `area`, you may call the `#queue_redraw_all` method, or simply `#re
|
|
|
838
1084
|
- `resume_auto_redraw`: resume auto redraw upon changes to nested stable `path` or shapes
|
|
839
1085
|
- `auto_redraw_enabled`/`auto_redraw_enabled?`/`auto_redraw_enabled=`: an attribute to disable/enable auto redraw on an `area` upon changes to nested stable `path` or shapes
|
|
840
1086
|
|
|
1087
|
+
#### Area Transform Matrix
|
|
1088
|
+
|
|
841
1089
|
A transform `matrix` can be set on a path by building a `matrix(m11 = nil, m12 = nil, m21 = nil, m22 = nil, m31 = nil, m32 = nil) {operations}` proxy object and then setting via `transform` property, or alternatively by building and setting the matrix in one call to `transform(m11 = nil, m12 = nil, m21 = nil, m22 = nil, m31 = nil, m32 = nil) {operations}` passing it the matrix arguments and/or content operations.
|
|
842
1090
|
|
|
843
1091
|
When instantiating a `matrix` object, it always starts with identity matrix.
|
|
@@ -905,63 +1153,6 @@ You can set a `matrix`/`transform` on `area` directly to conveniently apply to a
|
|
|
905
1153
|
|
|
906
1154
|
Note that `area`, `path`, and nested shapes are all truly declarative, meaning they do not care about the ordering of calls to `fill`, `stroke`, and `transform`. Furthermore, any transform that is applied is reversed at the end of the block, so you never have to worry about the ordering of `transform` calls among different paths. You simply set a transform on the `path`s that need it and it is guaranteed to be called before all its content is drawn, and then undone afterwards to avoid affecting later paths. Matrix `transform` can be set on an entire `area` too, applying to all nested `path`s.
|
|
907
1155
|
|
|
908
|
-
`fill` and `stroke` accept [X11](https://en.wikipedia.org/wiki/X11_color_names) color `Symbol`s/`String`s like `:skyblue` and `'sandybrown'` or 6-char hex or 3-char hex-shorthand (as `Integer` or `String` with or without `0x` prefix)
|
|
909
|
-
|
|
910
|
-
Available [X11 colors](https://en.wikipedia.org/wiki/X11_color_names) can be obtained through `Glimmer::LibUI.x11_colors` method.
|
|
911
|
-
|
|
912
|
-
Check [Basic Transform](#basic-transform) example for use of [X11](https://en.wikipedia.org/wiki/X11_color_names) colors.
|
|
913
|
-
|
|
914
|
-
Check [Histogram](#histogram) example for use of hex colors.
|
|
915
|
-
|
|
916
|
-
To draw `text` in an `area`, you simply nest a `text(x, y, width)` control directly under `area` or inside a `on_draw` listener, and then nest attributed `string {[attributes]; string_value}` controls underneath it returning an actual `String` (think of them as the `<span>` or `<p>` element in html, which contains a string of text). Alternatively, you can nest attributed `string(string_value) {[attributes]}` if `string_value` is a short single-line string. An attributed `string` value can be changed dynamically via its `string` property.
|
|
917
|
-
|
|
918
|
-
`text` has the following properties:
|
|
919
|
-
- `default_font`:
|
|
920
|
-
- `align`: `:left` (default), `:center`, or `:right` (`align` currently seems not to work on the Mac)
|
|
921
|
-
- `x`: x coordinate in relation to parent `area` top-left corner
|
|
922
|
-
- `y`: y coordinate in relation to parent `area` top-left corner
|
|
923
|
-
- `width` (default: area width - x*2): width of text to display
|
|
924
|
-
|
|
925
|
-
`string` has the following properties:
|
|
926
|
-
- `font`: font descriptor hash consisting of `:family`, `:size`, `:weight` (`[:minimum, :thin, :ultra_light, :light, :book, :normal, :medium, :semi_bold, :bold, :ultra_bold, :heavy, :ultra_heavy, :maximum]`), `:italic` (`[:normal, :oblique, :italic]`), and `:stretch` (`[:ultra_condensed, :extra_condensed, :condensed, :semi_condensed, :normal, :semi_expanded, :expanded, :extra_expanded, :ultra_expanded]`) key values
|
|
927
|
-
- `color`: rgba, hex, or [X11](https://en.wikipedia.org/wiki/X11_color_names) color
|
|
928
|
-
- `background`: rgba, hex, or [X11](https://en.wikipedia.org/wiki/X11_color_names) color
|
|
929
|
-
- `underline`: one of `:none`, `:single`, `:double`, `:suggestion`, `:color_custom`, `:color_spelling`, `:color_grammar`, `:color_auxiliary`
|
|
930
|
-
- `underline_color`: one of `:spelling`, `:grammar`, `:auxiliary`, rgba, hex, or [X11](https://en.wikipedia.org/wiki/X11_color_names) color
|
|
931
|
-
- `open_type_features`: Open Type Features (https://www.microsoft.com/typography/otspec/featuretags.htm) consist of `open_type_tag`s nested in content block, which accept (`a`, `b`, `c`, `d`, `Integer`) arguments.
|
|
932
|
-
- `string`: string value (`String`)
|
|
933
|
-
|
|
934
|
-
Example (you may copy/paste in [`girb`](#girb-glimmer-irb)):
|
|
935
|
-
|
|
936
|
-
```ruby
|
|
937
|
-
window('area text drawing') {
|
|
938
|
-
area {
|
|
939
|
-
text {
|
|
940
|
-
default_font family: 'Helvetica', size: 12, weight: :normal, italic: :normal, stretch: :normal
|
|
941
|
-
|
|
942
|
-
string {
|
|
943
|
-
font family: 'Georgia', size: 13, weight: :medium, italic: :normal, stretch: :normal
|
|
944
|
-
color r: 230, g: 100, b: 50, a: 0.5
|
|
945
|
-
background r: 230, g: 200, b: 250, a: 0.8
|
|
946
|
-
underline :single
|
|
947
|
-
underline_color :spelling
|
|
948
|
-
open_type_features {
|
|
949
|
-
open_type_tag 'l', 'i', 'g', 'a', 0
|
|
950
|
-
open_type_tag 'l', 'i', 'g', 'a', 1
|
|
951
|
-
}
|
|
952
|
-
|
|
953
|
-
"This is a demonstration\n" \
|
|
954
|
-
"of a very long\n" \
|
|
955
|
-
"attributed string\n" \
|
|
956
|
-
"spanning multiple lines\n\n"
|
|
957
|
-
}
|
|
958
|
-
|
|
959
|
-
string('This is a short unattributed string')
|
|
960
|
-
}
|
|
961
|
-
}
|
|
962
|
-
}.show
|
|
963
|
-
```
|
|
964
|
-
|
|
965
1156
|
### Smart Defaults and Conventions
|
|
966
1157
|
|
|
967
1158
|
- `horizontal_box`, `vertical_box`, `grid`, and `form` controls have `padded` as `true` upon instantiation to ensure more user-friendly GUI by default
|
|
@@ -984,7 +1175,7 @@ window('area text drawing') {
|
|
|
984
1175
|
- When destroying a control nested under a `form`, it is automatically deleted from the form's children
|
|
985
1176
|
- When destroying a control nested under a `window` or `group`, it is automatically unset as their child to allow successful destruction
|
|
986
1177
|
- For `date_time_picker`, `date_picker`, and `time_picker`, make sure `time` hash values for `mon`, `wday`, and `yday` are 1-based instead of [libui](https://github.com/andlabs/libui) original 0-based values, and return `dst` as Boolean instead of `isdst` as `1`/`0`
|
|
987
|
-
- Smart defaults for `grid` child
|
|
1178
|
+
- Smart defaults for `grid` child properties are `left` (`0`), `top` (`0`), `xspan` (`1`), `yspan` (`1`), `hexpand` (`false`), `halign` (`:fill`), `vexpand` (`false`), and `valign` (`:fill`)
|
|
988
1179
|
- The `table` control automatically constructs required `TableModelHandler`, `TableModel`, and `TableParams`, calculating all their arguments from `cell_rows` and `editable` properties (e.g. `NumRows`) as well as nested columns (e.g. `text_column`)
|
|
989
1180
|
- Table model instances are automatically freed from memory after `window` is destroyed.
|
|
990
1181
|
- Table `cell_rows` data has implicit data-binding to table cell values for deletion, insertion, and change (done by diffing `cell_rows` value before and after change and auto-informing `table` of deletions [`LibUI.table_model_row_deleted`], insertions [`LibUI.table_model_row_deleted`], and changes [`LibUI.table_model_row_changed`]). When deleting data rows from `cell_rows` array, then actual rows from the `table` are automatically deleted. When inserting data rows into `cell_rows` array, then actual `table` rows are automatically inserted. When updating data rows in `cell_rows` array, then actual `table` rows are automatically updated.
|
|
@@ -1112,7 +1303,8 @@ window('Method-Based Custom Keyword') {
|
|
|
1112
1303
|
### API Gotchas
|
|
1113
1304
|
|
|
1114
1305
|
- There is no proper way to destroy `grid` children due to [libui](https://github.com/andlabs/libui) not offering any API for deleting them from `grid` (no `grid_delete` similar to `box_delete` for `horizontal_box` and `vertical_box`).
|
|
1115
|
-
- `table` `checkbox_column`
|
|
1306
|
+
- `table` `checkbox_column` checkbox editing only works on Linux and Windows (not Mac) due to a current limitation in [libui](https://github.com/andlabs/ui/issues/357).
|
|
1307
|
+
- `table` `checkbox_text_column` checkbox editing only works on Linux (not Mac or Windows) due to a current limitation in [libui](https://github.com/andlabs/ui/issues/357).
|
|
1116
1308
|
- `text` `align` property seems not to work on the Mac ([libui](https://github.com/andlabs/libui) has an [issue](https://github.com/andlabs/libui/pull/407) about it)
|
|
1117
1309
|
- `text` `string` `background` does not work on Windows due to an [issue in libui](https://github.com/andlabs/libui/issues/347).
|
|
1118
1310
|
- `table` controls on Windows intentionally get an extra empty row at the end because if any row were to be deleted for the first time, double-deletion happens due to an issue in [libui](https://github.com/andlabs/libui) on Windows.
|
|
@@ -1139,44 +1331,148 @@ For Linux, simply package your app as a [Ruby Gem](https://guides.rubygems.org/w
|
|
|
1139
1331
|
|
|
1140
1332
|
## Glimmer Style Guide
|
|
1141
1333
|
|
|
1142
|
-
- Control arguments are always wrapped by parentheses
|
|
1143
|
-
- Control blocks are always declared with curly braces to clearly visualize hierarchical view code and separate from logic code
|
|
1144
|
-
- Control property declarations always have arguments and never take a block
|
|
1145
|
-
- Control property arguments are never wrapped inside parentheses
|
|
1146
|
-
- Control listeners are always declared starting with on_ prefix and affixing listener event method name afterwards in underscored lowercase form. Their multi-line blocks have a `do; end` style.
|
|
1147
|
-
- Pure logic multi-line blocks that do not constitute GUI DSL view elements have `do; end` style to clearly separate logic code from view code.
|
|
1334
|
+
**1 - Control arguments are always wrapped by parentheses.**
|
|
1148
1335
|
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
The following examples include reimplementions of the examples in the [LibUI](https://github.com/kojix2/LibUI) project utilizing the [Glimmer GUI DSL](#glimmer-gui-dsl-concepts) as well as brand new examples.
|
|
1336
|
+
Example:
|
|
1152
1337
|
|
|
1153
|
-
|
|
1338
|
+
```ruby
|
|
1339
|
+
label('Name')
|
|
1340
|
+
```
|
|
1154
1341
|
|
|
1155
|
-
|
|
1342
|
+
**2 - Control blocks are always declared with curly braces to clearly visualize hierarchical view code and separate from logic code.**
|
|
1156
1343
|
|
|
1157
|
-
|
|
1344
|
+
Example:
|
|
1158
1345
|
|
|
1346
|
+
```ruby
|
|
1347
|
+
group('Basic Controls') {
|
|
1348
|
+
vertical_box {
|
|
1349
|
+
button('Button') {
|
|
1350
|
+
}
|
|
1351
|
+
}
|
|
1352
|
+
}
|
|
1159
1353
|
```
|
|
1160
|
-
|
|
1354
|
+
|
|
1355
|
+
**3 - Control property declarations always have arguments that are never wrapped inside parentheses and never take a block.**
|
|
1356
|
+
|
|
1357
|
+
Example:
|
|
1358
|
+
|
|
1359
|
+
```ruby
|
|
1360
|
+
spinbox(0, 100) {
|
|
1361
|
+
stretchy false
|
|
1362
|
+
value 42
|
|
1363
|
+
}
|
|
1161
1364
|
```
|
|
1162
1365
|
|
|
1163
|
-
|
|
1366
|
+
**4 - Control listeners are always declared starting with on_ prefix and affixing listener event method name afterwards in underscored lowercase form. Their multi-line blocks have a `do; end` style.**
|
|
1367
|
+
|
|
1368
|
+
Example:
|
|
1369
|
+
|
|
1370
|
+
```ruby
|
|
1371
|
+
button('Click') {
|
|
1372
|
+
on_clicked do
|
|
1373
|
+
msg_box('Information', 'You clicked the button')
|
|
1374
|
+
end
|
|
1375
|
+
}
|
|
1376
|
+
```
|
|
1377
|
+
|
|
1378
|
+
**5 - Iterator multi-line blocks always have `do; end` style to clearly separate logic code from view code.**
|
|
1164
1379
|
|
|
1380
|
+
Example:
|
|
1381
|
+
|
|
1382
|
+
```ruby
|
|
1383
|
+
@field_hash.keys.each do |field|
|
|
1384
|
+
label(field) {
|
|
1385
|
+
stretchy false
|
|
1386
|
+
}
|
|
1387
|
+
|
|
1388
|
+
entry {
|
|
1389
|
+
on_changed do |control|
|
|
1390
|
+
@field_hash[field] = control.text
|
|
1391
|
+
end
|
|
1392
|
+
}
|
|
1393
|
+
end
|
|
1165
1394
|
```
|
|
1166
|
-
|
|
1395
|
+
|
|
1396
|
+
**6 - In a widget's content block, attributes are declared first, with layout management attributes on top (e.g. `stretchy false`); an empty line separates attributes from nested widgets and listeners following afterwards.**
|
|
1397
|
+
|
|
1398
|
+
Example:
|
|
1399
|
+
|
|
1400
|
+
```ruby
|
|
1401
|
+
group('Numbers') {
|
|
1402
|
+
stretchy false
|
|
1403
|
+
|
|
1404
|
+
vertical_box {
|
|
1405
|
+
spinbox(0, 100) {
|
|
1406
|
+
stretchy false
|
|
1407
|
+
value 42
|
|
1408
|
+
|
|
1409
|
+
on_changed do |s|
|
|
1410
|
+
puts "New Spinbox value: #{s.value}"
|
|
1411
|
+
$stdout.flush # for Windows
|
|
1412
|
+
end
|
|
1413
|
+
}
|
|
1414
|
+
}
|
|
1415
|
+
}
|
|
1416
|
+
```
|
|
1417
|
+
|
|
1418
|
+
**7 - Unlike attributes, nested widgets with a content block and listeners are always separated from each other by an empty line to make readability easier except where it helps to group two widgets together (e.g. label and described entry).**
|
|
1419
|
+
|
|
1420
|
+
Example:
|
|
1421
|
+
|
|
1422
|
+
```ruby
|
|
1423
|
+
area {
|
|
1424
|
+
path { # needs an empty line afterwards
|
|
1425
|
+
square(0, 0, 100) # does not have a content block, so no empty line is needed
|
|
1426
|
+
square(100, 100, 400) # does not have a content block, so no empty line is needed
|
|
1427
|
+
|
|
1428
|
+
fill r: 102, g: 102, b: 204
|
|
1429
|
+
}
|
|
1430
|
+
|
|
1431
|
+
path { # needs an empty line afterwards
|
|
1432
|
+
rectangle(0, 100, 100, 400) # does not have a content block, so no empty line is needed
|
|
1433
|
+
rectangle(100, 0, 400, 100) # does not have a content block, so no empty line is needed
|
|
1434
|
+
|
|
1435
|
+
fill x0: 10, y0: 10, x1: 350, y1: 350, stops: [{pos: 0.25, r: 204, g: 102, b: 204}, {pos: 0.75, r: 102, g: 102, b: 204}]
|
|
1436
|
+
}
|
|
1437
|
+
|
|
1438
|
+
polygon(100, 100, 100, 400, 400, 100, 400, 400) { # needs an empty line afterwards
|
|
1439
|
+
fill r: 202, g: 102, b: 104, a: 0.5 # attributes do not need an empty line separator
|
|
1440
|
+
stroke r: 0, g: 0, b: 0 # attributes do not need an empty line separator
|
|
1441
|
+
}
|
|
1442
|
+
|
|
1443
|
+
on_mouse_up do |area_mouse_event| # needs an empty line afterwards
|
|
1444
|
+
puts 'mouse up'
|
|
1445
|
+
end
|
|
1446
|
+
|
|
1447
|
+
on_key_up do |area_key_event| # needs an empty line afterwards
|
|
1448
|
+
puts 'key up'
|
|
1449
|
+
end
|
|
1450
|
+
}
|
|
1167
1451
|
```
|
|
1168
1452
|
|
|
1169
|
-
|
|
1453
|
+
## Examples
|
|
1454
|
+
|
|
1455
|
+
The following examples include reimplementions of the examples in the [LibUI](https://github.com/kojix2/LibUI) project utilizing the [Glimmer GUI DSL](#glimmer-gui-dsl-concepts) as well as brand new examples.
|
|
1456
|
+
|
|
1457
|
+
To browse all examples, simply launch the [Meta-Example](examples/meta_example.rb), which lists all examples and displays each example's code when selected. It also enables code editing to facilitate experimentation and learning.
|
|
1458
|
+
|
|
1459
|
+
[examples/meta_example.rb](examples/meta_example.rb)
|
|
1170
1460
|
|
|
1171
|
-
|
|
1461
|
+
Run with this command from the root of the project if you cloned the project:
|
|
1172
1462
|
|
|
1173
|
-
|
|
1463
|
+
```
|
|
1464
|
+
ruby -r './lib/glimmer-dsl-libui' examples/meta_example.rb
|
|
1465
|
+
```
|
|
1174
1466
|
|
|
1175
|
-
|
|
1467
|
+
Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/glimmer-dsl-libui):
|
|
1176
1468
|
|
|
1177
|
-
|
|
1469
|
+
```
|
|
1470
|
+
ruby -r glimmer-dsl-libui -e "require 'examples/meta_example'"
|
|
1471
|
+
```
|
|
1178
1472
|
|
|
1179
|
-
|
|
1473
|
+
Mac | Windows | Linux
|
|
1474
|
+
----|---------|------
|
|
1475
|
+
 |  | 
|
|
1180
1476
|
|
|
1181
1477
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
1182
1478
|
|
|
@@ -1334,17 +1630,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
1334
1630
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_window'"
|
|
1335
1631
|
```
|
|
1336
1632
|
|
|
1337
|
-
Mac
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
Windows
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
Linux
|
|
1346
|
-
|
|
1347
|
-
|
|
1633
|
+
Mac | Windows | Linux
|
|
1634
|
+
----|---------|------
|
|
1635
|
+
 |  | 
|
|
1348
1636
|
|
|
1349
1637
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
1350
1638
|
|
|
@@ -1417,20 +1705,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
1417
1705
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_button'"
|
|
1418
1706
|
```
|
|
1419
1707
|
|
|
1420
|
-
Mac
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
Windows
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1429
|
-
|
|
1430
|
-
Linux
|
|
1431
|
-
|
|
1432
|
-
|
|
1433
|
-
|
|
1708
|
+
Mac | Windows | Linux
|
|
1709
|
+
----|---------|------
|
|
1710
|
+
  |   |  
|
|
1434
1711
|
|
|
1435
1712
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
1436
1713
|
|
|
@@ -1499,20 +1776,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
1499
1776
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_entry'"
|
|
1500
1777
|
```
|
|
1501
1778
|
|
|
1502
|
-
Mac
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
Windows
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
Linux
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1779
|
+
Mac | Windows | Linux
|
|
1780
|
+
----|---------|------
|
|
1781
|
+
  |   |  
|
|
1516
1782
|
|
|
1517
1783
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
1518
1784
|
|
|
@@ -1605,17 +1871,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
1605
1871
|
ruby -r glimmer-dsl-libui -e "require 'examples/simple_notepad'"
|
|
1606
1872
|
```
|
|
1607
1873
|
|
|
1608
|
-
Mac
|
|
1609
|
-
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
Windows
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1616
|
-
Linux
|
|
1617
|
-
|
|
1618
|
-
|
|
1874
|
+
Mac | Windows | Linux
|
|
1875
|
+
----|---------|------
|
|
1876
|
+
 |  | 
|
|
1619
1877
|
|
|
1620
1878
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
1621
1879
|
|
|
@@ -1681,20 +1939,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
1681
1939
|
ruby -r glimmer-dsl-libui -e "require 'examples/midi_player'"
|
|
1682
1940
|
```
|
|
1683
1941
|
|
|
1684
|
-
Mac
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
Windows
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
Linux
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1942
|
+
Mac | Windows | Linux
|
|
1943
|
+
----|---------|------
|
|
1944
|
+
  |   |  
|
|
1698
1945
|
|
|
1699
1946
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
1700
1947
|
|
|
@@ -1762,11 +2009,11 @@ class TinyMidiPlayer
|
|
|
1762
2009
|
|
|
1763
2010
|
UI.new_horizontal_box.tap do |hbox|
|
|
1764
2011
|
UI.new_vertical_box.tap do |vbox|
|
|
1765
|
-
UI.new_button('âÃÃâ€
|
|
2012
|
+
UI.new_button('â–¶').tap do |button1|
|
|
1766
2013
|
UI.button_on_clicked(button1) { play_midi }
|
|
1767
2014
|
UI.box_append(vbox, button1, 1)
|
|
1768
2015
|
end
|
|
1769
|
-
UI.new_button('âÃÃâ€
|
|
2016
|
+
UI.new_button('â– ').tap do |button2|
|
|
1770
2017
|
UI.button_on_clicked(button2) { stop_midi }
|
|
1771
2018
|
UI.box_append(vbox, button2, 1)
|
|
1772
2019
|
end
|
|
@@ -1860,12 +2107,12 @@ class TinyMidiPlayer
|
|
|
1860
2107
|
vertical_box {
|
|
1861
2108
|
stretchy false
|
|
1862
2109
|
|
|
1863
|
-
button('âÃÃâ€
|
|
2110
|
+
button('â–¶') {
|
|
1864
2111
|
on_clicked do
|
|
1865
2112
|
play_midi
|
|
1866
2113
|
end
|
|
1867
2114
|
}
|
|
1868
|
-
button('âÃÃâ€
|
|
2115
|
+
button('â– ') {
|
|
1869
2116
|
on_clicked do
|
|
1870
2117
|
stop_midi
|
|
1871
2118
|
end
|
|
@@ -1904,17 +2151,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
1904
2151
|
ruby -r glimmer-dsl-libui -e "require 'examples/control_gallery'"
|
|
1905
2152
|
```
|
|
1906
2153
|
|
|
1907
|
-
Mac
|
|
1908
|
-
|
|
1909
|
-
|
|
1910
|
-
|
|
1911
|
-
Windows
|
|
1912
|
-
|
|
1913
|
-
|
|
1914
|
-
|
|
1915
|
-
Linux
|
|
1916
|
-
|
|
1917
|
-
|
|
2154
|
+
Mac | Windows | Linux
|
|
2155
|
+
----|---------|------
|
|
2156
|
+
 |  | 
|
|
1918
2157
|
|
|
1919
2158
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
1920
2159
|
|
|
@@ -2298,20 +2537,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2298
2537
|
ruby -r glimmer-dsl-libui -e "require 'examples/font_button'"
|
|
2299
2538
|
```
|
|
2300
2539
|
|
|
2301
|
-
Mac
|
|
2302
|
-
|
|
2303
|
-
|
|
2304
|
-
|
|
2305
|
-
|
|
2306
|
-
Windows
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
Linux
|
|
2312
|
-
|
|
2313
|
-
|
|
2314
|
-
|
|
2540
|
+
Mac | Windows | Linux
|
|
2541
|
+
----|---------|------
|
|
2542
|
+
  |   |  
|
|
2315
2543
|
|
|
2316
2544
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
2317
2545
|
|
|
@@ -2387,20 +2615,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2387
2615
|
ruby -r glimmer-dsl-libui -e "require 'examples/color_button'"
|
|
2388
2616
|
```
|
|
2389
2617
|
|
|
2390
|
-
Mac
|
|
2391
|
-
|
|
2392
|
-
|
|
2393
|
-
|
|
2394
|
-
|
|
2395
|
-
Windows
|
|
2396
|
-
|
|
2397
|
-
|
|
2398
|
-
|
|
2399
|
-
|
|
2400
|
-
Linux
|
|
2401
|
-
|
|
2402
|
-
|
|
2403
|
-
|
|
2618
|
+
Mac | Windows | Linux
|
|
2619
|
+
----|---------|------
|
|
2620
|
+
  |   |  
|
|
2404
2621
|
|
|
2405
2622
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
2406
2623
|
|
|
@@ -2437,17 +2654,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2437
2654
|
ruby -r glimmer-dsl-libui -e "require 'examples/date_time_picker'"
|
|
2438
2655
|
```
|
|
2439
2656
|
|
|
2440
|
-
Mac
|
|
2441
|
-
|
|
2442
|
-
|
|
2443
|
-
|
|
2444
|
-
Windows
|
|
2445
|
-
|
|
2446
|
-
|
|
2447
|
-
|
|
2448
|
-
Linux
|
|
2449
|
-
|
|
2450
|
-
|
|
2657
|
+
Mac | Windows | Linux
|
|
2658
|
+
----|---------|------
|
|
2659
|
+
 |  | 
|
|
2451
2660
|
|
|
2452
2661
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
2453
2662
|
|
|
@@ -2531,23 +2740,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2531
2740
|
ruby -r glimmer-dsl-libui -e "require 'examples/grid'"
|
|
2532
2741
|
```
|
|
2533
2742
|
|
|
2534
|
-
Mac
|
|
2535
|
-
|
|
2536
|
-
|
|
2537
|
-
|
|
2538
|
-
|
|
2539
|
-
|
|
2540
|
-
Windows
|
|
2541
|
-
|
|
2542
|
-
|
|
2543
|
-
|
|
2544
|
-
|
|
2545
|
-
|
|
2546
|
-
Linux
|
|
2547
|
-
|
|
2548
|
-
|
|
2549
|
-
|
|
2550
|
-
|
|
2743
|
+
Mac | Windows | Linux
|
|
2744
|
+
----|---------|------
|
|
2745
|
+
   |    |   
|
|
2551
2746
|
|
|
2552
2747
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
2553
2748
|
|
|
@@ -2560,16 +2755,16 @@ window('Grid') {
|
|
|
2560
2755
|
tab {
|
|
2561
2756
|
tab_item('Span') {
|
|
2562
2757
|
grid {
|
|
2563
|
-
4.times
|
|
2564
|
-
4.times
|
|
2758
|
+
4.times do |top_value|
|
|
2759
|
+
4.times do |left_value|
|
|
2565
2760
|
label("(#{left_value}, #{top_value}) xspan1\nyspan1") {
|
|
2566
2761
|
left left_value
|
|
2567
2762
|
top top_value
|
|
2568
2763
|
hexpand true
|
|
2569
2764
|
vexpand true
|
|
2570
2765
|
}
|
|
2571
|
-
|
|
2572
|
-
|
|
2766
|
+
end
|
|
2767
|
+
end
|
|
2573
2768
|
label("(0, 4) xspan2\nyspan1 more text fits horizontally") {
|
|
2574
2769
|
left 0
|
|
2575
2770
|
top 4
|
|
@@ -2676,20 +2871,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2676
2871
|
ruby -r glimmer-dsl-libui -e "require 'examples/form'"
|
|
2677
2872
|
```
|
|
2678
2873
|
|
|
2679
|
-
Mac
|
|
2680
|
-
|
|
2681
|
-
|
|
2682
|
-
|
|
2683
|
-
|
|
2684
|
-
Windows
|
|
2685
|
-
|
|
2686
|
-
|
|
2687
|
-
|
|
2688
|
-
|
|
2689
|
-
Linux
|
|
2690
|
-
|
|
2691
|
-
|
|
2692
|
-
|
|
2874
|
+
Mac | Windows | Linux
|
|
2875
|
+
----|---------|------
|
|
2876
|
+
  |   |  
|
|
2693
2877
|
|
|
2694
2878
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
2695
2879
|
|
|
@@ -2747,17 +2931,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2747
2931
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table'"
|
|
2748
2932
|
```
|
|
2749
2933
|
|
|
2750
|
-
Mac
|
|
2751
|
-
|
|
2752
|
-
|
|
2753
|
-
|
|
2754
|
-
Windows
|
|
2755
|
-
|
|
2756
|
-
|
|
2757
|
-
|
|
2758
|
-
Linux
|
|
2759
|
-
|
|
2760
|
-
|
|
2934
|
+
Mac | Windows | Linux
|
|
2935
|
+
----|---------|------
|
|
2936
|
+
 |  | 
|
|
2761
2937
|
|
|
2762
2938
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
2763
2939
|
|
|
@@ -2871,23 +3047,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2871
3047
|
ruby -r glimmer-dsl-libui -e "require 'examples/editable_table'"
|
|
2872
3048
|
```
|
|
2873
3049
|
|
|
2874
|
-
Mac
|
|
2875
|
-
|
|
2876
|
-
|
|
2877
|
-
|
|
2878
|
-
|
|
2879
|
-
|
|
2880
|
-
Windows
|
|
2881
|
-
|
|
2882
|
-
|
|
2883
|
-
|
|
2884
|
-
|
|
2885
|
-
|
|
2886
|
-
Linux
|
|
2887
|
-
|
|
2888
|
-
|
|
2889
|
-
|
|
2890
|
-
|
|
3050
|
+
Mac | Windows | Linux
|
|
3051
|
+
----|---------|------
|
|
3052
|
+
   |    |   
|
|
2891
3053
|
|
|
2892
3054
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
2893
3055
|
|
|
@@ -2945,20 +3107,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
2945
3107
|
ruby -r glimmer-dsl-libui -e "require 'examples/editable_column_table'"
|
|
2946
3108
|
```
|
|
2947
3109
|
|
|
2948
|
-
Mac
|
|
2949
|
-
|
|
2950
|
-
|
|
2951
|
-
|
|
2952
|
-
|
|
2953
|
-
Windows
|
|
2954
|
-
|
|
2955
|
-
|
|
2956
|
-
|
|
2957
|
-
|
|
2958
|
-
Linux
|
|
2959
|
-
|
|
2960
|
-
|
|
2961
|
-
|
|
3110
|
+
Mac | Windows | Linux
|
|
3111
|
+
----|---------|------
|
|
3112
|
+
  |   |  
|
|
2962
3113
|
|
|
2963
3114
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
2964
3115
|
|
|
@@ -2996,13 +3147,7 @@ window('Editable column animal sounds', 400, 200) {
|
|
|
2996
3147
|
|
|
2997
3148
|
### Basic Table Image
|
|
2998
3149
|
|
|
2999
|
-
|
|
3000
|
-
|
|
3001
|
-
```
|
|
3002
|
-
gem install chunky_png -v1.4.0
|
|
3003
|
-
```
|
|
3004
|
-
|
|
3005
|
-
Also, note that behavior varies per platform (i.e. how `table` chooses to size images by default).
|
|
3150
|
+
Note that behavior varies per platform (i.e. how `table` chooses to size images by default).
|
|
3006
3151
|
|
|
3007
3152
|
[examples/basic_table_image.rb](examples/basic_table_image.rb)
|
|
3008
3153
|
|
|
@@ -3018,17 +3163,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3018
3163
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table_image'"
|
|
3019
3164
|
```
|
|
3020
3165
|
|
|
3021
|
-
Mac
|
|
3022
|
-
|
|
3023
|
-
|
|
3024
|
-
|
|
3025
|
-
Windows
|
|
3026
|
-
|
|
3027
|
-
|
|
3028
|
-
|
|
3029
|
-
Linux
|
|
3030
|
-
|
|
3031
|
-
|
|
3166
|
+
Mac | Windows | Linux
|
|
3167
|
+
----|---------|------
|
|
3168
|
+
 |  | 
|
|
3032
3169
|
|
|
3033
3170
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
3034
3171
|
|
|
@@ -3116,6 +3253,41 @@ UI.quit
|
|
|
3116
3253
|
# NOTE:
|
|
3117
3254
|
# This example displays images that can be freely downloaded from the Studio Ghibli website.
|
|
3118
3255
|
|
|
3256
|
+
require 'glimmer-dsl-libui'
|
|
3257
|
+
|
|
3258
|
+
include Glimmer
|
|
3259
|
+
|
|
3260
|
+
IMAGE_ROWS = []
|
|
3261
|
+
|
|
3262
|
+
50.times do |i|
|
|
3263
|
+
url = format('https://www.ghibli.jp/gallery/thumb-redturtle%03d.png', (i + 1))
|
|
3264
|
+
puts "Processing Image: #{url}"; $stdout.flush # for Windows
|
|
3265
|
+
IMAGE_ROWS << [image(url)] # array of one column cell
|
|
3266
|
+
rescue StandardError => e
|
|
3267
|
+
warn url, e.message
|
|
3268
|
+
end
|
|
3269
|
+
|
|
3270
|
+
window('The Red Turtle', 310, 350, false) {
|
|
3271
|
+
horizontal_box {
|
|
3272
|
+
table {
|
|
3273
|
+
image_column('www.ghibli.jp/works/red-turtle')
|
|
3274
|
+
|
|
3275
|
+
cell_rows IMAGE_ROWS
|
|
3276
|
+
}
|
|
3277
|
+
}
|
|
3278
|
+
|
|
3279
|
+
on_closing do
|
|
3280
|
+
puts 'Bye Bye'
|
|
3281
|
+
end
|
|
3282
|
+
}.show
|
|
3283
|
+
```
|
|
3284
|
+
|
|
3285
|
+
[Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 2 (manual construction of `image` from `image_part`):
|
|
3286
|
+
|
|
3287
|
+
```ruby
|
|
3288
|
+
# NOTE:
|
|
3289
|
+
# This example displays images that can be freely downloaded from the Studio Ghibli website.
|
|
3290
|
+
|
|
3119
3291
|
require 'glimmer-dsl-libui'
|
|
3120
3292
|
require 'chunky_png'
|
|
3121
3293
|
require 'open-uri'
|
|
@@ -3158,13 +3330,7 @@ window('The Red Turtle', 310, 350, false) {
|
|
|
3158
3330
|
|
|
3159
3331
|
### Basic Table Image Text
|
|
3160
3332
|
|
|
3161
|
-
|
|
3162
|
-
|
|
3163
|
-
```
|
|
3164
|
-
gem install chunky_png -v1.4.0
|
|
3165
|
-
```
|
|
3166
|
-
|
|
3167
|
-
Also, note that behavior varies per platform (i.e. how `table` chooses to size images by default).
|
|
3333
|
+
Note that behavior varies per platform (i.e. how `table` chooses to size images by default).
|
|
3168
3334
|
|
|
3169
3335
|
[examples/basic_table_image_text.rb](examples/basic_table_image_text.rb)
|
|
3170
3336
|
|
|
@@ -3180,19 +3346,47 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3180
3346
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table_image_text'"
|
|
3181
3347
|
```
|
|
3182
3348
|
|
|
3183
|
-
Mac
|
|
3349
|
+
Mac | Windows | Linux
|
|
3350
|
+
----|---------|------
|
|
3351
|
+
 |  | 
|
|
3184
3352
|
|
|
3185
|
-
|
|
3353
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3186
3354
|
|
|
3187
|
-
|
|
3355
|
+
```ruby
|
|
3356
|
+
# NOTE:
|
|
3357
|
+
# This example displays images that can be freely downloaded from the Studio Ghibli website.
|
|
3188
3358
|
|
|
3189
|
-
|
|
3359
|
+
require 'glimmer-dsl-libui'
|
|
3190
3360
|
|
|
3191
|
-
|
|
3361
|
+
include Glimmer
|
|
3192
3362
|
|
|
3193
|
-
|
|
3363
|
+
IMAGE_ROWS = []
|
|
3194
3364
|
|
|
3195
|
-
|
|
3365
|
+
5.times do |i|
|
|
3366
|
+
url = format('https://www.ghibli.jp/gallery/thumb-redturtle%03d.png', (i + 1))
|
|
3367
|
+
puts "Processing Image: #{url}"; $stdout.flush # for Windows
|
|
3368
|
+
text = url.sub('https://www.ghibli.jp/gallery/thumb-redturtle', '').sub('.png', '')
|
|
3369
|
+
img = image(url)
|
|
3370
|
+
IMAGE_ROWS << [[img, text], [img, text]] # cell values are dual-element arrays
|
|
3371
|
+
rescue StandardError => e
|
|
3372
|
+
warn url, e.message
|
|
3373
|
+
end
|
|
3374
|
+
|
|
3375
|
+
window('The Red Turtle', 670, 350) {
|
|
3376
|
+
horizontal_box {
|
|
3377
|
+
table {
|
|
3378
|
+
image_text_column('image/number')
|
|
3379
|
+
image_text_column('image/number (editable)') {
|
|
3380
|
+
editable true
|
|
3381
|
+
}
|
|
3382
|
+
|
|
3383
|
+
cell_rows IMAGE_ROWS
|
|
3384
|
+
}
|
|
3385
|
+
}
|
|
3386
|
+
}.show
|
|
3387
|
+
```
|
|
3388
|
+
|
|
3389
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 2 (manual construction of `image` from `image_part`):
|
|
3196
3390
|
|
|
3197
3391
|
```ruby
|
|
3198
3392
|
# NOTE:
|
|
@@ -3254,20 +3448,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3254
3448
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table_button'"
|
|
3255
3449
|
```
|
|
3256
3450
|
|
|
3257
|
-
Mac
|
|
3258
|
-
|
|
3259
|
-
|
|
3260
|
-
|
|
3261
|
-
|
|
3262
|
-
Windows
|
|
3263
|
-
|
|
3264
|
-
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
Linux
|
|
3268
|
-
|
|
3269
|
-
|
|
3270
|
-
|
|
3451
|
+
Mac | Windows | Linux
|
|
3452
|
+
----|---------|------
|
|
3453
|
+
  |   |  
|
|
3271
3454
|
|
|
3272
3455
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3273
3456
|
|
|
@@ -3321,17 +3504,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3321
3504
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table_checkbox'"
|
|
3322
3505
|
```
|
|
3323
3506
|
|
|
3324
|
-
Mac
|
|
3325
|
-
|
|
3326
|
-
|
|
3327
|
-
|
|
3328
|
-
Windows
|
|
3329
|
-
|
|
3330
|
-
|
|
3331
|
-
|
|
3332
|
-
Linux
|
|
3333
|
-
|
|
3334
|
-
|
|
3507
|
+
Mac | Windows | Linux
|
|
3508
|
+
----|---------|------
|
|
3509
|
+
 |  | 
|
|
3335
3510
|
|
|
3336
3511
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3337
3512
|
|
|
@@ -3377,17 +3552,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3377
3552
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table_checkbox_text'"
|
|
3378
3553
|
```
|
|
3379
3554
|
|
|
3380
|
-
Mac
|
|
3381
|
-
|
|
3382
|
-
|
|
3383
|
-
|
|
3384
|
-
Windows
|
|
3385
|
-
|
|
3386
|
-
|
|
3387
|
-
|
|
3388
|
-
Linux
|
|
3389
|
-
|
|
3390
|
-
|
|
3555
|
+
Mac | Windows | Linux
|
|
3556
|
+
----|---------|------
|
|
3557
|
+
 |  | 
|
|
3391
3558
|
|
|
3392
3559
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3393
3560
|
|
|
@@ -3433,17 +3600,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3433
3600
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table_progress_bar'"
|
|
3434
3601
|
```
|
|
3435
3602
|
|
|
3436
|
-
Mac
|
|
3437
|
-
|
|
3438
|
-
|
|
3439
|
-
|
|
3440
|
-
Windows
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
Linux
|
|
3445
|
-
|
|
3446
|
-
|
|
3603
|
+
Mac | Windows | Linux
|
|
3604
|
+
----|---------|------
|
|
3605
|
+
 |  | 
|
|
3447
3606
|
|
|
3448
3607
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3449
3608
|
|
|
@@ -3484,12 +3643,6 @@ window('Task Progress', 300, 200) {
|
|
|
3484
3643
|
|
|
3485
3644
|
### Basic Table Color
|
|
3486
3645
|
|
|
3487
|
-
This example requires pre-installing `chunky_png` Ruby gem:
|
|
3488
|
-
|
|
3489
|
-
```
|
|
3490
|
-
gem install chunky_png -v1.4.0
|
|
3491
|
-
```
|
|
3492
|
-
|
|
3493
3646
|
[examples/basic_table_color.rb](examples/basic_table_color.rb)
|
|
3494
3647
|
|
|
3495
3648
|
Run with this command from the root of the project if you cloned the project:
|
|
@@ -3504,19 +3657,45 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3504
3657
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_table_color'"
|
|
3505
3658
|
```
|
|
3506
3659
|
|
|
3507
|
-
Mac
|
|
3660
|
+
Mac | Windows | Linux
|
|
3661
|
+
----|---------|------
|
|
3662
|
+
 |  | 
|
|
3508
3663
|
|
|
3509
|
-
|
|
3664
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3510
3665
|
|
|
3511
|
-
|
|
3666
|
+
```ruby
|
|
3667
|
+
# frozen_string_literal: true
|
|
3512
3668
|
|
|
3513
|
-
|
|
3669
|
+
require 'glimmer-dsl-libui'
|
|
3514
3670
|
|
|
3515
|
-
|
|
3671
|
+
include Glimmer
|
|
3516
3672
|
|
|
3517
|
-
|
|
3673
|
+
img = image(File.expand_path('../icons/glimmer.png', __dir__), 24, 24)
|
|
3518
3674
|
|
|
3519
|
-
|
|
3675
|
+
data = [
|
|
3676
|
+
[['cat', :red] , ['meow', :blue] , [true, 'mammal', :green], [img, 'Glimmer', :dark_blue], {r: 255, g: 120, b: 0, a: 0.5}],
|
|
3677
|
+
[['dog', :yellow] , ['woof', {r: 240, g: 32, b: 32}] , [true, 'mammal', :green], [img, 'Glimmer', :dark_blue], :skyblue],
|
|
3678
|
+
[['chicken', :beige], ['cock-a-doodle-doo', :blue] , [false, 'mammal', :red] , [img, 'Glimmer', :beige], {r: 5, g: 120, b: 110}],
|
|
3679
|
+
[['horse', :purple] , ['neigh', {r: 240, g: 32, b: 32}], [true, 'mammal', :green], [img, 'Glimmer', :dark_blue], '13a1fb'],
|
|
3680
|
+
[['cow', :gray] , ['moo', :blue] , [true, 'mammal', :green], [img, 'Glimmer', :brown], 0x12ff02]
|
|
3681
|
+
]
|
|
3682
|
+
|
|
3683
|
+
window('Animals', 500, 200) {
|
|
3684
|
+
horizontal_box {
|
|
3685
|
+
table {
|
|
3686
|
+
text_color_column('Animal')
|
|
3687
|
+
text_color_column('Sound')
|
|
3688
|
+
checkbox_text_color_column('Description')
|
|
3689
|
+
image_text_color_column('GUI')
|
|
3690
|
+
background_color_column('Mammal')
|
|
3691
|
+
|
|
3692
|
+
cell_rows data
|
|
3693
|
+
}
|
|
3694
|
+
}
|
|
3695
|
+
}.show
|
|
3696
|
+
```
|
|
3697
|
+
|
|
3698
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 2 (manual construction of [libui](https://github.com/andlabs/libui) `image` from `image_part`):
|
|
3520
3699
|
|
|
3521
3700
|
```ruby
|
|
3522
3701
|
require 'glimmer-dsl-libui'
|
|
@@ -3574,23 +3753,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3574
3753
|
ruby -r glimmer-dsl-libui -e "require 'examples/form_table'"
|
|
3575
3754
|
```
|
|
3576
3755
|
|
|
3577
|
-
Mac
|
|
3578
|
-
|
|
3579
|
-
|
|
3580
|
-
|
|
3581
|
-
|
|
3582
|
-
|
|
3583
|
-
Windows
|
|
3584
|
-
|
|
3585
|
-
|
|
3586
|
-
|
|
3587
|
-
|
|
3588
|
-
|
|
3589
|
-
Linux
|
|
3590
|
-
|
|
3591
|
-
|
|
3592
|
-
|
|
3593
|
-
|
|
3756
|
+
Mac | Windows | Linux
|
|
3757
|
+
----|---------|------
|
|
3758
|
+
   |    |   
|
|
3594
3759
|
|
|
3595
3760
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3596
3761
|
|
|
@@ -3617,15 +3782,19 @@ window('Contacts', 600, 600) { |w|
|
|
|
3617
3782
|
@name_entry = entry {
|
|
3618
3783
|
label 'Name'
|
|
3619
3784
|
}
|
|
3785
|
+
|
|
3620
3786
|
@email_entry = entry {
|
|
3621
3787
|
label 'Email'
|
|
3622
3788
|
}
|
|
3789
|
+
|
|
3623
3790
|
@phone_entry = entry {
|
|
3624
3791
|
label 'Phone'
|
|
3625
3792
|
}
|
|
3793
|
+
|
|
3626
3794
|
@city_entry = entry {
|
|
3627
3795
|
label 'City'
|
|
3628
3796
|
}
|
|
3797
|
+
|
|
3629
3798
|
@state_entry = entry {
|
|
3630
3799
|
label 'State'
|
|
3631
3800
|
}
|
|
@@ -3702,17 +3871,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3702
3871
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_area'"
|
|
3703
3872
|
```
|
|
3704
3873
|
|
|
3705
|
-
Mac
|
|
3706
|
-
|
|
3707
|
-
|
|
3708
|
-
|
|
3709
|
-
Windows
|
|
3710
|
-
|
|
3711
|
-
|
|
3712
|
-
|
|
3713
|
-
Linux
|
|
3714
|
-
|
|
3715
|
-
|
|
3874
|
+
Mac | Windows | Linux
|
|
3875
|
+
----|---------|------
|
|
3876
|
+
 |  | 
|
|
3716
3877
|
|
|
3717
3878
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
3718
3879
|
|
|
@@ -3828,20 +3989,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
3828
3989
|
ruby -r glimmer-dsl-libui -e "require 'examples/dynamic_area'"
|
|
3829
3990
|
```
|
|
3830
3991
|
|
|
3831
|
-
Mac
|
|
3832
|
-
|
|
3833
|
-
|
|
3834
|
-
|
|
3835
|
-
|
|
3836
|
-
Windows
|
|
3837
|
-
|
|
3838
|
-
|
|
3839
|
-
|
|
3840
|
-
|
|
3841
|
-
Linux
|
|
3842
|
-
|
|
3843
|
-
|
|
3844
|
-
|
|
3992
|
+
Mac | Windows | Linux
|
|
3993
|
+
----|---------|------
|
|
3994
|
+
  |   |  
|
|
3845
3995
|
|
|
3846
3996
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
3847
3997
|
|
|
@@ -3850,7 +4000,7 @@ require 'glimmer-dsl-libui'
|
|
|
3850
4000
|
|
|
3851
4001
|
include Glimmer
|
|
3852
4002
|
|
|
3853
|
-
window('Dynamic Area', 240,
|
|
4003
|
+
window('Dynamic Area', 240, 600) {
|
|
3854
4004
|
margined true
|
|
3855
4005
|
|
|
3856
4006
|
vertical_box {
|
|
@@ -3936,9 +4086,7 @@ window('Dynamic Area', 240, 500) {
|
|
|
3936
4086
|
|
|
3937
4087
|
@area = area {
|
|
3938
4088
|
on_draw do |area_draw_params|
|
|
3939
|
-
|
|
3940
|
-
rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value)
|
|
3941
|
-
|
|
4089
|
+
rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value) { # a dynamic path is added semi-declaratively inside on_draw block
|
|
3942
4090
|
fill r: @red_spinbox.value, g: @green_spinbox.value, b: @blue_spinbox.value, a: @alpha_spinbox.value / 100.0
|
|
3943
4091
|
}
|
|
3944
4092
|
end
|
|
@@ -4006,7 +4154,7 @@ window('Dynamic Area', 240, 600) {
|
|
|
4006
4154
|
value 102
|
|
4007
4155
|
|
|
4008
4156
|
on_changed do
|
|
4009
|
-
@
|
|
4157
|
+
@rectangle.fill[:r] = @red_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
|
|
4010
4158
|
end
|
|
4011
4159
|
}
|
|
4012
4160
|
|
|
@@ -4015,7 +4163,7 @@ window('Dynamic Area', 240, 600) {
|
|
|
4015
4163
|
value 102
|
|
4016
4164
|
|
|
4017
4165
|
on_changed do
|
|
4018
|
-
@
|
|
4166
|
+
@rectangle.fill[:g] = @green_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
|
|
4019
4167
|
end
|
|
4020
4168
|
}
|
|
4021
4169
|
|
|
@@ -4024,7 +4172,7 @@ window('Dynamic Area', 240, 600) {
|
|
|
4024
4172
|
value 204
|
|
4025
4173
|
|
|
4026
4174
|
on_changed do
|
|
4027
|
-
@
|
|
4175
|
+
@rectangle.fill[:b] = @blue_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
|
|
4028
4176
|
end
|
|
4029
4177
|
}
|
|
4030
4178
|
|
|
@@ -4033,15 +4181,13 @@ window('Dynamic Area', 240, 600) {
|
|
|
4033
4181
|
value 100
|
|
4034
4182
|
|
|
4035
4183
|
on_changed do
|
|
4036
|
-
@
|
|
4184
|
+
@rectangle.fill[:a] = @alpha_spinbox.value / 100.0 # updating hash properties automatically triggers area.queue_redraw_all
|
|
4037
4185
|
end
|
|
4038
4186
|
}
|
|
4039
4187
|
}
|
|
4040
4188
|
|
|
4041
4189
|
area {
|
|
4042
|
-
@
|
|
4043
|
-
@rectangle = rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value)
|
|
4044
|
-
|
|
4190
|
+
@rectangle = rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value) { # stable path
|
|
4045
4191
|
fill r: @red_spinbox.value, g: @green_spinbox.value, b: @blue_spinbox.value, a: @alpha_spinbox.value / 100.0
|
|
4046
4192
|
}
|
|
4047
4193
|
}
|
|
@@ -4065,17 +4211,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
4065
4211
|
ruby -r glimmer-dsl-libui -e "require 'examples/area_gallery'"
|
|
4066
4212
|
```
|
|
4067
4213
|
|
|
4068
|
-
Mac
|
|
4069
|
-
|
|
4070
|
-
|
|
4071
|
-
|
|
4072
|
-
Windows
|
|
4073
|
-
|
|
4074
|
-
|
|
4075
|
-
|
|
4076
|
-
Linux
|
|
4077
|
-
|
|
4078
|
-
|
|
4214
|
+
Mac | Windows | Linux
|
|
4215
|
+
----|---------|------
|
|
4216
|
+
 |  | 
|
|
4079
4217
|
|
|
4080
4218
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
4081
4219
|
|
|
@@ -4086,50 +4224,50 @@ include Glimmer
|
|
|
4086
4224
|
|
|
4087
4225
|
window('Area Gallery', 400, 400) {
|
|
4088
4226
|
area {
|
|
4089
|
-
path { # declarative stable path
|
|
4227
|
+
path { # declarative stable path (explicit path syntax for multiple shapes sharing attributes)
|
|
4090
4228
|
square(0, 0, 100)
|
|
4091
4229
|
square(100, 100, 400)
|
|
4092
|
-
|
|
4230
|
+
|
|
4093
4231
|
fill r: 102, g: 102, b: 204
|
|
4094
4232
|
}
|
|
4095
|
-
|
|
4233
|
+
|
|
4234
|
+
path { # declarative stable path (explicit path syntax for multiple shapes sharing attributes)
|
|
4096
4235
|
rectangle(0, 100, 100, 400)
|
|
4097
4236
|
rectangle(100, 0, 400, 100)
|
|
4098
|
-
|
|
4237
|
+
|
|
4099
4238
|
# linear gradient (has x0, y0, x1, y1, and stops)
|
|
4100
4239
|
fill x0: 10, y0: 10, x1: 350, y1: 350, stops: [{pos: 0.25, r: 204, g: 102, b: 204}, {pos: 0.75, r: 102, g: 102, b: 204}]
|
|
4101
4240
|
}
|
|
4102
|
-
|
|
4103
|
-
|
|
4104
|
-
|
|
4241
|
+
|
|
4242
|
+
polygon(100, 100, 100, 400, 400, 100, 400, 400) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
4105
4243
|
fill r: 202, g: 102, b: 104, a: 0.5
|
|
4106
4244
|
stroke r: 0, g: 0, b: 0
|
|
4107
4245
|
}
|
|
4108
|
-
|
|
4109
|
-
|
|
4110
|
-
|
|
4246
|
+
|
|
4247
|
+
polybezier(0, 0,
|
|
4248
|
+
200, 100, 100, 200, 400, 100,
|
|
4249
|
+
300, 100, 100, 300, 100, 400,
|
|
4250
|
+
100, 300, 300, 100, 400, 400) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
4111
4251
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4112
4252
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4113
4253
|
}
|
|
4114
|
-
path { # declarative stable path
|
|
4115
|
-
polyline(100, 100, 400, 100, 100, 400, 400, 400, 0, 0)
|
|
4116
4254
|
|
|
4255
|
+
polyline(100, 100, 400, 100, 100, 400, 400, 400, 0, 0) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
4117
4256
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4118
4257
|
}
|
|
4119
|
-
|
|
4120
|
-
|
|
4121
|
-
|
|
4258
|
+
|
|
4259
|
+
arc(404, 216, 190, 90, 90, false) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
4122
4260
|
# radial gradient (has an outer_radius in addition to x0, y0, x1, y1, and stops)
|
|
4123
4261
|
fill outer_radius: 90, x0: 0, y0: 0, x1: 500, y1: 500, stops: [{pos: 0.25, r: 102, g: 102, b: 204, a: 0.5}, {pos: 0.75, r: 204, g: 102, b: 204}]
|
|
4124
4262
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4125
4263
|
}
|
|
4126
|
-
|
|
4127
|
-
|
|
4128
|
-
|
|
4264
|
+
|
|
4265
|
+
circle(200, 200, 90) { # declarative stable path (implicit path syntax for a single shape nested directly under area)
|
|
4129
4266
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4130
4267
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4131
4268
|
}
|
|
4132
|
-
|
|
4269
|
+
|
|
4270
|
+
text(161, 40, 100) { # declarative stable text
|
|
4133
4271
|
string('Area Gallery') {
|
|
4134
4272
|
font family: 'Arial', size: (OS.mac? ? 14 : 11)
|
|
4135
4273
|
color :black
|
|
@@ -4196,12 +4334,13 @@ include Glimmer
|
|
|
4196
4334
|
|
|
4197
4335
|
window('Area Gallery', 400, 400) {
|
|
4198
4336
|
area {
|
|
4199
|
-
path { # declarative stable path
|
|
4337
|
+
path { # declarative stable path with explicit attributes (explicit path syntax for multiple shapes sharing attributes)
|
|
4200
4338
|
square {
|
|
4201
4339
|
x 0
|
|
4202
4340
|
y 0
|
|
4203
4341
|
length 100
|
|
4204
4342
|
}
|
|
4343
|
+
|
|
4205
4344
|
square {
|
|
4206
4345
|
x 100
|
|
4207
4346
|
y 100
|
|
@@ -4210,13 +4349,15 @@ window('Area Gallery', 400, 400) {
|
|
|
4210
4349
|
|
|
4211
4350
|
fill r: 102, g: 102, b: 204
|
|
4212
4351
|
}
|
|
4213
|
-
|
|
4352
|
+
|
|
4353
|
+
path { # declarative stable path with explicit attributes (explicit path syntax for multiple shapes sharing attributes)
|
|
4214
4354
|
rectangle {
|
|
4215
4355
|
x 0
|
|
4216
4356
|
y 100
|
|
4217
4357
|
width 100
|
|
4218
4358
|
height 400
|
|
4219
4359
|
}
|
|
4360
|
+
|
|
4220
4361
|
rectangle {
|
|
4221
4362
|
x 100
|
|
4222
4363
|
y 0
|
|
@@ -4227,115 +4368,114 @@ window('Area Gallery', 400, 400) {
|
|
|
4227
4368
|
# linear gradient (has x0, y0, x1, y1, and stops)
|
|
4228
4369
|
fill x0: 10, y0: 10, x1: 350, y1: 350, stops: [{pos: 0.25, r: 204, g: 102, b: 204}, {pos: 0.75, r: 102, g: 102, b: 204}]
|
|
4229
4370
|
}
|
|
4230
|
-
|
|
4231
|
-
|
|
4371
|
+
|
|
4372
|
+
figure { # declarative stable path with explicit attributes (implicit path syntax for a single shape nested directly under area)
|
|
4373
|
+
x 100
|
|
4374
|
+
y 100
|
|
4375
|
+
|
|
4376
|
+
line {
|
|
4232
4377
|
x 100
|
|
4378
|
+
y 400
|
|
4379
|
+
}
|
|
4380
|
+
|
|
4381
|
+
line {
|
|
4382
|
+
x 400
|
|
4233
4383
|
y 100
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
line {
|
|
4240
|
-
x 400
|
|
4241
|
-
y 100
|
|
4242
|
-
}
|
|
4243
|
-
line {
|
|
4244
|
-
x 400
|
|
4245
|
-
y 400
|
|
4246
|
-
}
|
|
4247
|
-
|
|
4248
|
-
closed true
|
|
4384
|
+
}
|
|
4385
|
+
|
|
4386
|
+
line {
|
|
4387
|
+
x 400
|
|
4388
|
+
y 400
|
|
4249
4389
|
}
|
|
4250
4390
|
|
|
4391
|
+
closed true # polygon figure is closed (last point forms a line with first point)
|
|
4251
4392
|
fill r: 202, g: 102, b: 104, a: 0.5
|
|
4252
4393
|
stroke r: 0, g: 0, b: 0
|
|
4253
4394
|
}
|
|
4254
|
-
|
|
4255
|
-
|
|
4256
|
-
|
|
4257
|
-
|
|
4258
|
-
|
|
4259
|
-
|
|
4260
|
-
|
|
4261
|
-
|
|
4262
|
-
|
|
4263
|
-
|
|
4264
|
-
|
|
4265
|
-
|
|
4266
|
-
}
|
|
4267
|
-
bezier {
|
|
4268
|
-
c1_x 300
|
|
4269
|
-
c1_y 100
|
|
4270
|
-
c2_x 100
|
|
4271
|
-
c2_y 300
|
|
4272
|
-
end_x 100
|
|
4273
|
-
end_y 400
|
|
4274
|
-
}
|
|
4275
|
-
bezier {
|
|
4276
|
-
c1_x 100
|
|
4277
|
-
c1_y 300
|
|
4278
|
-
c2_x 300
|
|
4279
|
-
c2_y 100
|
|
4280
|
-
end_x 400
|
|
4281
|
-
end_y 400
|
|
4282
|
-
}
|
|
4395
|
+
|
|
4396
|
+
figure { # declarative stable path with explicit attributes (implicit path syntax for a single shape nested directly under area)
|
|
4397
|
+
x 0
|
|
4398
|
+
y 0
|
|
4399
|
+
|
|
4400
|
+
bezier {
|
|
4401
|
+
c1_x 200
|
|
4402
|
+
c1_y 100
|
|
4403
|
+
c2_x 100
|
|
4404
|
+
c2_y 200
|
|
4405
|
+
end_x 400
|
|
4406
|
+
end_y 100
|
|
4283
4407
|
}
|
|
4284
|
-
|
|
4408
|
+
|
|
4409
|
+
bezier {
|
|
4410
|
+
c1_x 300
|
|
4411
|
+
c1_y 100
|
|
4412
|
+
c2_x 100
|
|
4413
|
+
c2_y 300
|
|
4414
|
+
end_x 100
|
|
4415
|
+
end_y 400
|
|
4416
|
+
}
|
|
4417
|
+
|
|
4418
|
+
bezier {
|
|
4419
|
+
c1_x 100
|
|
4420
|
+
c1_y 300
|
|
4421
|
+
c2_x 300
|
|
4422
|
+
c2_y 100
|
|
4423
|
+
end_x 400
|
|
4424
|
+
end_y 400
|
|
4425
|
+
}
|
|
4426
|
+
|
|
4285
4427
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4286
4428
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4287
4429
|
}
|
|
4288
|
-
|
|
4289
|
-
|
|
4290
|
-
|
|
4291
|
-
|
|
4430
|
+
|
|
4431
|
+
figure { # declarative stable path with explicit attributes (implicit path syntax for a single shape nested directly under area)
|
|
4432
|
+
x 100
|
|
4433
|
+
y 100
|
|
4434
|
+
|
|
4435
|
+
line {
|
|
4436
|
+
x 400
|
|
4292
4437
|
y 100
|
|
4293
|
-
|
|
4294
|
-
line {
|
|
4295
|
-
x 400
|
|
4296
|
-
y 100
|
|
4297
|
-
}
|
|
4298
|
-
line {
|
|
4299
|
-
x 100
|
|
4300
|
-
y 400
|
|
4301
|
-
}
|
|
4302
|
-
line {
|
|
4303
|
-
x 400
|
|
4304
|
-
y 400
|
|
4305
|
-
}
|
|
4306
|
-
line {
|
|
4307
|
-
x 0
|
|
4308
|
-
y 0
|
|
4309
|
-
}
|
|
4310
4438
|
}
|
|
4311
|
-
|
|
4439
|
+
|
|
4440
|
+
line {
|
|
4441
|
+
x 100
|
|
4442
|
+
y 400
|
|
4443
|
+
}
|
|
4444
|
+
|
|
4445
|
+
line {
|
|
4446
|
+
x 400
|
|
4447
|
+
y 400
|
|
4448
|
+
}
|
|
4449
|
+
|
|
4450
|
+
line {
|
|
4451
|
+
x 0
|
|
4452
|
+
y 0
|
|
4453
|
+
}
|
|
4454
|
+
|
|
4312
4455
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4313
4456
|
}
|
|
4314
|
-
|
|
4315
|
-
|
|
4316
|
-
|
|
4317
|
-
|
|
4318
|
-
|
|
4319
|
-
|
|
4320
|
-
|
|
4321
|
-
|
|
4322
|
-
}
|
|
4323
|
-
|
|
4457
|
+
|
|
4458
|
+
arc { # declarative stable path with explicit attributes (implicit path syntax for a single shape nested directly under area)
|
|
4459
|
+
x_center 404
|
|
4460
|
+
y_center 216
|
|
4461
|
+
radius 190
|
|
4462
|
+
start_angle 90
|
|
4463
|
+
sweep 90
|
|
4464
|
+
is_negative false
|
|
4324
4465
|
# radial gradient (has an outer_radius in addition to x0, y0, x1, y1, and stops)
|
|
4325
4466
|
fill outer_radius: 90, x0: 0, y0: 0, x1: 500, y1: 500, stops: [{pos: 0.25, r: 102, g: 102, b: 204, a: 0.5}, {pos: 0.75, r: 204, g: 102, b: 204}]
|
|
4326
4467
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4327
4468
|
}
|
|
4328
|
-
|
|
4329
|
-
|
|
4330
|
-
|
|
4331
|
-
|
|
4332
|
-
|
|
4333
|
-
}
|
|
4334
|
-
|
|
4469
|
+
|
|
4470
|
+
circle { # declarative stable path with explicit attributes (implicit path syntax for a single shape nested directly under area)
|
|
4471
|
+
x_center 200
|
|
4472
|
+
y_center 200
|
|
4473
|
+
radius 90
|
|
4335
4474
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4336
4475
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4337
4476
|
}
|
|
4338
|
-
|
|
4477
|
+
|
|
4478
|
+
text { # declarative stable text with explicit attributes
|
|
4339
4479
|
x 161
|
|
4340
4480
|
y 40
|
|
4341
4481
|
width 100
|
|
@@ -4409,50 +4549,50 @@ include Glimmer
|
|
|
4409
4549
|
window('Area Gallery', 400, 400) {
|
|
4410
4550
|
area {
|
|
4411
4551
|
on_draw do |area_draw_params|
|
|
4412
|
-
path { #
|
|
4552
|
+
path { # dynamic path, added semi-declaratively inside on_draw block
|
|
4413
4553
|
square(0, 0, 100)
|
|
4414
4554
|
square(100, 100, 400)
|
|
4415
|
-
|
|
4555
|
+
|
|
4416
4556
|
fill r: 102, g: 102, b: 204
|
|
4417
4557
|
}
|
|
4418
|
-
|
|
4558
|
+
|
|
4559
|
+
path { # dynamic path, added semi-declaratively inside on_draw block
|
|
4419
4560
|
rectangle(0, 100, 100, 400)
|
|
4420
4561
|
rectangle(100, 0, 400, 100)
|
|
4421
|
-
|
|
4562
|
+
|
|
4422
4563
|
# linear gradient (has x0, y0, x1, y1, and stops)
|
|
4423
4564
|
fill x0: 10, y0: 10, x1: 350, y1: 350, stops: [{pos: 0.25, r: 204, g: 102, b: 204}, {pos: 0.75, r: 102, g: 102, b: 204}]
|
|
4424
4565
|
}
|
|
4425
|
-
|
|
4426
|
-
|
|
4427
|
-
|
|
4566
|
+
|
|
4567
|
+
polygon(100, 100, 100, 400, 400, 100, 400, 400) { # dynamic path, added semi-declaratively inside on_draw block
|
|
4428
4568
|
fill r: 202, g: 102, b: 104, a: 0.5
|
|
4429
4569
|
stroke r: 0, g: 0, b: 0
|
|
4430
4570
|
}
|
|
4431
|
-
|
|
4432
|
-
|
|
4433
|
-
|
|
4571
|
+
|
|
4572
|
+
polybezier(0, 0,
|
|
4573
|
+
200, 100, 100, 200, 400, 100,
|
|
4574
|
+
300, 100, 100, 300, 100, 400,
|
|
4575
|
+
100, 300, 300, 100, 400, 400) { # dynamic path, added semi-declaratively inside on_draw block
|
|
4434
4576
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4435
4577
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4436
4578
|
}
|
|
4437
|
-
path { # a dynamic path is added semi-declaratively inside on_draw block
|
|
4438
|
-
polyline(100, 100, 400, 100, 100, 400, 400, 400, 0, 0)
|
|
4439
4579
|
|
|
4580
|
+
polyline(100, 100, 400, 100, 100, 400, 400, 400, 0, 0) { # dynamic path, added semi-declaratively inside on_draw block
|
|
4440
4581
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4441
4582
|
}
|
|
4442
|
-
|
|
4443
|
-
|
|
4444
|
-
|
|
4583
|
+
|
|
4584
|
+
arc(404, 216, 190, 90, 90, false) { # dynamic path, added semi-declaratively inside on_draw block
|
|
4445
4585
|
# radial gradient (has an outer_radius in addition to x0, y0, x1, y1, and stops)
|
|
4446
4586
|
fill outer_radius: 90, x0: 0, y0: 0, x1: 500, y1: 500, stops: [{pos: 0.25, r: 102, g: 102, b: 204, a: 0.5}, {pos: 0.75, r: 204, g: 102, b: 204}]
|
|
4447
4587
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4448
4588
|
}
|
|
4449
|
-
|
|
4450
|
-
|
|
4451
|
-
|
|
4589
|
+
|
|
4590
|
+
circle(200, 200, 90) { # dynamic path, added semi-declaratively inside on_draw block
|
|
4452
4591
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4453
4592
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4454
4593
|
}
|
|
4455
|
-
|
|
4594
|
+
|
|
4595
|
+
text(161, 40, 100) { # dynamic text added semi-declaratively inside on_draw block
|
|
4456
4596
|
string('Area Gallery') {
|
|
4457
4597
|
font family: 'Arial', size: (OS.mac? ? 14 : 11)
|
|
4458
4598
|
color :black
|
|
@@ -4521,12 +4661,13 @@ include Glimmer
|
|
|
4521
4661
|
window('Area Gallery', 400, 400) {
|
|
4522
4662
|
area {
|
|
4523
4663
|
on_draw do |area_draw_params|
|
|
4524
|
-
path { #
|
|
4664
|
+
path { # dynamic path, added semi-declaratively inside on_draw block
|
|
4525
4665
|
square {
|
|
4526
4666
|
x 0
|
|
4527
4667
|
y 0
|
|
4528
4668
|
length 100
|
|
4529
4669
|
}
|
|
4670
|
+
|
|
4530
4671
|
square {
|
|
4531
4672
|
x 100
|
|
4532
4673
|
y 100
|
|
@@ -4535,13 +4676,15 @@ window('Area Gallery', 400, 400) {
|
|
|
4535
4676
|
|
|
4536
4677
|
fill r: 102, g: 102, b: 204
|
|
4537
4678
|
}
|
|
4538
|
-
|
|
4679
|
+
|
|
4680
|
+
path { # dynamic path, added semi-declaratively inside on_draw block
|
|
4539
4681
|
rectangle {
|
|
4540
4682
|
x 0
|
|
4541
4683
|
y 100
|
|
4542
4684
|
width 100
|
|
4543
4685
|
height 400
|
|
4544
4686
|
}
|
|
4687
|
+
|
|
4545
4688
|
rectangle {
|
|
4546
4689
|
x 100
|
|
4547
4690
|
y 0
|
|
@@ -4552,115 +4695,114 @@ window('Area Gallery', 400, 400) {
|
|
|
4552
4695
|
# linear gradient (has x0, y0, x1, y1, and stops)
|
|
4553
4696
|
fill x0: 10, y0: 10, x1: 350, y1: 350, stops: [{pos: 0.25, r: 204, g: 102, b: 204}, {pos: 0.75, r: 102, g: 102, b: 204}]
|
|
4554
4697
|
}
|
|
4555
|
-
|
|
4556
|
-
|
|
4698
|
+
|
|
4699
|
+
figure { # dynamic path, added semi-declaratively inside on_draw block
|
|
4700
|
+
x 100
|
|
4701
|
+
y 100
|
|
4702
|
+
|
|
4703
|
+
line {
|
|
4557
4704
|
x 100
|
|
4705
|
+
y 400
|
|
4706
|
+
}
|
|
4707
|
+
|
|
4708
|
+
line {
|
|
4709
|
+
x 400
|
|
4558
4710
|
y 100
|
|
4559
|
-
|
|
4560
|
-
|
|
4561
|
-
|
|
4562
|
-
|
|
4563
|
-
|
|
4564
|
-
line {
|
|
4565
|
-
x 400
|
|
4566
|
-
y 100
|
|
4567
|
-
}
|
|
4568
|
-
line {
|
|
4569
|
-
x 400
|
|
4570
|
-
y 400
|
|
4571
|
-
}
|
|
4572
|
-
|
|
4573
|
-
closed true
|
|
4711
|
+
}
|
|
4712
|
+
|
|
4713
|
+
line {
|
|
4714
|
+
x 400
|
|
4715
|
+
y 400
|
|
4574
4716
|
}
|
|
4575
4717
|
|
|
4718
|
+
closed true # polygon figure is closed (last point forms a line with first point)
|
|
4576
4719
|
fill r: 202, g: 102, b: 104, a: 0.5
|
|
4577
4720
|
stroke r: 0, g: 0, b: 0
|
|
4578
4721
|
}
|
|
4579
|
-
|
|
4580
|
-
|
|
4722
|
+
|
|
4723
|
+
figure { # dynamic path, added semi-declaratively inside on_draw block
|
|
4724
|
+
x 0
|
|
4725
|
+
y 0
|
|
4726
|
+
|
|
4727
|
+
bezier {
|
|
4728
|
+
c1_x 200
|
|
4729
|
+
c1_y 100
|
|
4730
|
+
c2_x 100
|
|
4731
|
+
c2_y 200
|
|
4732
|
+
end_x 400
|
|
4733
|
+
end_y 100
|
|
4734
|
+
}
|
|
4735
|
+
|
|
4736
|
+
bezier {
|
|
4737
|
+
c1_x 300
|
|
4738
|
+
c1_y 100
|
|
4739
|
+
c2_x 100
|
|
4740
|
+
c2_y 300
|
|
4741
|
+
end_x 100
|
|
4742
|
+
end_y 400
|
|
4743
|
+
}
|
|
4744
|
+
|
|
4745
|
+
bezier {
|
|
4746
|
+
c1_x 100
|
|
4747
|
+
c1_y 300
|
|
4748
|
+
c2_x 300
|
|
4749
|
+
c2_y 100
|
|
4750
|
+
end_x 400
|
|
4751
|
+
end_y 400
|
|
4752
|
+
}
|
|
4753
|
+
|
|
4754
|
+
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4755
|
+
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4756
|
+
}
|
|
4757
|
+
|
|
4758
|
+
figure { # dynamic path, added semi-declaratively inside on_draw block
|
|
4759
|
+
x 100
|
|
4760
|
+
y 100
|
|
4761
|
+
|
|
4762
|
+
line {
|
|
4763
|
+
x 400
|
|
4764
|
+
y 100
|
|
4765
|
+
}
|
|
4766
|
+
|
|
4767
|
+
line {
|
|
4768
|
+
x 100
|
|
4769
|
+
y 400
|
|
4770
|
+
}
|
|
4771
|
+
|
|
4772
|
+
line {
|
|
4773
|
+
x 400
|
|
4774
|
+
y 400
|
|
4775
|
+
}
|
|
4776
|
+
|
|
4777
|
+
line {
|
|
4581
4778
|
x 0
|
|
4582
4779
|
y 0
|
|
4583
|
-
|
|
4584
|
-
bezier {
|
|
4585
|
-
c1_x 200
|
|
4586
|
-
c1_y 100
|
|
4587
|
-
c2_x 100
|
|
4588
|
-
c2_y 200
|
|
4589
|
-
end_x 400
|
|
4590
|
-
end_y 100
|
|
4591
|
-
}
|
|
4592
|
-
bezier {
|
|
4593
|
-
c1_x 300
|
|
4594
|
-
c1_y 100
|
|
4595
|
-
c2_x 100
|
|
4596
|
-
c2_y 300
|
|
4597
|
-
end_x 100
|
|
4598
|
-
end_y 400
|
|
4599
|
-
}
|
|
4600
|
-
bezier {
|
|
4601
|
-
c1_x 100
|
|
4602
|
-
c1_y 300
|
|
4603
|
-
c2_x 300
|
|
4604
|
-
c2_y 100
|
|
4605
|
-
end_x 400
|
|
4606
|
-
end_y 400
|
|
4607
|
-
}
|
|
4608
|
-
}
|
|
4609
|
-
|
|
4610
|
-
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4611
|
-
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4612
|
-
}
|
|
4613
|
-
path { # a dynamic path is added semi-declaratively inside on_draw block
|
|
4614
|
-
polyline(100, 100, 400, 100, 100, 400, 400, 400, 0, 0)
|
|
4615
|
-
figure {
|
|
4616
|
-
x 100
|
|
4617
|
-
y 100
|
|
4618
|
-
|
|
4619
|
-
line {
|
|
4620
|
-
x 400
|
|
4621
|
-
y 100
|
|
4622
|
-
}
|
|
4623
|
-
line {
|
|
4624
|
-
x 100
|
|
4625
|
-
y 400
|
|
4626
|
-
}
|
|
4627
|
-
line {
|
|
4628
|
-
x 400
|
|
4629
|
-
y 400
|
|
4630
|
-
}
|
|
4631
|
-
line {
|
|
4632
|
-
x 0
|
|
4633
|
-
y 0
|
|
4634
|
-
}
|
|
4635
4780
|
}
|
|
4636
|
-
|
|
4781
|
+
|
|
4637
4782
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4638
4783
|
}
|
|
4639
|
-
|
|
4640
|
-
|
|
4641
|
-
|
|
4642
|
-
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
|
|
4646
|
-
|
|
4647
|
-
}
|
|
4648
|
-
|
|
4784
|
+
|
|
4785
|
+
arc { # dynamic path, added semi-declaratively inside on_draw block
|
|
4786
|
+
x_center 404
|
|
4787
|
+
y_center 216
|
|
4788
|
+
radius 190
|
|
4789
|
+
start_angle 90
|
|
4790
|
+
sweep 90
|
|
4791
|
+
is_negative false
|
|
4649
4792
|
# radial gradient (has an outer_radius in addition to x0, y0, x1, y1, and stops)
|
|
4650
4793
|
fill outer_radius: 90, x0: 0, y0: 0, x1: 500, y1: 500, stops: [{pos: 0.25, r: 102, g: 102, b: 204, a: 0.5}, {pos: 0.75, r: 204, g: 102, b: 204}]
|
|
4651
4794
|
stroke r: 0, g: 0, b: 0, thickness: 2, dashes: [50, 10, 10, 10], dash_phase: -50.0
|
|
4652
4795
|
}
|
|
4653
|
-
|
|
4654
|
-
|
|
4655
|
-
|
|
4656
|
-
|
|
4657
|
-
|
|
4658
|
-
}
|
|
4659
|
-
|
|
4796
|
+
|
|
4797
|
+
circle { # dynamic path, added semi-declaratively inside on_draw block
|
|
4798
|
+
x_center 200
|
|
4799
|
+
y_center 200
|
|
4800
|
+
radius 90
|
|
4660
4801
|
fill r: 202, g: 102, b: 204, a: 0.5
|
|
4661
4802
|
stroke r: 0, g: 0, b: 0, thickness: 2
|
|
4662
4803
|
}
|
|
4663
|
-
|
|
4804
|
+
|
|
4805
|
+
text { # dynamic path, added semi-declaratively inside on_draw block
|
|
4664
4806
|
x 161
|
|
4665
4807
|
y 40
|
|
4666
4808
|
width 100
|
|
@@ -4725,33 +4867,215 @@ window('Area Gallery', 400, 400) {
|
|
|
4725
4867
|
}.show
|
|
4726
4868
|
```
|
|
4727
4869
|
|
|
4728
|
-
###
|
|
4870
|
+
### Basic Image
|
|
4729
4871
|
|
|
4730
|
-
[examples/
|
|
4872
|
+
[examples/basic_image.rb](examples/basic_image.rb)
|
|
4731
4873
|
|
|
4732
4874
|
Run with this command from the root of the project if you cloned the project:
|
|
4733
4875
|
|
|
4734
4876
|
```
|
|
4735
|
-
ruby -r './lib/glimmer-dsl-libui' examples/
|
|
4877
|
+
ruby -r './lib/glimmer-dsl-libui' examples/basic_image.rb
|
|
4736
4878
|
```
|
|
4737
4879
|
|
|
4738
4880
|
Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/glimmer-dsl-libui):
|
|
4739
4881
|
|
|
4740
4882
|
```
|
|
4741
|
-
ruby -r glimmer-dsl-libui -e "require 'examples/
|
|
4883
|
+
ruby -r glimmer-dsl-libui -e "require 'examples/basic_image'"
|
|
4884
|
+
```
|
|
4885
|
+
|
|
4886
|
+
Mac | Windows | Linux
|
|
4887
|
+
----|---------|------
|
|
4888
|
+
 |  | 
|
|
4889
|
+
|
|
4890
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
4891
|
+
|
|
4892
|
+
```ruby
|
|
4893
|
+
require 'glimmer-dsl-libui'
|
|
4894
|
+
|
|
4895
|
+
include Glimmer
|
|
4896
|
+
|
|
4897
|
+
window('Basic Image', 96, 96) {
|
|
4898
|
+
area {
|
|
4899
|
+
# image is not a real LibUI control. It is built in Glimmer as a custom control that renders
|
|
4900
|
+
# tiny pixels/lines as rectangle paths. As such, it does not have good performance, but can
|
|
4901
|
+
# be used in exceptional circumstances where an image control is really needed.
|
|
4902
|
+
#
|
|
4903
|
+
# Furthermore, adding image directly under area is even slower due to taking up more memory for every
|
|
4904
|
+
# image pixel rendered. Check basic_image2.rb for a faster alternative using on_draw manually.
|
|
4905
|
+
#
|
|
4906
|
+
# It is recommended to pass width/height args to shrink image and achieve faster performance.
|
|
4907
|
+
image(File.expand_path('../icons/glimmer.png', __dir__), 96, 96)
|
|
4908
|
+
}
|
|
4909
|
+
}.show
|
|
4910
|
+
```
|
|
4911
|
+
|
|
4912
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 2 (better performance via `on_draw`):
|
|
4913
|
+
|
|
4914
|
+
```ruby
|
|
4915
|
+
# frozen_string_literal: true
|
|
4916
|
+
|
|
4917
|
+
require 'glimmer-dsl-libui'
|
|
4918
|
+
|
|
4919
|
+
include Glimmer
|
|
4920
|
+
|
|
4921
|
+
window('Basic Image', 96, 96) {
|
|
4922
|
+
area {
|
|
4923
|
+
on_draw do |area_draw_params|
|
|
4924
|
+
image(File.expand_path('../icons/glimmer.png', __dir__), 96, 96)
|
|
4925
|
+
end
|
|
4926
|
+
}
|
|
4927
|
+
}.show
|
|
4928
|
+
```
|
|
4929
|
+
|
|
4930
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 3 (explicit properties):
|
|
4931
|
+
|
|
4932
|
+
```ruby
|
|
4933
|
+
# frozen_string_literal: true
|
|
4934
|
+
|
|
4935
|
+
require 'glimmer-dsl-libui'
|
|
4936
|
+
|
|
4937
|
+
include Glimmer
|
|
4938
|
+
|
|
4939
|
+
window('Basic Image', 96, 96) {
|
|
4940
|
+
area {
|
|
4941
|
+
# image is not a real LibUI control. It is built in Glimmer as a custom control that renders
|
|
4942
|
+
# tiny pixels/lines as rectangle paths. As such, it does not have good performance, but can
|
|
4943
|
+
# be used in exceptional circumstances where an image control is really needed.
|
|
4944
|
+
#
|
|
4945
|
+
# Furthermore, adding image directly under area is even slower due to taking up more memory for every
|
|
4946
|
+
# image pixel rendered. Check basic_image4.rb for a faster alternative using on_draw manually.
|
|
4947
|
+
#
|
|
4948
|
+
# It is recommended to pass width/height args to shrink image and achieve faster performance.
|
|
4949
|
+
image {
|
|
4950
|
+
file File.expand_path('../icons/glimmer.png', __dir__)
|
|
4951
|
+
width 96
|
|
4952
|
+
height 96
|
|
4953
|
+
}
|
|
4954
|
+
}
|
|
4955
|
+
}.show
|
|
4956
|
+
```
|
|
4957
|
+
|
|
4958
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 4 (better performance with `on_draw` when setting explicit properties):
|
|
4959
|
+
|
|
4960
|
+
```ruby
|
|
4961
|
+
# frozen_string_literal: true
|
|
4962
|
+
|
|
4963
|
+
require 'glimmer-dsl-libui'
|
|
4964
|
+
|
|
4965
|
+
include Glimmer
|
|
4966
|
+
|
|
4967
|
+
window('Basic Image', 96, 96) {
|
|
4968
|
+
area {
|
|
4969
|
+
on_draw do |area_draw_params|
|
|
4970
|
+
image {
|
|
4971
|
+
file File.expand_path('../icons/glimmer.png', __dir__)
|
|
4972
|
+
width 96
|
|
4973
|
+
height 96
|
|
4974
|
+
}
|
|
4975
|
+
end
|
|
4976
|
+
}
|
|
4977
|
+
}.show
|
|
4978
|
+
```
|
|
4979
|
+
|
|
4980
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 5 (fully manual pixel-by-pixel rendering):
|
|
4981
|
+
|
|
4982
|
+
```ruby
|
|
4983
|
+
# frozen_string_literal: true
|
|
4984
|
+
|
|
4985
|
+
# This is the manual way of rendering an image unto an area control.
|
|
4986
|
+
# It could come in handy in special situations.
|
|
4987
|
+
# Otherwise, it is recommended to simply utilize the `image` control that
|
|
4988
|
+
# can be nested under area or area on_draw listener to automate all this work.
|
|
4989
|
+
|
|
4990
|
+
require 'glimmer-dsl-libui'
|
|
4991
|
+
require 'chunky_png'
|
|
4992
|
+
|
|
4993
|
+
include Glimmer
|
|
4994
|
+
|
|
4995
|
+
puts 'Parsing image...'; $stdout.flush
|
|
4996
|
+
|
|
4997
|
+
f = File.open(File.expand_path('../icons/glimmer.png', __dir__))
|
|
4998
|
+
canvas = ChunkyPNG::Canvas.from_io(f)
|
|
4999
|
+
f.close
|
|
5000
|
+
canvas.resample_nearest_neighbor!(96, 96)
|
|
5001
|
+
data = canvas.to_rgba_stream
|
|
5002
|
+
width = canvas.width
|
|
5003
|
+
height = canvas.height
|
|
5004
|
+
puts "Image width: #{width}"
|
|
5005
|
+
puts "Image height: #{height}"
|
|
5006
|
+
|
|
5007
|
+
puts 'Parsing colors...'; $stdout.flush
|
|
5008
|
+
|
|
5009
|
+
color_maps = height.times.map do |y|
|
|
5010
|
+
width.times.map do |x|
|
|
5011
|
+
r = data[(y*width + x)*4].ord
|
|
5012
|
+
g = data[(y*width + x)*4 + 1].ord
|
|
5013
|
+
b = data[(y*width + x)*4 + 2].ord
|
|
5014
|
+
a = data[(y*width + x)*4 + 3].ord
|
|
5015
|
+
{x: x, y: y, color: {r: r, g: g, b: b, a: a}}
|
|
5016
|
+
end
|
|
5017
|
+
end.flatten
|
|
5018
|
+
puts "#{color_maps.size} pixels to render..."; $stdout.flush
|
|
5019
|
+
|
|
5020
|
+
puts 'Parsing shapes...'; $stdout.flush
|
|
5021
|
+
|
|
5022
|
+
shape_maps = []
|
|
5023
|
+
original_color_maps = color_maps.dup
|
|
5024
|
+
indexed_original_color_maps = Hash[original_color_maps.each_with_index.to_a]
|
|
5025
|
+
color_maps.each do |color_map|
|
|
5026
|
+
index = indexed_original_color_maps[color_map]
|
|
5027
|
+
@rectangle_start_x ||= color_map[:x]
|
|
5028
|
+
@rectangle_width ||= 1
|
|
5029
|
+
if color_map[:x] < width - 1 && color_map[:color] == original_color_maps[index + 1][:color]
|
|
5030
|
+
@rectangle_width += 1
|
|
5031
|
+
else
|
|
5032
|
+
if color_map[:x] > 0 && color_map[:color] == original_color_maps[index - 1][:color]
|
|
5033
|
+
shape_maps << {x: @rectangle_start_x, y: color_map[:y], width: @rectangle_width, height: 1, color: color_map[:color]}
|
|
5034
|
+
else
|
|
5035
|
+
shape_maps << {x: color_map[:x], y: color_map[:y], width: 1, height: 1, color: color_map[:color]}
|
|
5036
|
+
end
|
|
5037
|
+
@rectangle_width = 1
|
|
5038
|
+
@rectangle_start_x = color_map[:x] == width - 1 ? 0 : color_map[:x] + 1
|
|
5039
|
+
end
|
|
5040
|
+
end
|
|
5041
|
+
puts "#{shape_maps.size} shapes to render..."; $stdout.flush
|
|
5042
|
+
|
|
5043
|
+
puts 'Rendering image...'; $stdout.flush
|
|
5044
|
+
|
|
5045
|
+
window('Basic Image', 96, 96) {
|
|
5046
|
+
area {
|
|
5047
|
+
on_draw do |area_draw_params|
|
|
5048
|
+
shape_maps.each do |shape_map|
|
|
5049
|
+
path {
|
|
5050
|
+
rectangle(shape_map[:x], shape_map[:y], shape_map[:width], shape_map[:height])
|
|
5051
|
+
|
|
5052
|
+
fill shape_map[:color]
|
|
5053
|
+
}
|
|
5054
|
+
end
|
|
5055
|
+
end
|
|
5056
|
+
}
|
|
5057
|
+
}.show
|
|
4742
5058
|
```
|
|
4743
5059
|
|
|
4744
|
-
|
|
5060
|
+
### Histogram
|
|
5061
|
+
|
|
5062
|
+
[examples/histogram.rb](examples/histogram.rb)
|
|
4745
5063
|
|
|
4746
|
-
|
|
5064
|
+
Run with this command from the root of the project if you cloned the project:
|
|
4747
5065
|
|
|
4748
|
-
|
|
5066
|
+
```
|
|
5067
|
+
ruby -r './lib/glimmer-dsl-libui' examples/histogram.rb
|
|
5068
|
+
```
|
|
4749
5069
|
|
|
4750
|
-
|
|
5070
|
+
Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/glimmer-dsl-libui):
|
|
4751
5071
|
|
|
4752
|
-
|
|
5072
|
+
```
|
|
5073
|
+
ruby -r glimmer-dsl-libui -e "require 'examples/histogram'"
|
|
5074
|
+
```
|
|
4753
5075
|
|
|
4754
|
-
|
|
5076
|
+
Mac | Windows | Linux
|
|
5077
|
+
----|---------|------
|
|
5078
|
+
 |  | 
|
|
4755
5079
|
|
|
4756
5080
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
4757
5081
|
|
|
@@ -5079,19 +5403,46 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
5079
5403
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_transform'"
|
|
5080
5404
|
```
|
|
5081
5405
|
|
|
5082
|
-
Mac
|
|
5083
|
-
|
|
5084
|
-
|
|
5406
|
+
Mac | Windows | Linux
|
|
5407
|
+
----|---------|------
|
|
5408
|
+
 |  | 
|
|
5085
5409
|
|
|
5086
|
-
|
|
5410
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
5087
5411
|
|
|
5088
|
-
|
|
5412
|
+
```ruby
|
|
5413
|
+
require 'glimmer-dsl-libui'
|
|
5089
5414
|
|
|
5090
|
-
|
|
5415
|
+
include Glimmer
|
|
5091
5416
|
|
|
5092
|
-
|
|
5417
|
+
window('Basic Transform', 350, 350) {
|
|
5418
|
+
area {
|
|
5419
|
+
square(0, 0, 350) {
|
|
5420
|
+
fill r: 255, g: 255, b: 0
|
|
5421
|
+
}
|
|
5422
|
+
40.times do |n|
|
|
5423
|
+
square(0, 0, 100) {
|
|
5424
|
+
fill r: [255 - n*5, 0].max, g: [n*5, 255].min, b: 0, a: 0.5
|
|
5425
|
+
stroke :black, thickness: 2
|
|
5426
|
+
|
|
5427
|
+
transform {
|
|
5428
|
+
unless OS.windows?
|
|
5429
|
+
skew 0.15, 0.15
|
|
5430
|
+
translate 50, 50
|
|
5431
|
+
end
|
|
5432
|
+
rotate 100, 100, -9 * n
|
|
5433
|
+
scale 1.1, 1.1
|
|
5434
|
+
if OS.windows?
|
|
5435
|
+
skew 0.15, 0.15
|
|
5436
|
+
translate 50, 50
|
|
5437
|
+
end
|
|
5438
|
+
}
|
|
5439
|
+
}
|
|
5440
|
+
end
|
|
5441
|
+
}
|
|
5442
|
+
}.show
|
|
5443
|
+
```
|
|
5093
5444
|
|
|
5094
|
-
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
5445
|
+
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version 2:
|
|
5095
5446
|
|
|
5096
5447
|
```ruby
|
|
5097
5448
|
require 'glimmer-dsl-libui'
|
|
@@ -5111,11 +5462,18 @@ window('Basic Transform', 350, 350) {
|
|
|
5111
5462
|
|
|
5112
5463
|
fill r: [255 - n*5, 0].max, g: [n*5, 255].min, b: 0, a: 0.5
|
|
5113
5464
|
stroke :black, thickness: 2
|
|
5465
|
+
|
|
5114
5466
|
transform {
|
|
5115
|
-
|
|
5116
|
-
|
|
5467
|
+
unless OS.windows?
|
|
5468
|
+
skew 0.15, 0.15
|
|
5469
|
+
translate 50, 50
|
|
5470
|
+
end
|
|
5117
5471
|
rotate 100, 100, -9 * n
|
|
5118
5472
|
scale 1.1, 1.1
|
|
5473
|
+
if OS.windows?
|
|
5474
|
+
skew 0.15, 0.15
|
|
5475
|
+
translate 50, 50
|
|
5476
|
+
end
|
|
5119
5477
|
}
|
|
5120
5478
|
}
|
|
5121
5479
|
end
|
|
@@ -5139,20 +5497,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
5139
5497
|
ruby -r glimmer-dsl-libui -e "require 'examples/login'"
|
|
5140
5498
|
```
|
|
5141
5499
|
|
|
5142
|
-
Mac
|
|
5143
|
-
|
|
5144
|
-
|
|
5145
|
-
|
|
5146
|
-
|
|
5147
|
-
Windows
|
|
5148
|
-
|
|
5149
|
-
|
|
5150
|
-
|
|
5151
|
-
|
|
5152
|
-
Linux
|
|
5153
|
-
|
|
5154
|
-
|
|
5155
|
-
|
|
5500
|
+
Mac | Windows | Linux
|
|
5501
|
+
----|---------|------
|
|
5502
|
+
  |   |  
|
|
5156
5503
|
|
|
5157
5504
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
5158
5505
|
|
|
@@ -5220,20 +5567,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
5220
5567
|
ruby -r glimmer-dsl-libui -e "require 'examples/timer'"
|
|
5221
5568
|
```
|
|
5222
5569
|
|
|
5223
|
-
Mac
|
|
5224
|
-
|
|
5225
|
-
|
|
5226
|
-
|
|
5227
|
-
|
|
5228
|
-
Windows
|
|
5229
|
-
|
|
5230
|
-
|
|
5231
|
-
|
|
5232
|
-
|
|
5233
|
-
Linux
|
|
5234
|
-
|
|
5235
|
-
|
|
5236
|
-
|
|
5570
|
+
Mac | Windows | Linux
|
|
5571
|
+
----|---------|------
|
|
5572
|
+
  |   |  
|
|
5237
5573
|
|
|
5238
5574
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
5239
5575
|
|
|
@@ -5389,23 +5725,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
5389
5725
|
ruby -r glimmer-dsl-libui -e "require 'examples/color_the_circles'"
|
|
5390
5726
|
```
|
|
5391
5727
|
|
|
5392
|
-
Mac
|
|
5393
|
-
|
|
5394
|
-
|
|
5395
|
-
|
|
5396
|
-
|
|
5397
|
-
|
|
5398
|
-
Windows
|
|
5399
|
-
|
|
5400
|
-
|
|
5401
|
-
|
|
5402
|
-
|
|
5403
|
-
|
|
5404
|
-
Linux
|
|
5405
|
-
|
|
5406
|
-
|
|
5407
|
-
|
|
5408
|
-
|
|
5728
|
+
Mac | Windows | Linux
|
|
5729
|
+
----|---------|------
|
|
5730
|
+
   |    |   
|
|
5409
5731
|
|
|
5410
5732
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
5411
5733
|
|
|
@@ -5439,15 +5761,17 @@ class ColorTheCircles
|
|
|
5439
5761
|
|
|
5440
5762
|
def register_observers
|
|
5441
5763
|
observer = Glimmer::DataBinding::Observer.proc do |new_score|
|
|
5442
|
-
|
|
5443
|
-
|
|
5444
|
-
|
|
5445
|
-
|
|
5446
|
-
|
|
5447
|
-
|
|
5448
|
-
|
|
5449
|
-
|
|
5450
|
-
|
|
5764
|
+
Glimmer::LibUI.queue_main do
|
|
5765
|
+
@score_label.text = new_score.to_s
|
|
5766
|
+
if new_score == -20
|
|
5767
|
+
@game_over = true
|
|
5768
|
+
msg_box('You Lost!', 'Sorry! Your score reached -20')
|
|
5769
|
+
restart_game
|
|
5770
|
+
elsif new_score == 0
|
|
5771
|
+
@game_over = true
|
|
5772
|
+
msg_box('You Won!', 'Congratulations! Your score reached 0')
|
|
5773
|
+
restart_game
|
|
5774
|
+
end
|
|
5451
5775
|
end
|
|
5452
5776
|
end
|
|
5453
5777
|
observer.observe(self, :score) # automatically enhances self to become Glimmer::DataBinding::ObservableModel and notify observer on score attribute changes
|
|
@@ -5611,9 +5935,7 @@ class ColorTheCircles
|
|
|
5611
5935
|
}
|
|
5612
5936
|
|
|
5613
5937
|
@circles_data.each do |circle_data|
|
|
5614
|
-
|
|
5615
|
-
circle_data[:circle] = circle(*circle_data[:args])
|
|
5616
|
-
|
|
5938
|
+
circle_data[:circle] = circle(*circle_data[:args]) {
|
|
5617
5939
|
fill circle_data[:fill]
|
|
5618
5940
|
stroke circle_data[:stroke]
|
|
5619
5941
|
}
|
|
@@ -5648,17 +5970,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
5648
5970
|
ruby -r glimmer-dsl-libui -e "require 'examples/basic_draw_text'"
|
|
5649
5971
|
```
|
|
5650
5972
|
|
|
5651
|
-
Mac
|
|
5652
|
-
|
|
5653
|
-
|
|
5654
|
-
|
|
5655
|
-
Windows
|
|
5656
|
-
|
|
5657
|
-
|
|
5658
|
-
|
|
5659
|
-
Linux
|
|
5660
|
-
|
|
5661
|
-
|
|
5973
|
+
Mac | Windows | Linux
|
|
5974
|
+
----|---------|------
|
|
5975
|
+
 |  | 
|
|
5662
5976
|
|
|
5663
5977
|
[LibUI](https://github.com/kojix2/LibUI) Original Version:
|
|
5664
5978
|
|
|
@@ -5934,20 +6248,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
5934
6248
|
ruby -r glimmer-dsl-libui -e "require 'examples/custom_draw_text'"
|
|
5935
6249
|
```
|
|
5936
6250
|
|
|
5937
|
-
Mac
|
|
5938
|
-
|
|
5939
|
-
|
|
5940
|
-
|
|
5941
|
-
|
|
5942
|
-
Windows
|
|
5943
|
-
|
|
5944
|
-
|
|
5945
|
-
|
|
5946
|
-
|
|
5947
|
-
Linux
|
|
5948
|
-
|
|
5949
|
-
|
|
5950
|
-
|
|
6251
|
+
Mac | Windows | Linux
|
|
6252
|
+
----|---------|------
|
|
6253
|
+
  |   |  
|
|
5951
6254
|
|
|
5952
6255
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
5953
6256
|
|
|
@@ -6154,17 +6457,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
6154
6457
|
ruby -r glimmer-dsl-libui -e "require 'examples/method_based_custom_keyword'"
|
|
6155
6458
|
```
|
|
6156
6459
|
|
|
6157
|
-
Mac
|
|
6158
|
-
|
|
6159
|
-
|
|
6160
|
-
|
|
6161
|
-
Windows
|
|
6162
|
-
|
|
6163
|
-
|
|
6164
|
-
|
|
6165
|
-
Linux
|
|
6166
|
-
|
|
6167
|
-
|
|
6460
|
+
Mac | Windows | Linux
|
|
6461
|
+
----|---------|------
|
|
6462
|
+
 |  | 
|
|
6168
6463
|
|
|
6169
6464
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
6170
6465
|
|
|
@@ -6286,29 +6581,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
6286
6581
|
ruby -r glimmer-dsl-libui -e "require 'examples/tetris'"
|
|
6287
6582
|
```
|
|
6288
6583
|
|
|
6289
|
-
Mac
|
|
6290
|
-
|
|
6291
|
-
|
|
6292
|
-
|
|
6293
|
-
|
|
6294
|
-
|
|
6295
|
-
|
|
6296
|
-
|
|
6297
|
-
Windows
|
|
6298
|
-
|
|
6299
|
-
|
|
6300
|
-
|
|
6301
|
-
|
|
6302
|
-
|
|
6303
|
-
|
|
6304
|
-
|
|
6305
|
-
Linux
|
|
6306
|
-
|
|
6307
|
-
|
|
6308
|
-
|
|
6309
|
-
|
|
6310
|
-
|
|
6311
|
-
|
|
6584
|
+
Mac | Windows | Linux
|
|
6585
|
+
----|---------|------
|
|
6586
|
+
   |    |   
|
|
6312
6587
|
|
|
6313
6588
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
6314
6589
|
|
|
@@ -6468,6 +6743,8 @@ class Tetris
|
|
|
6468
6743
|
end
|
|
6469
6744
|
}
|
|
6470
6745
|
radio_menu_item('Rotate Left on Up Arrow') {
|
|
6746
|
+
checked true
|
|
6747
|
+
|
|
6471
6748
|
on_clicked do
|
|
6472
6749
|
@game.rotate_left_on_up = true
|
|
6473
6750
|
end
|
|
@@ -6516,34 +6793,31 @@ class Tetris
|
|
|
6516
6793
|
bevel_pixel_size = 0.16 * block_size.to_f
|
|
6517
6794
|
color = Glimmer::LibUI.interpret_color(Model::Block::COLOR_CLEAR)
|
|
6518
6795
|
area {
|
|
6519
|
-
block[:background_square] =
|
|
6520
|
-
square(0, 0, block_size)
|
|
6521
|
-
|
|
6796
|
+
block[:background_square] = square(0, 0, block_size) {
|
|
6522
6797
|
fill color
|
|
6523
6798
|
}
|
|
6524
|
-
|
|
6525
|
-
|
|
6526
|
-
|
|
6799
|
+
|
|
6800
|
+
block[:top_bevel_edge] = polygon {
|
|
6801
|
+
point_array 0, 0, block_size, 0, block_size - bevel_pixel_size, bevel_pixel_size, bevel_pixel_size, bevel_pixel_size
|
|
6527
6802
|
fill r: color[:r] + 4*BEVEL_CONSTANT, g: color[:g] + 4*BEVEL_CONSTANT, b: color[:b] + 4*BEVEL_CONSTANT
|
|
6528
6803
|
}
|
|
6529
|
-
|
|
6530
|
-
|
|
6531
|
-
|
|
6804
|
+
|
|
6805
|
+
block[:right_bevel_edge] = polygon {
|
|
6806
|
+
point_array block_size, 0, block_size - bevel_pixel_size, bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size, block_size, block_size
|
|
6532
6807
|
fill r: color[:r] - BEVEL_CONSTANT, g: color[:g] - BEVEL_CONSTANT, b: color[:b] - BEVEL_CONSTANT
|
|
6533
6808
|
}
|
|
6534
|
-
|
|
6535
|
-
|
|
6536
|
-
|
|
6809
|
+
|
|
6810
|
+
block[:bottom_bevel_edge] = polygon {
|
|
6811
|
+
point_array block_size, block_size, 0, block_size, bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size
|
|
6537
6812
|
fill r: color[:r] - BEVEL_CONSTANT, g: color[:g] - BEVEL_CONSTANT, b: color[:b] - BEVEL_CONSTANT
|
|
6538
6813
|
}
|
|
6539
|
-
|
|
6540
|
-
|
|
6541
|
-
|
|
6814
|
+
|
|
6815
|
+
block[:left_bevel_edge] = polygon {
|
|
6816
|
+
point_array 0, 0, 0, block_size, bevel_pixel_size, block_size - bevel_pixel_size, bevel_pixel_size, bevel_pixel_size
|
|
6542
6817
|
fill r: color[:r] - BEVEL_CONSTANT, g: color[:g] - BEVEL_CONSTANT, b: color[:b] - BEVEL_CONSTANT
|
|
6543
6818
|
}
|
|
6544
|
-
|
|
6545
|
-
|
|
6546
|
-
|
|
6819
|
+
|
|
6820
|
+
block[:border_square] = square(0, 0, block_size) {
|
|
6547
6821
|
stroke COLOR_GRAY
|
|
6548
6822
|
}
|
|
6549
6823
|
|
|
@@ -6703,35 +6977,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
6703
6977
|
ruby -r glimmer-dsl-libui -e "require 'examples/tic_tac_toe'"
|
|
6704
6978
|
```
|
|
6705
6979
|
|
|
6706
|
-
Mac
|
|
6707
|
-
|
|
6708
|
-
|
|
6709
|
-
|
|
6710
|
-
|
|
6711
|
-
|
|
6712
|
-
|
|
6713
|
-
|
|
6714
|
-
|
|
6715
|
-
|
|
6716
|
-
Windows
|
|
6717
|
-
|
|
6718
|
-
|
|
6719
|
-
|
|
6720
|
-
|
|
6721
|
-
|
|
6722
|
-
|
|
6723
|
-
|
|
6724
|
-
|
|
6725
|
-
|
|
6726
|
-
Linux
|
|
6727
|
-
|
|
6728
|
-
|
|
6729
|
-
|
|
6730
|
-
|
|
6731
|
-
|
|
6732
|
-
|
|
6733
|
-
|
|
6734
|
-
|
|
6980
|
+
Mac | Windows | Linux
|
|
6981
|
+
----|---------|------
|
|
6982
|
+
    |     |    
|
|
6735
6983
|
|
|
6736
6984
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
6737
6985
|
|
|
@@ -6783,14 +7031,12 @@ class TicTacToe
|
|
|
6783
7031
|
|
|
6784
7032
|
3.times.map do |column|
|
|
6785
7033
|
area {
|
|
6786
|
-
|
|
6787
|
-
square(0, 0, 60)
|
|
6788
|
-
|
|
7034
|
+
square(0, 0, 60) {
|
|
6789
7035
|
stroke :black, thickness: 2
|
|
6790
7036
|
}
|
|
6791
7037
|
text(23, 19) {
|
|
6792
7038
|
@cells[row] << string('') {
|
|
6793
|
-
font family: 'Arial', size: 20
|
|
7039
|
+
font family: 'Arial', size: OS.mac? ? 20 : 16
|
|
6794
7040
|
}
|
|
6795
7041
|
}
|
|
6796
7042
|
on_mouse_up do
|
|
@@ -6841,23 +7087,9 @@ Run with this command if you installed the [Ruby gem](https://rubygems.org/gems/
|
|
|
6841
7087
|
ruby -r glimmer-dsl-libui -e "require 'examples/snake'"
|
|
6842
7088
|
```
|
|
6843
7089
|
|
|
6844
|
-
Mac
|
|
6845
|
-
|
|
6846
|
-
|
|
6847
|
-
|
|
6848
|
-
|
|
6849
|
-
|
|
6850
|
-
Windows
|
|
6851
|
-
|
|
6852
|
-
|
|
6853
|
-
|
|
6854
|
-
|
|
6855
|
-
|
|
6856
|
-
Linux
|
|
6857
|
-
|
|
6858
|
-
|
|
6859
|
-
|
|
6860
|
-
|
|
7090
|
+
Mac | Windows | Linux
|
|
7091
|
+
----|---------|------
|
|
7092
|
+
  |   |  
|
|
6861
7093
|
|
|
6862
7094
|
New [Glimmer DSL for LibUI](https://rubygems.org/gems/glimmer-dsl-libui) Version:
|
|
6863
7095
|
|