Skip to main content

Adding Items to a ListView using Scala, ScalaFX and FXML

I have been playing with writing an application using Scala, with its API defined in ScalaFX, which wraps the powerful JavaFX library. For simple exercises, coding the UI by hand was enough. But for more complex forms, I began using the JavaFX Scene Builder tool.

Fortunately, others have blazed this trail, and there are fairly stable ScalaFX and ScalaFXML libraries available.

Using the Scene Builder tool, I laid out my form and included a ListBox to hold possible gender selections.

The Scene Builder tool generated fxml code such as:
<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="208.0" prefWidth="275.0" xmlns="" xmlns:fx="">
      <Label layoutX="14.0" layoutY="30.0" text="Name" />
      <Label layoutX="14.0" layoutY="71.0" text="Gender" />
      <TextField fx:id="name" layoutX="95.0" layoutY="26.0" />
      <ListView fx:id="genderOptions" layoutX="95.0" layoutY="71.0" prefHeight="70.0" prefWidth="149.0" />

That lays out the user interface. Now I need a Controller (if you like MVC) or Presenter (if you prefer MVP) class. I specified the class in the usual way in the fxml file, and created the Scala class to match. It looked like this:
class SimpleFormPresenter (
   private val name: TextField,
   private val genderOptions: ListView[String],
   private val myDependency:MySimpleFormDependency) { 

The @sfxml annotation triggers the ScalaFXML tool's macros to do the magic bridging between Scala, JavaFX, and FXML. We'll leave more information about that whole process for another day.

Now I need to populate the ListView with the Gender possibilities that my application will use. But how? We have an immutable ListView parameter being provided to the controller, how do we load its contents? Sifting through some examples from the ScalaFXML pages, I see this, which in their demo adds items to a ComboBox control named "types":
// Filling the combo box
for (converter <- converters.available) {
  types += converter

Sadly, trying something like that for my Gender ListView does not work. Sticking this into the Presenter class:
  genderOptions += "Male"
creates a compile error. And just as the compile error says, there is no "+=" available on the ListView class.
[error] C:\Users\steve\samples\SimpleFormPresenter.scala:23: value += is not a member of scalafx.scene.control.ListView[String]
[error]   genderOptions += "Male"

Digging into the ScalaFX API, we discover that the contents are held in the member "items" and that it is an ObjectProperty[ObservableList] object.
def items: ObjectProperty[ObservableList[T]]
  The underlying data model for the ListView.

The ScalaFX wrapper class for the JavaFX ObservableList is scalafx.collections.ObservableBuffer, and the API assures us that it is mutable.

The upshot is that, while we have declared the genderOptions parameter immutable with the val identifier, we can still access its mutable contents. Such as:
  val genders = ObservableBuffer("Male")
  genders += "Female"
  genderOptions.items = genders

Here, we create a new ObservableBuffer with one value. We then demonstrate its "+=" member to add a second item, and set the ListView's data model to this ObservableBuffer. When we run it via sbt, it compiles cleanly and produces a ListView like this when run:

With that figured out, we can extract the responsibility for looking up the set of Genders in the application to another class, or another tier in our design. Maybe something like this that, for now, is hard-coded but might grow into a database lookup as the system evolves:
object GenderTypes {
  def getAll(): ObservableBuffer[String]  = {
    ObservableBuffer("Male", "Female")

And back in our SimpleFormPresenter class, change the population of the genderOptions ListView to:
  genderOptions.items = GenderTypes.getAll()


Popular posts from this blog

Trigger Windows Scheduled Task from Remote Computer via Jenkins

One thing I love about working in Information Technology is the opportunity - the NEED - to constantly learn new things. If a week goes by in which I have not looked up something on StackOverflow or other message boards, I start lobbying my team for more challenges.

This week, I learned the power of running "SCHTASKS.exe" from a command-line script for a remote server in a Microsoft Windows environment.

If you don't know Schtasks, you can read up on it here:

In a nutshell, it is the command-line interface for the Windows Task Scheduler, and allows you (or a system administrator) to create, change, run, query, terminate, and delete scheduled tasks on a work-station, either the local one or a remote one.

Not all of the features are available in older versions. In my scenario below, this was relevant as the local computer will be a Windows 8 machine, and the remote server is, shall we say, a muc…

Fixing "resource modena.css not found" in SBT

I have a project that is building a system in Scala. Its GUI is being defined using the ScalaFX system, which is a thin layer that delegates to the underlying JavaFX tools, components and features.

The application was running with a fine-looking GUI in early testing, but all the builds were being driven by the IDE. For various reasons, we wanted to migrate the build to the SBT system.

But upon launching with
$ sbt run
we would get entries like this in the console:
[info] Running StartHere
May 21, 2016 8:50:28 PM com.sun.javafx.css.StyleManager loadStylesheetUnPrivileged
WARNING: Resource "com/sun/javafx/scene/control/skin/modena/modena.css" not found.

The application would compile without issue and would run correctly, but looked terrible. For instance there would be no edges visible for buttons or for text box input fields.

Obviously, a dependency was missing from the build.sbt file. It was easy enough to add, with a line like the following:
unmanagedJars in Compile += Attribute…