JavaFX 2 UI Controls: Horizontal ListView

This is a tutorial about how to create Horizontal ListView with JavaFX 2. If you have not already seen JavaFX 2: ListView tutorial, then I strongly recommend it, because these are similar tutorials. Only difference between these two tutorials is orientation of ListView. In this tutorial I will setOrientation to Horizontal, instead of default Vertical. Below is the final result of our Horizontal ListView example. Also, here I will implement onMouseClicked Event Handler. Solerman Kaplon commented how bunch of these if and else loops looks awful, and he is right. This can be improved a lot of, but for this kind of beginners tutorials, it's fine.

Horizontal ListView

	import javafx.application.Application;
	import javafx.collections.FXCollections;
	import javafx.collections.ObservableList;
	import javafx.event.EventHandler;
	import javafx.geometry.Orientation;
	import javafx.scene.Scene;
	import javafx.scene.control.Label;
	import javafx.scene.control.ListView;
	import javafx.scene.input.MouseEvent;
	import javafx.scene.layout.VBox;
	import javafx.stage.Stage;
	/**
	*
	* @author zoranpavlovic.blogspot.com
	*/
	public class ListViewMain extends Application {
	/**
	* @param args
	* the command line arguments
	*/
	VBox vb = new VBox();
	Label lbl = new Label();
	ListView<String> list = new ListView<>();
	ObservableList<String> data = FXCollections.observableArrayList(
	"List index 0", "List index 1", "List index 2", "List index 3");
	public static void main(String[] args) {
	Application.launch(args);
	}
	@Override
	public void start(Stage primaryStage) {
	primaryStage.setTitle("JavaFX 2.0 ListView");
	// Adding data to ListView
	list.setItems(data);
	// Set Horizontal orientation of this ListView
	list.setOrientation(Orientation.HORIZONTAL);
	// Actions on clicked list item
	initActions();
	// Adding BorderPane to the scene
	vb.getChildren().addAll(list, lbl);
	Scene scene = new Scene(vb, 200, 60);
	primaryStage.setScene(scene);
	primaryStage.show();
	}
	public void initActions() {
	// Detecting mouse clicked
	list.setOnMouseClicked(new EventHandler<MouseEvent>() {
	@Override
	public void handle(MouseEvent arg0) {
	// Check wich list index is selected then set txtContent value
	// for that index
	if (list.getSelectionModel().getSelectedIndex() == 0) {
	lbl.setText("Selected index: 0");
	}
	else if (list.getSelectionModel().getSelectedIndex() == 1) {
	lbl.setText("Selected index: 1");
	}
	else if (list.getSelectionModel().getSelectedIndex() == 2) {
	lbl.setText("Selected index: 2");
	}
	else if (list.getSelectionModel().getSelectedIndex() == 3) {
	lbl.setText("Selected index: 3");
	}
	}
	});
	}
	}

view raw JavaFX 2 Horizontal ListView Handle Action hosted with ❤ by GitHub

If you like this tutorial, please feel free to like Facebook page of my blog, to be informed about latest JavaFX 2 tutorials.