Hướng dẫn sử dụng JavaFX Spinner
Công ty Vĩnh Cửu tuyển dụng lập trình viên Java

1- JavaFX Spinner

Spinner tương tự với ComboBox hoặc List, nó cho phép người dùng lựa chọn từ một tập giá trị. Giống với ComboBox có thể hiệu chỉnh, Spinner cũng cho phép người dùng thêm các giá trị. Không giống với ComboBox, Spinner không có danh sách sổ xuống, nó không hiển thị danh sách các giá trị có thể, tại một thời điểm nó chỉ hiển thị một giá trị hiện thời. Nó thường sử dụng thay thế cho ComboBox hoặc List khi tập hợp các giá trị có thể là rất lớn.
Cấu trúc của Spinner:

2- Ví dụ với Spinner

Ví dụ đơn giản dưới đây minh họa một Spinner với các giá trị số.
SpinnerDemo.java
package org.o7planning.javafx.spinner;

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Spinner;
import javafx.scene.control.SpinnerValueFactory;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;

public class SpinnerDemo extends Application {

   @Override
   public void start(Stage stage) {

       Label label = new Label("Select Level:");
       final Spinner<Integer> spinner = new Spinner<Integer>();

       final int initialValue = 3;
 
       // Nhà máy tạo ra tập các giá trị.
       SpinnerValueFactory<Integer> valueFactory = //
               new SpinnerValueFactory.IntegerSpinnerValueFactory(1, 5, initialValue);

       spinner.setValueFactory(valueFactory);

       FlowPane root = new FlowPane();
       root.setHgap(10);
       root.setVgap(10);
       root.setPadding(new Insets(10));

       root.getChildren().addAll(label, spinner);

       Scene scene = new Scene(root, 400, 200);

       stage.setTitle("JavaFX Spinner (o7planning.org)");
       stage.setScene(scene);
       stage.show();
   }

   public static void main(String[] args) {
       Application.launch(args);
   }

}

Ví dụ 2:

SpinnerDemo2.java
package org.o7planning.javafx.spinner;

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Spinner;
import javafx.scene.control.SpinnerValueFactory;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;

public class SpinnerDemo2 extends Application {

   @Override
   public void start(Stage stage) {

       Label label = new Label("Select Month:");

       ObservableList<String> months = FXCollections.observableArrayList(//
               "January", "February", "March", "April", //
               "May", "June", "July", "August", //
               "September", "October", "November", "December");

       final Spinner<String> spinner = new Spinner<String>();
 
       // Nhà máy tạo ra tập các giá trị.
       SpinnerValueFactory<String> valueFactory = //
               new SpinnerValueFactory.ListSpinnerValueFactory<String>(months);
     
       // Giá trị mặc định.
       valueFactory.setValue("February");

       spinner.setValueFactory(valueFactory);

       FlowPane root = new FlowPane();
       root.setHgap(10);
       root.setVgap(10);
       root.setPadding(new Insets(10));

       root.getChildren().addAll(label, spinner);

       Scene scene = new Scene(root, 400, 200);

       stage.setTitle("JavaFX Spinner (o7planning.org)");
       stage.setScene(scene);
       stage.show();
   }

   public static void main(String[] args) {
       Application.launch(args);
   }

}

3- Spinner và Styles

JavaFX Spinner có thể sét đặt vị trí và hướng cho các nút mũi tên, nếu không được chỉ định, mặc định là bên phải và hướng thẳng đứng.
SpinnerStyleDemo.java
package org.o7planning.javafx.spinner;

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Spinner;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;

public class SpinnerStyleDemo extends Application {

    @Override
    public void start(Stage stage) {

        String[] styleClasses = new String[] { "", // Default.
                Spinner.STYLE_CLASS_ARROWS_ON_RIGHT_HORIZONTAL, //
                Spinner.STYLE_CLASS_ARROWS_ON_LEFT_VERTICAL, //
                Spinner.STYLE_CLASS_ARROWS_ON_LEFT_HORIZONTAL, //
                Spinner.STYLE_CLASS_SPLIT_ARROWS_VERTICAL, //
                Spinner.STYLE_CLASS_SPLIT_ARROWS_HORIZONTAL

        };

        FlowPane root = new FlowPane();
        root.setHgap(10);
        root.setVgap(10);
        root.setPadding(new Insets(10));

        for (String styleClass : styleClasses) {
            Spinner<Integer> spinner = new Spinner<Integer>(1, 20, 10);
            spinner.getStyleClass().add(styleClass);
            root.getChildren().add(spinner);
        }

        Scene scene = new Scene(root, 400, 200);

        stage.setTitle("JavaFX Spinner (o7planning.org)");
        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        Application.launch(args);
    }

}

4- Spinner và Change Event

Thông thường các Spinner sử dụng để hiển thị các giá trị số. Tuy nhiên bạn cũng có thể sử dụng để hiển thị một Object bất kỳ. Ví dụ dưới đây Spinner chứa tập hợp các đối tượng Language, và xử lý sự kiện khi giá trị của Spinner thay đổi.
SpinnerChangeEventDemo.java
package org.o7planning.javafx.spinner;

import java.util.ArrayList;
import java.util.List;

import org.o7planning.javafx.model.Language;

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Spinner;
import javafx.scene.control.SpinnerValueFactory;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;

public class SpinnerChangeEventDemo extends Application {

  @Override
  public void start(Stage stage) {

      Language vietnamese = new Language("vi", "Vietnamese", "Xin Chao");
      Language english = new Language("en", "English", "Hello");
      Language russian = new Language("ru", "Russian", "привет");

      List<Language> languages = new ArrayList<Language>();
      languages.add(vietnamese);
      languages.add(english);
      languages.add(russian);

      //
     
      Label label = new Label("Select Language:");
      final Spinner<Language> spinner = new Spinner<Language>();

      Label labelMessage = new Label("?");


      // Nhà máy tạo ra tập các giá trị.
      SpinnerValueFactory<Language> valueFactory = //
              new SpinnerValueFactory<Language>() {

                  @Override
                  public void decrement(int steps) {
                      Language current = this.getValue();
                      int idx = languages.indexOf(current);
                      int newIdx = (languages.size() + idx - steps) % languages.size();
                      Language newLang = languages.get(newIdx);
                      this.setValue(newLang);
                  }

                  @Override
                  public void increment(int steps) {
                      Language current = this.getValue();
                      int idx = languages.indexOf(current);
                      int newIdx = (idx + steps) % languages.size();
                      Language newLang = languages.get(newIdx);
                      this.setValue(newLang);
                  }

              };


      // Giá trị mặc định cho Spinner.
      valueFactory.setValue(vietnamese);

      spinner.setValueFactory(valueFactory);

      // Sư kiện khi Spinner thay đổi giá trị.
      spinner.valueProperty().addListener(new ChangeListener<Language>() {

          @Override
          public void changed(ObservableValue<? extends Language> observable,//
                  Language oldValue, Language newValue) {
             
              labelMessage.setText("Greeting: "+ newValue.getGreeting());

          }
      });

      FlowPane root = new FlowPane();
      root.setHgap(10);
      root.setVgap(10);
      root.setPadding(new Insets(10));

      root.getChildren().addAll(label, spinner, labelMessage);

      Scene scene = new Scene(root, 400, 200);

      stage.setTitle("JavaFX Spinner (o7planning.org)");
      stage.setScene(scene);
      stage.show();
  }

  public static void main(String[] args) {
      Application.launch(args);
  }

}
Language.java
package org.o7planning.javafx.model;

public class Language {

    private String code;
    private String name;
    private String greeting;

    public Language() {

    }

    public Language(String code, String name) {
        this.code = code;
        this.name = name;
    }

    public Language(String code, String name, String greeting) {
        this.code = code;
        this.name = name;
        this.greeting = greeting;
    }

    public String getCode() {
        return code;
    }

    public void setCode(String code) {
        this.code = code;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getGreeting() {
        return greeting;
    }

    public void setGreeting(String greeting) {
        this.greeting = greeting;
    }

    @Override
    public String toString() {
        return this.name;
    }

}

5- Spinner có thể hiệu chỉnh

Người dùng có thể nhập thêm các giá trị mới vào cho Spinner, ví dụ sau đây người dùng nhập giá trị và nhấn Enter, giá trị sẽ được bổ xung vào tập hợp các giá trị có sẵn của Spinner.
SpinnerEditDemo.java
package org.o7planning.javafx.spinner;

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Spinner;
import javafx.scene.control.SpinnerValueFactory;
import javafx.scene.control.SpinnerValueFactory.ListSpinnerValueFactory;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;
import javafx.util.StringConverter;

public class SpinnerEditDemo extends Application {

   @Override
   public void start(Stage stage) {

       Label label = new Label("Select Level:");
       final Spinner<Integer> spinner = new Spinner<Integer>();

  
       // Cho phép hiệu chỉnh
       spinner.setEditable(true);

 
       // Danh sách các phần tử.
       ObservableList<Integer> items = FXCollections.observableArrayList(1, 2, 3);

       // Value Factory:
       SpinnerValueFactory<Integer> valueFactory = //
               new SpinnerValueFactory.ListSpinnerValueFactory<>(items);
 
       // Bộ chuyển đổi giữa text hiển thị trên Spinner
       // và đối tượng item.
       MyConverter converter = new MyConverter();
       valueFactory.setConverter(converter);

       spinner.setValueFactory(valueFactory);

       spinner.getEditor().setOnAction(new EventHandler<ActionEvent>() {

           @Override
           public void handle(ActionEvent event) {
               String text = spinner.getEditor().getText();
               SpinnerValueFactory.ListSpinnerValueFactory<Integer>//
               valueFactory = (ListSpinnerValueFactory<Integer>) spinner.getValueFactory();

               StringConverter<Integer> converter = valueFactory.getConverter();
               Integer enterValue = converter.fromString(text);

    
               // Nếu danh sách không chứa giá trị người dùng nhập vào.
               if (!valueFactory.getItems().contains(enterValue)) {
 
                   // Thêm phần tử mới vào danh sách
                   valueFactory.getItems().add(enterValue);
 
                   // Sét thành hiện thời.
                   valueFactory.setValue(enterValue);
               } else {
    
                   // Sét thành hiện thời.
                   valueFactory.setValue(enterValue);
               }

           }
       });

       //
       FlowPane root = new FlowPane();
       root.setHgap(10);
       root.setVgap(10);
       root.setPadding(new Insets(10));

       root.getChildren().addAll(label, spinner);

       Scene scene = new Scene(root, 400, 200);

       stage.setTitle("JavaFX Spinner (o7planning.org)");
       stage.setScene(scene);
       stage.show();
   }

   class MyConverter extends StringConverter<Integer> {

       @Override
       public String toString(Integer object) {
           return object + "";
       }

       @Override
       public Integer fromString(String string) {
           return Integer.parseInt(string);
       }

   }

   public static void main(String[] args) {
       Application.launch(args);
   }

}