Pular para o conteúdo principal

Show data in JavaFX is made easy by DataFX project

A friend of mine, Teles Maciel, was scrapping a page that contains all the Islam formal prayers schedule for 2012 for who lives in São Paulo. He aims to create an app for mobile. While checking his sample XML I decided to use DataFX project to show these data, and I created an app in less than 5 minutes!

The DataFX project


It's divided in two main parts: Cell Factories and Data Sources and there is the RedFX integration.

Data Sources objective is to facilitate the access to XML/JDBC/CSV/JSON data and show in JavaFX. For example, you can read an XML file and visualize the data in a JavaFX table with a few lines of code.
Talking in code, you basically need to know the following Interfaces to use DataFX:

- DataSourceReader: Responsile for reading a source of data. Two classes that implements this interface are NetworkSource and FileSource;

- DataSource: Responsible for create the JavaFX(e.g. TableColumn, ObsevableLists) stuffs from the DataSourceReader. From this class, you can retrieve the items and the columns from the DataSourceReader. There's a Data Source implementation for each specific format, for example: XMLDataSource, ObjectDataSource, CSVDataSource and more sources are planned in future project releases.

If you want to know more about DataFX I recommend you to see the Jonathan Giles and Johan Vos presentation and read the API JavaDoc.

The "Salah Time" application


Let's start talking about this application showing the data we want to show:

 <?xml version="1.0" encoding="UTF-8"?>  
 <oracoes>  
 <oracao>  
 <nome>fajr</nome>  
 <dia>01/01</dia>  
 <horario tipo="verao">03:55</horario>  
 </oracao>  
 <oracao>  
 </oracao>  
 ...  
 </oracoes>  

As you can see, we have a pretty simple XML. The "horario"(time) tag has a "tipo"(type) attribute that may have two possible values: "verao"(summer, for daylight saving time) and "comum"(common, for common time). Imagine if you would show these data the first step would parse the data and then show according the toolkit/API you are using. For example, in JavaFX you would have to create a table and its columns. It is not hard, but a repetitive task when you just want to show the data or when you have a lot of files to show and that's when DataFX starts to help you.

The first thing I had to do was load my file using FileSource:

 FileSource fs = new FileSource("oracoes.xml");  

Then I created my XMLDataSource using this FileSource, the tag name ("oracao") and the columns I want to retrieve from oracao: nome, dia and horario. Here is the code (yes, one line):

 XMLDataSource<String[], Object> salatDataSource = new XMLDataSource<String[], Object>(  
 fs, "oracao", "nome", "dia", "horario");  

Now the last step is simply integrate XMLDataSource with a TableView. I just had to retrieve the columns I want and add it to my TableView and the items is the DataSource itself:


 package org.salattime.main;  
 import javafx.application.Application;  
 import javafx.scene.SceneBuilder;  
 import javafx.scene.control.TableColumn;  
 import javafx.scene.control.TableView;  
 import javafx.stage.Stage;  
 import org.javafxdata.datasources.io.FileSource;  
 import org.javafxdata.datasources.protocol.XMLDataSource;  
 /**  
  *   
  * So, I want to read the data from oracoes.xml and show in a table. This class  
  * will do it  
  *   
  * @author jesuino  
  *   
  */  
 public class Main extends Application {  
      @SuppressWarnings("unchecked")  
      @Override  
      public void start(Stage stage) throws Exception {  
           stage.setTitle("Salats do ano de 2012");  
           // Just loading the file...  
           FileSource fs = new FileSource("oracoes.xml");  
           // Now creating my datasource, I just need to inform my columns and  
           // oracao, because it is the root of the columns I want  
           XMLDataSource<String[], Object> salatDataSource = new XMLDataSource<String[], Object>(  
                     fs, "oracao", "nome", "dia", "horario");  
           @SuppressWarnings("rawtypes")  
           TableView salats = new TableView();  
           TableColumn<?, ?> nomeCol = salatDataSource.getNamedColumn("nome");  
           TableColumn<?, ?> diaCol = salatDataSource.getNamedColumn("dia");  
           TableColumn<?, ?> horarioCol = salatDataSource  
                     .getNamedColumn("horario");  
           salats.getColumns().addAll(nomeCol, diaCol, horarioCol);  
           salats.setItems(salatDataSource);  
           stage.setScene(SceneBuilder.create().root(salats).build());  
           stage.show();  
      }  
      public static void main(String[] args) {  
           Application.launch(args);  
      }  
 }  

Here is the result:



Further use of DataFX(the DataSource part)


This sample seems very simple, but here are some uses for DataFX you may consider:

- Visualization of a REST API result using the NetworkSource;
- Help you to show data in multiple formats with a small portion of code with FileSource and the currently available DataSources implementations (more will come in a future);
- In future, read data from database with a JDBC DataSource;


Remember this project is just getting started, there are more to come :-)

Comentários

Postar um comentário

Postagens mais visitadas deste blog

Simplest JavaFX ComboBox autocomplete

Based on this Brazilian community post , I've created a sample Combobox auto complete. What it basically does is: When user type with the combobox selected, it will work on a temporary string to store the typed text; Each key typed leads to the combobox to be showed and updated If backspace is type, we update the filter Each key typed shows the combo box items, when the combobox is hidden, the filter is cleaned and the tooltip is hidden:   The class code and a sample application is below. I also added the source to my personal github , sent me PR to improve it and there are a lot of things to improve, like space and accents support.

Dancing lights with Arduino - The idea

I have been having fun with Arduino these days! In this article I am going to show how did I use an electret mic with Arduino to create a Dancing Lights circuit. Dancing Lights   I used to be an eletronician before starting the IT college. I had my own electronics maintenance office to fix television, radios, etc. In my free time I used to create electronic projects to sell and I made a few "reais" selling a version of Dancing lights, but it was too limited: it simply animated lamps using a relay in the output of a 4017 CMOS IC. The circuit was a decimal counter  controlled by a 555. 4017 decimal counter. Source in the image When I met Arduino a few years ago, I was skeptical because I said: I can do this with IC, why should I use a microcontroller. I thought that Arduino was for kids. But now my pride is gone and I am having a lot of fun with Arduino :-) The implementation of Dancing Lights with Arduino uses an electret mic to capture the sound and light leds...

Creating custom Work Item Handler in BPM Suite/jBPM 6

Hi all! In this post I am going to share my experience creating a work item handler for BPM Suite 6.0.3 (which is very similar to jbpm as explained in a previous post ). The Hello World Work Item Handler Let's create a really simple WorkItemHandler just to print "Hello World" in the console. Of course you can implement more feature and make it receive parameters, access database, web services, etc. But in this post we will keep it simple. Really simple. First thing to do is to create a maven project for my WorkItemHandler. Here's the pom.xml of my Maven project: Notice that we are importing jbpm dependency so we can find the java interface that is used to create work item handlers. Now we can start coding. Let's create a class name HelloWorkItemHandler in package org.jugvale.jbpm, here is the simple code: Now we can build our project and go to BPM Suite to configure it so we can use this workitem. Registering the WorkItemHandler UPDATE...