JavaFX Puzzler 3 - First Correct Solution Gets Free JavaFX Script eBook

This post contains JavaFX Puzzler 3, which will make use of some of the JavaFX concepts that you've learned from this blog, including ones that you've explored in the resources to which I've been pointing you (hint: especially the Learning JavaFX Script, Part 1 tutorial, and the ListBox section of the Learning More About the JavaFX Script Language Tutorial).  The first person to post a comment with a correct solution will be given a free JavaFX Script: Dynamic Java Scripting for Rich Internet/Client-side Applications eBook (PDF download).  When submitting your answer, be sure to put your correct email address in the  "Email Address: (Not displayed with comment.)" text field on the comment form so that I can contact you with the information to obtain your free eBook.

Requirements for Puzzler 3: The BindListBoxToSequence Program

Here is a screenshot of the sample solution:

The requirements for this program are as follows:

1. The UI must have a similar, but not necessarily identical, appearance as the screenshot shown above.
2. The program must contain a class named ListBoxModel that contains an attribute named entries.  The entries attribute contains a sequence (array) of type String.  Note: ListBoxModel and entries are arbitrary names, not required by JavaFX Script.
3. When the user types a word into the text field and clicks the Add Element button, the word is added to the entries sequence.  The Add Element button must be the default button, so when the user types into the text field and presses the Enter key, the same result occurs.
4. The cells attribute of the ListBox must be bound to the entries attribute of the ListBoxModel, so as elements are added to the sequence, they appear in the ListBox.

By the way, if you're looking for some starter code like I supplied in the last Puzzler, you won't find any. :-D

Enjoy!
Jim Weaver
JavaFX Script: Dynamic Java Scripting for Rich Internet/Client-side Applications
eBook (PDF) download available at the book's Apress site

Comments

[Lucas Benedicic]

And so, the entire solution:

/*
* ListBoxModel.fx
*
* Created on Nov 14, 2007, 7:23:04 PM
*/

package javafxpuzzler;

import javafx.ui.*;

public class ListBoxModel
{
attribute entries : String *;
attribute newEntry : String;
}

Frame {
var model = ListBoxModel {
entries: ["Pepe", "Coco"]
}
title: "ListBox Example"
content: BorderPanel {
bottom: ListBox {
cells: bind foreach (entry in model.entries)
ListCell {
text: entry
}
}
center: FlowPanel {
content:
[Button {
text: "Add Element"
action: operation ( ) {
insert model.newEntry as last into model.entries;
}
},
TextField {
columns: 30
value: bind model.newEntry
text: bind model.newEntry
action: operation ( ) {
insert model.newEntry as last into model.entries;
}
},
RigidArea {
width: 5
}]
}
}
visible: true
}

[Lucas Benedicic]

Because of the hurry in sending the solution, I've found out that with this line:

text: bind model.newEntry

inside the TextField component of the FlowPanel, it works without "random" behavior ... :-)

[Lucas Benedicic]

/*
* ListBoxModel.fx
*
* Created on Nov 14, 2007, 7:03:04 PM
*/

package javafxpuzzler;

import javafx.ui.*;

public class ListBoxModel
{
attribute entries : String *;
attribute newEntry : String;
}

Frame {
var model = ListBoxModel {
entries: ["Pepe", "Coco"]
}
title: "ListBox Example"
content: BorderPanel {
bottom: ListBox {
cells: bind foreach (entry in model.entries)
ListCell {
text: entry
}
}
center: FlowPanel {
content:
[Button {
text: "Add Element"
action: operation ( ) {
insert model.newEntry as last into model.entries;
}
},
RigidArea {
width: 5
},
TextField {
columns: 30
value: bind model.newEntry
action: operation ( ) {
insert model.newEntry as last into model.entries;
}
},
RigidArea {
width: 5
}]
}
}
visible: true
}

[codecraig]

I'm gonna work on this on my own since I already won a copy of the book :)