Java JSplitPane 分割面板完整應用：左右分割、單選列表聯動圖片預覽與拖曳分隔條

構建一個經典的主從介面：左側 JList 顯示圖片名稱單選列表，右側顯示對應圖片預覽，中間以 JSplitPane 水平分割支援拖曳調整比例、一鍵展開/摺疊。完整展示分割面板配置、列表選擇監聽、圖片延遲載入與最小尺寸約束。

核心類別：SplitPaneDemo

import java.awt.*;
import javax.swing.*;
import javax.swing.event.*;
import java.util.*;
public class SplitPaneDemo implements ListSelectionListener {
    private String[] imageNames = {"Bird.gif", "Cat.gif", "Dog.gif", "Pig.gif"};
    private JLabel picture;
    private JList list;
    private JSplitPane splitPane;
    public SplitPaneDemo() {
        // 左側列表
        list = new JList<>(imageNames);
        list.setSelectionMode(ListSelectionModel.SINGLE_SELECTION);
        list.setSelectedIndex(0);
        list.addListSelectionListener(this);
        JScrollPane listScrollPane = new JScrollPane(list);
        // 右側圖片預覽
        ImageIcon firstImage = createImageIcon("images/" + imageNames[0]);
        picture = firstImage != null ? new JLabel(firstImage) : new JLabel(imageNames[0]);
        if (firstImage != null) 
            picture.setPreferredSize(new Dimension(firstImage.getIconWidth(), firstImage.getIconHeight()));
        JScrollPane pictureScrollPane = new JScrollPane(picture);
        // 分割面板配置
        splitPane = new JSplitPane(JSplitPane.HORIZONTAL_SPLIT, true, listScrollPane, pictureScrollPane);
        splitPane.setOneTouchExpandable(true); // 一鍵展開/摺疊按鈕
        splitPane.setDividerLocation(150); // 初始分隔位置
        // 最小尺寸約束防止壓扁
        Dimension minSize = new Dimension(100, 50);
        listScrollPane.setMinimumSize(minSize);
        pictureScrollPane.setMinimumSize(minSize);
        splitPane.setPreferredSize(new Dimension(400, 200));
    }
    public JSplitPane getSplitPane() { return splitPane; }
    // 列表選擇事件
    public void valueChanged(ListSelectionEvent e) {
        if (e.getValueIsAdjusting()) return; // 去抖動
        JList theList = (JList)e.getSource();
        if (theList.isSelectionEmpty()) {
            picture.setIcon(null); picture.setText(null);
        } else {
            int index = theList.getSelectedIndex();
            ImageIcon newImage = createImageIcon("images/" + imageNames[index]);
            picture.setIcon(newImage);
            if (newImage != null) {
                picture.setText(null);
                picture.setPreferredSize(new Dimension(newImage.getIconWidth(), newImage.getIconHeight()));
            } else {
                picture.setText("Image not found: " + imageNames[index]);
            }
            picture.revalidate(); // 觸發佈局更新
        }
    }
    protected static ImageIcon createImageIcon(String path) {
        java.net.URL imgURL = SplitPaneDemo.class.getResource(path);
        return imgURL != null ? new ImageIcon(imgURL) : null;
    }
    public static void main(String[] args) {
        SwingUtilities.invokeLater(() -> {
            JFrame frame = new JFrame("JSplitPane Demo");
            frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
            frame.getContentPane().add(new SplitPaneDemo().getSplitPane());
            frame.pack();
            frame.setVisible(true);
        });
    }
}

JSplitPane 核心配置速查

關鍵設計細節

• 去抖動：if (e.getValueIsAdjusting()) return; 避免滑鼠拖曳選擇時多次觸發。
• 圖片載入失敗優雅降級**：顯示檔名文字而非崩潰。
• 最小尺寸約束**：setMinimumSize() 防止分隔條拖至邊緣壓扁子元件。
• revalidate()**：圖片尺寸變更後必須呼叫，通知 ScrollPane 更新滾動範圍。

進階擴展方向

1. 巢狀分割**：左側再垂直分割為「資料夾樹」+「檔案列表」。
2. 持久化分隔位置**：關閉視窗時儲存 getDividerLocation()，啟動時恢復。
3. 自訂分隔條 UI**：繼承 BasicSplitPaneUI 繪製漸層、圓角、動畫展開。
4. 鍵盤快捷鍵**：Ctrl+Left/Right 移動分隔條、F11 切換展開狀態。