Aprende Java Aprende Php Aprende C++ Aprende HTML 5 Aprende JavaScript Aprende JSON Aprende MySQL Aprende SQLServer Aprende Visual Basic 6 Aprende PostgreSQL Aprende SQLite Aprende Redis Aprende Kotlin Aprende XML Aprende Linux VSC Aprende Wordpress Aprende Laravel Aprende VueJS Aprende JQuery Aprende Bootstrap Aprende Netbeans Aprende Android
Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube Sigueme en TikTok Sigueme en Whatsapp
Home / JavaFX / JavaFX y ApiRest – GET

JavaFX y ApiRest – GET

Por jc mouse domingo, febrero 14, 2016

En este tutorial construiremos una aplicación en JavaFX para leer datos de un servicio web

Herramientas

  • IDE Netbeans 8.x + java + javaFX
  • Librería  java-json.jar
  • Conocimientos sobre JSON (JavaScript Object Notation)
  • Servidor Web (XAMPP, AppServ, etc)

Tiempo 20 minutos

Paso 1: Crear el proyecto

Archivo → Proyecto Nuevo → JavaFX (Categoria) → JavaFX FXML Application (Proyectos) → NEXT

a continuación escribimos nombre del proyecto y nombre del archivo FXML como se a continuación:

api

presionar Terminar para crear el proyecto.

Paso 2: Agregar librería

Añade la librería java-json.jar al proyecto

Paso 3: Clases

En el mismo paquete de la vista,  crea una clase que se llamara «Country.java«, esta clase nos permitirá interactuar con los datos que obtengamos del servidor y con la vista de la aplicación.

package jfxget;
import javafx.beans.property.SimpleStringProperty;
/**
 * @web https://www.jc-mouse.net/
 * @author jcmouse
 */
public class Country {
    
    private final SimpleStringProperty countryName = new SimpleStringProperty();
    private final SimpleStringProperty capitalName = new SimpleStringProperty();
    private final SimpleStringProperty population = new SimpleStringProperty();

    public Country() {}
    
    public Country(String countryname, String capitalname, String num) {
        countryName.set(countryname);
        capitalName.set(capitalname);
        population.set(num);
    }
    
    public String getCountryName() {
        return countryName.get();
    }

    public void setCountryName(String value) {
        countryName.set(value);
    }
    
    public SimpleStringProperty countryNameProperty() {
        return countryName;
    }    

    public String getCapitalName() {
        return capitalName.get();
    }

    public void setCapitalName(String value) {
        capitalName.set(value);
    }

    public SimpleStringProperty capitalNameProperty() {
        return capitalName;
    }
    
    public String getPopulation() {
        return population.get();
    }

    public void setPopulation(String value) {
        population.set(value);
    }

    public SimpleStringProperty populationProperty() {
        return population;
    }

}

Debes tener algo como esto:

proyecto api rest

Paso 4: La vista

Abre el archivo «FXMLGet.fxml» clic derecho → Open. Por defecto al crear el proyecto, se creo un Button y un Label, elimina el label y añade un TableView, del table elimina las columnas. Ordena y añade los fx:id como se ve en la imagen de abajo:

view studio builder

Guarda los cambios y cierra el Scene Builder

Paso 5: El Servicio Web

Un WebService es algo complicado y largo de hacer, como no es el objetivo de este tutorial, reduciremos este apirest (si es que podemos llamarlo así) a un archivo de texto. Este archivo de texto se llamara «country.txt» y debemos colocar en una carpeta de nuestro servidor, por ejemplo «C:\xampp\htdocs\webservice\country.txt», el contenido de este archivo estará en formato JSON:

[{
	"countryName": "Bolivia",
	"capitalName": "Sucre",
	"population": "11 040 300 Hab."
}, {
	"countryName": "Brasil",
	"capitalName": "Brasilia",
	"population": "200 400 012 Hab."
}, {
	"countryName": "Canada",
	"capitalName": "Ottawa",
	"population": "32 742 990 Hab."
}, {
	"countryName": "Japon",
	"capitalName": "Tokio",
	"population": "7 430 021 Hab."
}, {
	"countryName": "Australia",
	"capitalName": "Canberra",
	"population": "51 320 100 Hab."
}]

Para acceder a este archivo desde un navegador usamos la URL «http://localhost/webservice/country.txt»

Paso 6: El controlador

Abre el archivo «FXMLGetController.java«, por defecto al crear el proyecto te debió crear el siguiente código:

public class FXMLGetController implements Initializable {
    
    @FXML
    private Label label;
    
    @FXML
    private void handleButtonAction(ActionEvent event) {
        System.out.println("You clicked me!");
        label.setText("Hello World!");
    }
    
    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
    }    
    
}

Reemplaza por:

package jfxget;

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.ResourceBundle;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.PropertyValueFactory;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

/**
 * @web https://www.jc-mouse.net/
 * @author jc mouse
 */
public class FXMLGetController implements Initializable {
    
    @FXML private TableView<Country> tableview;
    private ObservableList<Country> data;
    
    @FXML
    private void handleButtonAction(ActionEvent event) {
        
        BufferedReader bufferedReader;
        StringBuilder stringBuilder;
        String line;
        try {
            //direccion a nuetro api rest 
            URL url = new URL("http://localhost/webservice/country.txt");
            //realiza la conexión
            HttpURLConnection connection = (HttpURLConnection) url.openConnection();
            connection.setRequestMethod("GET");            
            connection.connect(); 
            if(connection.getResponseCode()==200){  
                //obtiene respuesta
                bufferedReader  = new BufferedReader(new InputStreamReader(connection.getInputStream()));
                stringBuilder = new StringBuilder();            
                while ((line = bufferedReader.readLine()) != null)
                {
                    stringBuilder.append(line);
                }
                //limpia datos del tableview
                tableview.getItems().removeAll(data);
                //convierte a formato JSON el texto leido del servidor web, el texto que leemos del servidor
                //es un array asi que usamos JSONArray
                JSONArray dataArray  = new JSONArray(stringBuilder.toString());
                //lee los datos del array JSON y agrega al tableview
                for(int i = 0 ; i < dataArray.length(); i++){
                   JSONObject row = dataArray.getJSONObject(i);                   
                   data.add(new Country(row.getString("countryName"), row.getString("capitalName"),  row.getString("population") ));
                }
            }
        } catch (MalformedURLException ex) {
            System.err.println("MalformedURLException: " +  ex.getMessage() );            
        } catch (IOException ex) {
            System.err.println( "IOException: " + ex.getMessage() );            
        } catch (JSONException ex) {
            System.err.println( "JSONException: " + ex.getMessage() );       
        } 
    }
    
    @Override
    public void initialize(URL url, ResourceBundle rb) {
        
        //nombre de las columnas
        TableColumn colName = new TableColumn("Pais");
        TableColumn colLastName = new TableColumn("Capital");
        TableColumn colCareer = new TableColumn("Población");
        //relaciona el valor para cada columna
        colName.setCellValueFactory(new PropertyValueFactory<>("countryName"));
        colLastName.setCellValueFactory(new PropertyValueFactory<>("capitalName"));
        colCareer.setCellValueFactory(new PropertyValueFactory<>("population"));
        //añade columnas al tableview
        tableview.getColumns().addAll(colName); 
        tableview.getColumns().addAll(colLastName); 
        tableview.getColumns().addAll(colCareer);    
        //inicializamos datos
        data = tableview.getItems();          
    }    
    
}

Ejecuta y prueba. Cuando presiones el botón, se conectara con el servidor y mostrara los datos en el tableview, si añades o eliminas datos en el archivo de texto, cuando vuelvas a presionar el botón «Load JSON«, los datos se actualizaran.

javafx get

Descargar proyecto JavaFX – GET

enjoy!!!

Tags

Artículos similares

Rompecabezas con forma irregular

En este post vemos una manera de como crear un juego de rompecabezas en java sin el uso de java2d, ademas, las piezas de[...]

Laberinto del Terror (Código Fuente + juego)

El laberinto del terror es un juego en el que haciendo uso del ratón y de tu pulso de borracho debes cruzar distintos la[...]

WhatsApp: Aprende a usar la nueva función ‘Estado’

A continuación te mostramos una guía sobre la nueva nueva función ‘estado‘ de WhatsApp.  Primero que nada, a[...]

Construye la interfaz de facebook

En este tutorial veremos un poco lo que es el diseño de interfaces en android, en lugar de colocar el ejemplo de uso de[...]

Conectar C Sharp con MySQL

Ya tengo varios post sobre conexión a base de datos en varios lenguajes y claro no podía faltar c#, el siguiente tutoria[...]

Modo Mantenimiento sin Consola: Archivo DOWN

La forma que tiene Laravel en poner una aplicación en Modo Mantenimiento es por consola mediante el comando: Sin embargo[...]