JavaFx+JFoenix 點擊翻頁按鈕查看圖片

JavaFx+JFoenix 點擊翻頁按鈕查看圖片

1. 前言

實現一個小Demo，通過點擊翻頁按鈕，實現循環查看每一張圖片。當查看到最後一張圖片後，再次點擊按鈕查看第一張圖片，開始下一輪循環。

1.1. 示例Demo

示例中String數組中存放的是項目ClassPath路徑的圖片地址，如果不清楚Image類讀取Classpath路徑資源，可以查看這篇博客。
徹底解決Image讀取圖片路徑問題： Image讀取資源博客

package javafxdemo;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;


/**
 * @author bruce
 *
 *  1.將圖片地址放到一個String類型的數組中
 *  2.通過for循環將String數組中的數據賦值給Image()對象，
 * 並將Image對象存儲到 Image[]數組中
 *  3.創建一個button觸發showNext方法。
 *  4.showNext方法通過ImageView添加Image數組的索引地址
 * 獲取每個Image對象中的圖片地址。
 */
public class Picture extends Application {
    //創建一個數組存放項目ClassPath路徑下的圖片。
    String [] images = {
            "../resources/photoimage/a.jpg",
            "../resources/photoimage/b.jpg",
            "../resources/photoimage/c.jpg",
    };

    //創建Image[]數組存放每個Image對象
    Image[] image = new Image[images.length];
    //當前讀取的Image數組的地址
    int currentIndex = 0;

    ImageView imageView = new ImageView();

    @Override
    public void start(Stage stage) throws Exception {
        BorderPane root = new BorderPane();

        //通過for循環創建Image對象，並將Image對象存入Image[]數組中
        for (int i = 0; i < images.length; i++) {
            //創建Image類對象，並將String類型數組的數據傳給Image對象。
            //將Image對象存放到Image[]數組中
            image[i] = new Image(images[i]);
        }

        //創建一個按鈕事件，查看下一張圖片。
        Button button = new Button("向後翻頁");
        button.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent event) {
                showNext();
            }
        });

        //類初始化後，調用start方法時先調用下showNext方法，在觸發Button
        //默認顯示第一張圖片
        showNext();

        //設置圖片寬高尺寸
        imageView.setPreserveRatio(true);
        imageView.setFitWidth(300);
        imageView.setFitHeight(300);

        //設置圖片和按鈕顯示的位置
        root.setCenter(imageView);
        root.setTop(button);

        //創建場景
        Scene scene = new Scene(root,400,400);
        //窗口添加場景
        stage.setScene(scene);
        //打開窗口
        stage.show();

    }

    private void showNext() {
        currentIndex++;
        // 判斷當前索引地址如果大於等於String類型數組就置爲0從頭開始。
        if (currentIndex >=images.length) {
            currentIndex = 0;
        }
        //每次查看Image[]數組中的不同的索引實現圖片的翻頁
        imageView.setImage(image[currentIndex]);
    }

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