2017-10-05 135 views
1

我正在尝试为调查页面实施Gluon Mobile切换按钮,并且在测试时,按钮会稍微向左跳转,当我单击它时。我不想让它跳起来。你可以在这里看到:Gluon Mobile拨动按钮跳跃

Toggle button jumping

相关的代码是在这里:

StackPane getToggler() { 

    ToggleButton toggleButton = new ToggleButton("Yes"); 
    ToggleButtonGroup toggleButtonGroup = new ToggleButtonGroup(); 
    toggleButtonGroup.setSelectionType(SelectionMode.SINGLE); 
    toggleButtonGroup.setPadding(new Insets(10)); 

    toggleButton = new ToggleButton("Yes"); 
    toggleButton.setStyle("-fx-text-fill:steelblue;"); 
    toggleButton.setUserData("1"); 
    toggleButton.setSelected(false); 
    toggleButton.selectedProperty().addListener((obv, ov, nv) -> { 
     if (nv.booleanValue()) { 
      toggleButtonGroup.setUserData("1"); 
     } 
    }); 

    toggleButtonGroup.getToggles().add(toggleButton); 

    toggleButton = new ToggleButton("No"); 
    toggleButton.setStyle("-fx-text-fill:steelblue;"); 
    toggleButton.setSelected(true); 
    toggleButton.setUserData("0"); 
    toggleButton.setSelected(false); 
    toggleButton.selectedProperty().addListener((obv, ov, nv) -> { 
     if (nv.booleanValue()) { 
      toggleButtonGroup.setUserData("0"); 
     } 
    }); 
    toggleButtonGroup.getToggles().add(toggleButton); 
    togglers.add(toggleButtonGroup); 

    StackPane wrapper = new StackPane(); 
    wrapper.setAlignment(Pos.CENTER); 
    wrapper.getChildren().add(toggleButtonGroup); 

    return wrapper; 
} 

这里就是我得到的togglers和他们的关系到标签的左边:

for (int i = 0; i < this.questions.length; i++) { 

     HBox row = new HBox(); 
     row.setSpacing(5); 
     row.setAlignment(Pos.CENTER_LEFT); 

     Label label = new Label(this.questions[i]); 
     label.setWrapText(true); 
     label.setPrefWidth(200); 
     label.setTextAlignment(TextAlignment.LEFT); 
     label.setFont(new Font("System", 14)); 

     StackPane wrapper = this.getToggler(); 

     Region region = new Region(); 
     HBox.setHgrow(region, Priority.ALWAYS); 
     HBox.setHgrow(label, Priority.NEVER); 

     row.getChildren().addAll(label,region,wrapper); 
     box.getChildren().add(row); 
     box.getChildren().add(new Separator()); 

    } 

回答

2

经过一些调试后,我意识到切换按钮的最小宽度值比它们的宽度宽。

这意味着用户选择一个切换后,将应用最小宽度,然后使用所需的最小宽度调整控件大小,从而缩小该区域的大小。

甲快速修复(直到此得到固定在控制)可以是设置你切换按钮的最小宽度:

private StackPane getToggler() { 

    ToggleButtonGroup toggleButtonGroup = new ToggleButtonGroup(); 

    ToggleButton toggleButtonYes = new ToggleButton("Yes"); 
    toggleButtonYes.minWidthProperty().bind(toggleButtonYes.prefWidthProperty()); 
    toggleButtonGroup.getToggles().add(toggleButtonYes); 

    ToggleButton toggleButtonNo = new ToggleButton("No"); 
    toggleButtonNo.minWidthProperty().bind(toggleButtonNo.prefWidthProperty()); 
    toggleButtonGroup.getToggles().add(toggleButtonNo); 

    ...; 
} 

+0

完美地工作。谢谢。 –