java 如何在 JavaFX 中对齐按钮?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/39214586/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to align a button right in JavaFX?
提问by devoured elysium
How can I make the "right" (second) button on this Window be right aligned?
如何使此窗口上的“右”(第二个)按钮右对齐?
class HelloApp extends Application {
override def start(primaryStage: Stage): Unit = {
val root = new FlowPane(Orientation.VERTICAL) {
setPadding(new Insets(10, 10, 10, 10))
setVgap(10)
getChildren.add(new Button("Left"))
getChildren.add(new Button("Right") { setAlignment(Pos.CENTER_RIGHT) }) // this doesn't seem to be working
}
primaryStage.setScene(new Scene(root, 400, 400))
primaryStage.show()
}
}
Thanks
谢谢
回答by jewelsea
Sample Solution
样品溶液
Here is an example which provides a left aligned and right aligned button:
这是一个提供左对齐和右对齐按钮的示例:
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class HelloApp extends Application {
public static void main(String[] args) {
launch(args);
}
@Override
public void start(Stage primaryStage) throws Exception {
HBox root = new HBox();
root.setPadding(new Insets(10, 10, 10, 10));
final Button left = new Button("Left");
left.setMinSize(Button.USE_PREF_SIZE, Button.USE_PREF_SIZE);
final Pane spacer = new Pane();
HBox.setHgrow(spacer, Priority.ALWAYS);
spacer.setMinSize(10, 1);
final Button right = new Button("Right");
right.setMinSize(Button.USE_PREF_SIZE, Button.USE_PREF_SIZE);
root.getChildren().addAll(left, spacer, right);
primaryStage.setScene(new Scene(root, 400, 400));
primaryStage.show();
}
}
This solution was provided in Java code rather than Scala as I don't program in Scala. But it should be easily translatable to equivalent Scala code.
这个解决方案是用 Java 代码而不是 Scala 提供的,因为我不在 Scala 中编程。但它应该很容易翻译成等效的 Scala 代码。
Explanation
解释
I chose a HBox because, for me, that has been the most common instance of wishing to have something left and right aligned. But there is no real right or wrong here and using other layout types such as AnchorPane to achieve the desired result can also get you a good solution.
我选择了 HBox,因为对我来说,这是希望左右对齐的最常见实例。但是这里没有真正的对与错,使用其他布局类型如 AnchorPane 来达到预期的结果也可以为您提供一个很好的解决方案。
To accomplish the right alignment with a HBox I insert a variable width spacing pane between the left aligned nodes and the right aligned nodes, which pushes all the right aligned nodes to the right. I added various additional constraints on min sizes so that the full button text is always visible and so that there is always a small gap between the left and right aligned nodes when you make the window small.
为了使用 HBox 实现右对齐,我在左对齐节点和右对齐节点之间插入了一个可变宽度间距窗格,这会将所有右对齐节点推到右侧。我在最小尺寸上添加了各种附加约束,以便完整的按钮文本始终可见,并且当您使窗口变小时,左右对齐的节点之间始终存在小间隙。
On setAlignment()
在 setAlignment() 上
The reason why the button.setAlignment()
method didn't appear to work for you is that it doesn't do what you think it will do. setAlignment is for aligning the text within the button as the button grows past its preferred width. See the setAlignment javadoc:
该button.setAlignment()
方法似乎对您不起作用的原因是它没有做您认为会做的事情。setAlignment 用于在按钮超过其首选宽度时对齐按钮内的文本。请参阅 setAlignment javadoc:
Specifies how the text and graphic within the Labeled should be aligned when there is empty space within the Labeled.
指定当 Labeled 内有空白空间时,Labeled 内的文本和图形应如何对齐。
The default max width for a button is its preferred width, so the button won't grow in size unless you explicitly set its max width using button.setMaxWidth(Double.MAX_VALUE)
. This means, by default, the setAlignment method will do nothing at all, as there will be no additional space available within the button for the button's internal content to be aligned inside.
按钮的默认最大宽度是其首选宽度,因此除非您使用button.setMaxWidth(Double.MAX_VALUE)
. 这意味着,默认情况下, setAlignment 方法将什么也不做,因为按钮内将没有额外的可用空间来对齐按钮的内部内容。
To further understand this, read: Tips for Sizing and Aligning Nodes(highly recommended).
要进一步了解这一点,请阅读:调整节点大小和对齐节点的技巧(强烈推荐)。
On aligning for other Pane Types
关于对齐其他窗格类型
There are numerous other layout panes(such as AnchorPane, GridPane, etc), which could be used to accomplish similar layout. The different layout panes have different functionality and APIs. This means that the way you deal with common layout issues such as alignment differs between them (you need to consult their API to understand how to do it for each layout pane type).
还有许多其他布局窗格(例如 AnchorPane、GridPane 等),可用于完成类似的布局。不同的布局窗格具有不同的功能和 API。这意味着您处理常见布局问题(例如对齐)的方式因它们而异(您需要查阅他们的 API 以了解如何针对每种布局窗格类型执行此操作)。
If you want to control alignment within a layout pane, you have to use either a spacer as I demonstrated above, or set additional pane level constraints on the node. Examples of setting constraints on various layout types are the following methods (some of which are static):
如果您想控制布局窗格内的对齐方式,则必须使用我上面演示的分隔符,或者在节点上设置额外的窗格级别约束。在各种布局类型上设置约束的示例有以下方法(其中一些是静态的):
- hBox.setAlignment(Pos)(align all nodes within the VBox)
- AnchorPane.setRightAnchor(Node, Double)(anchor a given node in an AnchorPane).
- stackPane.setAlignment(Pos)(align all nodes within a StackPane)
- StackPane.setAlignment(Node, Pos)(align a specific node within a StackPane)
- hBox.setAlignment(Pos)(对齐VBox内的所有节点)
- AnchorPane.setRightAnchor(Node, Double)(在 AnchorPane 中锚定给定节点)。
- stackPane.setAlignment(Pos)(对齐一个 StackPane 中的所有节点)
- StackPane.setAlignment(Node, Pos)(对齐 StackPane 中的特定节点)
The above are just examples, there are many more ways to align nodes, for example by setting the top, center or right properties of a BorderPane.
以上只是示例,还有更多对齐节点的方法,例如通过设置BorderPane的 top、center 或 right 属性。
Why FlowPane isn't really good for what you are trying to accomplish
为什么 FlowPane 并不适合您要完成的工作
You can right align nodes in a FlowPane by setting the FlowPane's Orientationto vertical and invoking flowPane.setColumnHalignment(Pos.CENTER_RIGHT). However, that right aligns everything in the FlowPane, not one thing to the left, and another thing to the right, which is what you are trying to do.
您可以通过将FlowPane 的 Orientation设置为垂直并调用flowPane.setColumnHalignment(Pos.CENTER_RIGHT)来右对齐 FlowPane 中的节点。但是,该右侧会对齐 FlowPane 中的所有内容,而不是左侧的一件事,右侧的另一件事,这正是您要执行的操作。
回答by Bob Flannigon
I'm not sure FlowPane really supports this. Using GridPane you can create two columns and consume all the space using the first column. Something like this:
我不确定 FlowPane 是否真的支持这一点。使用 GridPane,您可以创建两列并使用第一列消耗所有空间。像这样的东西:
GridPane pneButtons = new GridPane();
ColumnConstraints col1 = new ColumnConstraints();
col1.setHgrow(Priority.ALWAYS);
pneButtons.getColumnConstraints().add(col1);
Button btnRight = new Button("RIGHT");
pneButtons.getChildren().add(btnRight);
GridPane.setColumnIndex(btnRight, 1);