README.markdown in glimmer-0.4.3 vs README.markdown in glimmer-0.4.4
- old
+ new
@@ -100,18 +100,18 @@
### Option 1: Direct Install
Run this command to install directly:
```
-jgem install glimmer -v 0.4.3
+jgem install glimmer -v 0.4.4
```
### Option 2: Bundler
Add the following to `Gemfile`:
```
-gem 'glimmer', '~> 0.4.3'
+gem 'glimmer', '~> 0.4.4'
```
And, then run:
```
bundle install
@@ -566,9 +566,116 @@
@tic_tac_toe_board.reset
end
# ...
end
```
+
+## Custom Widgets
+
+Glimmer supports creating custom widgets with minimal code, which automatically extends Glimmer's DSL syntax with an underscored lowercase keyword.
+
+Simply create a new class that includes `Glimmer::SWT::CustomWidget` and put Glimmer DSL code in its `#body` method (its return value is stored in `#body_root` attribute). Glimmer will then automatically recognize this class by convention when it encounters a keyword matching the class name converted to underscored lowercase (and namespace double-colons `::` replaced with double-underscores `__`)
+
+**Example:**
+
+Definition:
+```ruby
+class RedLabel
+ include Glimmer::SWT::CustomWidget
+ def body
+ label(swt_style) {
+ background :red
+ }
+ end
+end
+```
+
+Usage:
+```ruby
+shell {
+ red_label {
+ text 'Red Label'
+ }
+}
+```
+
+As you can see, `RedLabel` became Glimmer DSL keyword: `red_label`
+
+**Another Example:**
+
+Definition:
+```ruby
+module Red
+ class Composite
+ include Glimmer::SWT::CustomWidget
+ def body
+ composite(swt_style) {
+ background :red
+ }
+ end
+ end
+```
+
+Usage:
+```ruby
+shell {
+ red__composite {
+ label {
+ foreground :white
+ text 'This is showing inside a Red Composite'
+ }
+ }
+}
+```
+
+Notice how `Red::Composite` became `red__composite` with double-underscore, which is how Glimmer Custom Widgets signify namespaces by convention.
+
+Custom Widgets have the following attributes available to call from inside the `#body` method:
+- `#parent`: Glimmer object parenting custom widget
+- `#swt_style`: SWT style integer. Can be useful if you want to allow consumers to customize a widget inside the custom widget body
+- `#options`: a hash of options passed in parentheses when declaring a custom widget (useful for passing in model data) (e.g. `calendar(events: events)`). Custom widget class can declare option names (array) with `.options` method as shown below (not to be confused with `#options` instance method for retrieving options hash containing names & values)
+- `#content`: nested block underneath custom widget. It will be automatically called at the end of processing the custom widget body. Alternatively, the custom widget body may call `content.call` at the place where the content is needed to show up as shown in the following example.
+
+**Content/Options Example:**
+
+Definition:
+```ruby
+class Sandwich
+ include Glimmer::SWT::CustomWidget
+ options :orientation, :bg_color
+ def body
+ composite(swt_style) { # gets custom widget style
+ fill_layout orientation # using orientation option
+ background container_background # using container_background option
+ label {
+ text 'SANDWICH TOP'
+ }
+ content.call # this is where content block is called
+ label {
+ text 'SANDWICH BOTTOM'
+ }
+ }
+ end
+end
+```
+
+Usage:
+```ruby
+shell {
+ sandwich(:no_focus, orientation: :horizontal, bg_color: :white) {
+ label {
+ text 'SANDWICH CONTENT'
+ }
+ }
+}
+```
+
+Notice how `:no_focus` was the `swt_style` value, followed by the `options` hash `{orientation: :horizontal, bg_color: :white}`, and finally the `content` block containing the label with `'SANDWICH CONTENT'`
+
+The following additional attributes may be called from outside a custom widget in addition to the attributes mentioned above, assuming it's been captured in a variable:
+- `#body_root`: top-most root Glimmer widget returned in `#body` method
+- `#widget`: actual SWT widget for `body_root`
+
## Samples
Check the [samples](https://github.com/AndyObtiva/glimmer/tree/master/samples) directory for examples on how to write Glimmer applications. To run a sample, make sure to install the `glimmer` gem first and then use the `glimmer` command to run it (alternatively, you may clone the repo, follow [CONTRIBUTING.md](https://github.com/AndyObtiva/glimmer/blob/master/CONTRIBUTING.md) instructions, and run samples locally with development glimmer command: `bin/glimmer --dev`).