Canvas 如何将已在javaFX画布上绘制的一些文本放在圆圈的正中心?
我已经创建了画布右中心的笔划圆圈(d=26)(300x300) 默认字体大小为图形上下文的12pt(非PIXCEL)。 我想写一个数字,在我上面创建的圆的正中心有一个或两个数字。你能给我一些数学表达式,把这段文字写在圆的正中心吗。我还缺乏理解如何将12pt(点)与像素匹配。有人能帮我吗 这是我的密码:Canvas 如何将已在javaFX画布上绘制的一些文本放在圆圈的正中心?,canvas,javafx,pixels,points,Canvas,Javafx,Pixels,Points,我已经创建了画布右中心的笔划圆圈(d=26)(300x300) 默认字体大小为图形上下文的12pt(非PIXCEL)。 我想写一个数字,在我上面创建的圆的正中心有一个或两个数字。你能给我一些数学表达式,把这段文字写在圆的正中心吗。我还缺乏理解如何将12pt(点)与像素匹配。有人能帮我吗 这是我的密码: @Override public void start(Stage primaryStage) { Pane root = new Pane(); Scene scene = n
@Override
public void start(Stage primaryStage) {
Pane root = new Pane();
Scene scene = new Scene(root, 300, 300);
primaryStage.setTitle("My Canvas");
primaryStage.setScene(scene);
primaryStage.show();
Canvas cvs = new Canvas();
cvs.setWidth(300);
cvs.setHeight(300);
cvs.setLayoutX(0);
cvs.setLayoutY(0);
root.getChildren().add(cvs);
GraphicsContext gc = cvs.getGraphicsContext2D();
gc.setFill(Color.BLACK);
gc.setStroke(Color.BLUE);
gc.setLineWidth(2);
// creating circle (diameter = 26) right center of the canvas(300 x 300)
// So, x = (widthOfCanvas-diameter)/2 , y = ((widthOfCanvas-diameter)/2
double d = 26.0d;
double x = (cvs.getWidth() - d)/2;
double y = (cvs.getHeight() - d)/2;
gc.strokeOval(x, y, d, d);
// default font size is 12pt (NOT PIXCEL)
gc.fillText("26", 150, 150); // How can I set this text right center of the circle? Please give me som mathematical expression
// I also don't know relationship betwwen pt and px
// What can I do?
}
谢谢你们两个!我已将你的意见执行如下!现在我可以在任何地方画圈数了
@Override
public void start(Stage primaryStage) {
Pane root = new Pane();
Scene scene = new Scene(root, 300, 300);
primaryStage.setTitle("My Canvas");
primaryStage.setScene(scene);
primaryStage.show();
Canvas cvs = new Canvas();
cvs.setWidth(300);
cvs.setHeight(300);
cvs.setLayoutX(0);
cvs.setLayoutY(0);
root.getChildren().add(cvs);
GraphicsContext gc = cvs.getGraphicsContext2D();
double x = (cvs.getWidth() - 26)/2;
double y = (cvs.getHeight() - 26)/2;
gc.drawImage(createCircledNumber(7), x, y);
gc.drawImage(createCircledNumber(35), 50, 50);
gc.drawImage(createCircledNumber(75), 70, 105);
}
private WritableImage createCircledNumber(int number) {
//createCircledNumber() method always returns 26px X 26px sized image
StackPane sPane = new StackPane();
sPane.setPrefSize(26, 26);
Circle c = new Circle(26/2.0);
c.setStroke(Color.BLACK);
c.setFill(Color.WHITE);
c.setStrokeWidth(3);
sPane.getChildren().add(c);
Text txtNum = new Text(number+"");
sPane.getChildren().add(txtNum);
SnapshotParameters parameters = new SnapshotParameters();
parameters.setFill(Color.TRANSPARENT);
return sPane.snapshot(parameters, null);
}
例如,为什么不使用
标签
和合适的布局(StackPane
)呢?是的:您真的需要画布吗?这是一个布局问题,正如@BoHalim正确指出的那样,使用布局可以更好地解决这个问题。(事实上,你甚至可以用一个标签和标签上的一些CSS设置来实现这一点,不需要堆栈窗格和圆圈。)如果你必须使用画布,那就难多了。事实上,我正在构建某种绘图应用程序,我需要找到一种方法来使用上面的圆圈数字对图表中的部分进行编号。但是我没能用我用于圆的x,y变量来关联fillText的布局x,y?你知道吗?