如何在框的每个面添加文本[JavaFX] [英] How to add text to each face of a box [JavaFX]
问题描述
我创建了一个可以旋转的框，以及在单击时将执行的操作〜。我遇到的问题是在这个盒子的所有面上显示文字，例如;正面有
1，顶部有2个，背面有3个，底部有4个，左边有5个，右边有6个。
I了解StackPane可用于覆盖多维数据集顶部的文本框，但我不认为这在这种情况下真的有用。
由于box本质上是一个预构建的TriangleMesh，这可能吗？
据我们所见，box没有任何内置功能。</ p>
static double mousePosX ;
static double mousePosY;
static double mouseOldX;
static double mouseOldY;
public static场景testScene（阶段阶段）{
Group root = new Group（）;
场景场景=新场景（root，stage.getWidth（），stage.getHeight（），true，SceneAntialiasing.BALANCED）;
scene.setFill（Paint.valueOf（Blue））;
PerspectiveCamera camera = new PerspectiveCamera（true）;
camera.setNearClip（0.1）;
camera.setFarClip（10000.0）;
camera.setTranslateZ（-10）;
scene.setCamera（相机）;
Box box = new Box（1,1,1）;
box.setOnMouseClicked（e - > {
System.out.println（Test）;
}）;
旋转rotateX = new旋转（10,0,0,0，Rotate.X_AXIS）;
旋转rotateY = new旋转（5,0,0,0，Rotate.Y_AXIS）;
box.getTransforms（）。addAll（rotateX，rotateY）;
scene.setOnMousePressed（me - > {
mouseOldX = me.getSceneX（）;
mouseOldY = me.getSceneY（）;
}）;
scene.setOnMouseDragged（me - > {
mousePosX = me.getSceneX（）;
mousePosY = me.getSceneY（）;
rotateX.setAngle（rotateX.getAngle（） - （mousePosY - mouseOldY））;
rotateY.setAngle（rotateY.getAngle（）+（mousePosX - mouseOldX））;
mouseOldX = mousePosX;
mouseOldY = mousePosY;
} ）;
root.getChildren（）。add（box）;
返回场景;
}
这是我到目前为止的代码，任何帮助都会很大赞赏。
此解决方案基于对此的答案
多维数据集可以生成为：
CuboidMesh cuboid = new CuboidMesh（100f， 100f，100f）;
cuboid.setTextureModeImage（getClass（）。getResource（net.png）。toExternalForm（））;
现在的想法是在6个面中的每个面上写入文本并保存纹理图像稍后再使用。
此方法将生成此净图像：
private Image generateNet（String face1，String face2，String face3，String face4，String face5，String face6）{
GridPane grid = new GridPane（）;
grid.setAlignment（Pos.CENTER）;
标签label1 =新标签（face1）;
label1.setRotate（90）;
GridPane.setHalignment（label1，HPos.CENTER）;
标签label2 =新标签（face2）;
GridPane.setHalignment（label2，HPos.CENTER）;
标签label3 =新标签（face3）;
GridPane.setHalignment（label3，HPos.CENTER）;
标签label4 =新标签（face4）;
GridPane.setHalignment（label4，HPos.CENTER）;
标签label5 =新标签（face5）;
GridPane.setHalignment（label5，HPos.CENTER）;
标签label6 =新标签（face6）;
label6.setRotate（90）;
GridPane.setHalignment（label6，HPos.CENTER）;
grid.add（label1,1,0）;
grid.add（label2,0,1）;
grid.add（label3,1,1）;
grid.add（label4,2,1）;
grid.add（label5,3,1）;
grid.add（label6,1,2）;
grid.setGridLinesVisible（true）;
ColumnConstraints col1 = new ColumnConstraints（）;
col1.setPercentWidth（25）;
ColumnConstraints col2 = new ColumnConstraints（）;
col2.setPercentWidth（25）;
ColumnConstraints col3 = new ColumnConstraints（）;
col3.setPercentWidth（25）;
ColumnConstraints col4 = new ColumnConstraints（）;
col4.setPercentWidth（25）;
grid.getColumnConstraints（）。addAll（col1，col2，col3，col4）;
RowConstraints row1 = new RowConstraints（）;
row1.setPercentHeight（33.33）;
RowConstraints row2 = new RowConstraints（）;
row2.setPercentHeight（33.33）;
RowConstraints row3 = new RowConstraints（）;
row3.setPercentHeight（33.33）;
grid.getRowConstraints（）。addAll（row1，row2，row3）;
grid.setPrefSize（600,450）;
场景tmpScene =新场景（网格）;
tmpScene.getStylesheets（）。add（getClass（）。getResource（style.css）。toExternalForm（））;
返回grid.snapshot（null，null）;
}
其中 style.css 包含：
.root {
-fx-background-color：white;
}
.label {
-fx-font-size：6em;
}
有了它，可以正确调整标签大小和字体。
现在您可以为任何文本生成网络图像：
Image net = generateNet（1，2，3，4，5，6）;
最后，您可以将此纹理应用于长方体：
PhongMaterial mat = new PhongMaterial（）;
mat.setDiffuseMap（net）;
cuboid.setMaterial（mat）;
并且您将应用您的文字：
I create a box which I can rotate and what will do ~some action~ when clicked. The problem I'm having is display text on all the faces of this box, for example; 1 on the front, 2 on the top, 3 on the back, 4 on the bottom, 5 on the left and 6 on the right.
I understand that StackPane can be used to overlay a text box on-top of the cube but I don't think that'd really help in this scenario. Since box is essentially a pre-constructed TriangleMesh, is this possible to do? As far as seen, box doesn't have any in-built functionality to do this.
static double mousePosX;
static double mousePosY;
static double mouseOldX;
static double mouseOldY;
public static Scene testScene(Stage stage) {
Group root = new Group();
Scene scene = new Scene(root, stage.getWidth(), stage.getHeight(), true, SceneAntialiasing.BALANCED);
scene.setFill(Paint.valueOf("Blue"));
PerspectiveCamera camera = new PerspectiveCamera(true);
camera.setNearClip(0.1);
camera.setFarClip(10000.0);
camera.setTranslateZ(-10);
scene.setCamera(camera);
Box box = new Box(1,1,1);
box.setOnMouseClicked(e -> {
System.out.println("Test");
});
Rotate rotateX = new Rotate(10, 0, 0, 0, Rotate.X_AXIS);
Rotate rotateY = new Rotate(5, 0, 0, 0, Rotate.Y_AXIS);
box.getTransforms().addAll(rotateX, rotateY);
scene.setOnMousePressed(me -> {
mouseOldX = me.getSceneX();
mouseOldY = me.getSceneY();
});
scene.setOnMouseDragged(me -> {
mousePosX = me.getSceneX();
mousePosY = me.getSceneY();
rotateX.setAngle(rotateX.getAngle() - (mousePosY - mouseOldY));
rotateY.setAngle(rotateY.getAngle() + (mousePosX - mouseOldX));
mouseOldX = mousePosX;
mouseOldY = mousePosY;
});
root.getChildren().add(box);
return scene;
}
This is the code I've got so far and any assistance would be greatly appreciated.
This solution is based in the answer to this question, where the CuboidMesh from the FXyz library is used.
The main idea is to use an image as texture for the cube. The built-in JavaFX Box will apply this image to each of the 6 faces, so if we want to have different text in each face, we have to use the CuboidMesh, that makes use of the net image:
The cube can be generated as:
CuboidMesh cuboid = new CuboidMesh(100f, 100f, 100f);
cuboid.setTextureModeImage(getClass().getResource("net.png").toExternalForm());
The idea now is to write the text in each of the 6 faces and save the texture image that will be used later on.
This method will generate this net image:
private Image generateNet(String face1, String face2, String face3, String face4, String face5, String face6) {
GridPane grid = new GridPane();
grid.setAlignment(Pos.CENTER);
Label label1 = new Label(face1);
label1.setRotate(90);
GridPane.setHalignment(label1, HPos.CENTER);
Label label2 = new Label(face2);
GridPane.setHalignment(label2, HPos.CENTER);
Label label3 = new Label(face3);
GridPane.setHalignment(label3, HPos.CENTER);
Label label4 = new Label(face4);
GridPane.setHalignment(label4, HPos.CENTER);
Label label5 = new Label(face5);
GridPane.setHalignment(label5, HPos.CENTER);
Label label6 = new Label(face6);
label6.setRotate(90);
GridPane.setHalignment(label6, HPos.CENTER);
grid.add(label1, 1, 0);
grid.add(label2, 0, 1);
grid.add(label3, 1, 1);
grid.add(label4, 2, 1);
grid.add(label5, 3, 1);
grid.add(label6, 1, 2);
grid.setGridLinesVisible(true);
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(25);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(25);
ColumnConstraints col3 = new ColumnConstraints();
col3.setPercentWidth(25);
ColumnConstraints col4 = new ColumnConstraints();
col4.setPercentWidth(25);
grid.getColumnConstraints().addAll(col1, col2, col3, col4);
RowConstraints row1 = new RowConstraints();
row1.setPercentHeight(33.33);
RowConstraints row2 = new RowConstraints();
row2.setPercentHeight(33.33);
RowConstraints row3 = new RowConstraints();
row3.setPercentHeight(33.33);
grid.getRowConstraints().addAll(row1, row2, row3);
grid.setPrefSize(600, 450);
Scene tmpScene = new Scene(grid);
tmpScene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());
return grid.snapshot(null, null);
}
where style.css contains:
.root {
-fx-background-color: white;
}
.label {
-fx-font-size: 6em;
}
With it, the labels size and font can be adjusted properly.
Now you can generate a net image for any text:
Image net = generateNet("1", "2", "3", "4", "5", "6");
Finally, you can apply this texture to the cuboid:
PhongMaterial mat = new PhongMaterial();
mat.setDiffuseMap(net);
cuboid.setMaterial(mat);
And you will have your text applied:
这篇关于如何在框的每个面添加文本[JavaFX]的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
