如何在使用鼠标拖动来调整标签窗格大小时调整组件大小

Question

我已经实现了非常简单的鼠标拖动位于中间的选项卡窗格。鼠标调整大小是非常基本的，它不能很好地工作，但现在我可以拖动标签边框并增加尺寸。

现在我发现了一个问题。当我调整位于中心的标签时，位于中心旁边的组件不会按照用户预期的方式自动回拨和尖叫，而是放置在调整大小的组件后面。当我用鼠标拖动扩展主要组件时，能否以某种方式设置所有组件被推回？

Answer 1

与其他人一样在这里，我建议你使用SplitPane类来处理画面，供各位的分裂。下面是一个示例（基于截图）的拆分窗格。如果您不喜欢显示分隔栏，则可以修改CSS以适应您的需要。

import javafx.application.Application; 
import javafx.geometry.Orientation; 
import javafx.scene.Node; 
import javafx.scene.Parent; 
import javafx.scene.Scene; 
import javafx.scene.control.SplitPane; 
import javafx.scene.control.Tab; 
import javafx.scene.control.TabPane; 
import javafx.scene.control.TextArea; 
import javafx.scene.layout.BorderPane; 
import javafx.stage.Stage; 


public class FXSplitTabs extends Application{ 

    @Override 
    public void start(Stage stage) throws Exception { 
     stage.setTitle("SplitTabs"); 
     stage.setWidth(700); 
     stage.setHeight(500); 

     //Setup Center and Right 
     TabPaneWrapper wrapper = new TabPaneWrapper(Orientation.HORIZONTAL, .9); 
     TabPane centerPane = new TabPane(); 
     centerPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 

     TabPane rightPane = new TabPane(); 
     rightPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 
     SplitPane.setResizableWithParent(rightPane, false); 
     wrapper.addNodes(centerPane, rightPane); 

     //Add bottom 
     TabPane bottomPane = new TabPane(); 
     bottomPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 
     TabPaneWrapper wrapperBottom = new TabPaneWrapper(Orientation.VERTICAL, .7); 
     wrapperBottom.addNodes(wrapper.getNode(), bottomPane); 

     //Add left 
     TabPane leftPane = new TabPane(); 
     leftPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 
     TabPaneWrapper wrapperleft = new TabPaneWrapper(Orientation.HORIZONTAL, .1); 
     wrapperleft.addNodes(leftPane, wrapperBottom.getNode()); 

     Scene myScene = new Scene(wrapperleft.getNode()); 
     stage.setScene(myScene); 
     stage.sizeToScene(); 
     stage.show(); 
    } 

    public Tab generateTab(String name){ 
     Tab result = new Tab(name); 
     BorderPane content = new BorderPane(); 
     TextArea text = new TextArea(); 
     content.setCenter(text); 
     result.setContent(content); 
     return result; 
    } 

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

    public static class TabPaneWrapper{ 
     SplitPane split; 

     public TabPaneWrapper(Orientation o, double splitLocation){ 
      split = new SplitPane(); 

      //Change the CSS (uncomment if using an external css) 
      //split.getStylesheets().add("test.css"); 

      split.setOrientation(o); 
      split.setDividerPosition(0, splitLocation); 
     } 

     public void addNodes(final Node node1, final Node node2){ 
      //Add to the split pane 
      split.getItems().addAll(node1, node2); 
     } 

     public Parent getNode(){ 
      return split; 
     } 
    } 

} 

如果你想用CSS来改变分频器怎么看，取消注释上面的代码中CSS行，创建基本包中的文件test.css，并插入CSS规范（这里的一个例子，将分频器变成透明的）：

.split-pane-divider { 
    -fx-border-color: transparent; 
    -fx-background-color: transparent; 
} 

Answer 2

作为替代解决方案：

我已经发布的Drombler FX第一早期Access版本，基于OSGi和Maven一个新的富客户端平台JavaFX的。

它还附带了一个Docking Framework的初始版本，这似乎是你正在寻找的东西。

你可以阅读更多关于Drombler FX这里：http://puces-blog.blogspot.ch/2012/12/drombler-fx-building-modular-javafx.html