My Professor at university gave this assignment to start a new topic in class. Just a simple GUI which is supposed to show a graph. 3 Files were prepared by our Prof:
Function Canvas
package Aufgabe1.jfx;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.paint.Color;
final class FunctionCanvas extends Canvas
{
private double c1 = 1, d1 = 0, c2 = 1, d2 = 0;
void setFunctionParameters(double c1, double d1, double c2, double d2)
{
this.c1 = c1;
this.d1 = d1;
this.c2 = c2;
this.d2 = d2;
}
FunctionCanvas() {}
private static final float v = 244f / 255;
private static final Color backGroundColor = Color.color(0, 0, 0);
private static final int yOffset = 20;
void drawFunctionCurve() {
GraphicsContext gc = getGraphicsContext2D();
//float v = 244f / 255;
gc.setFill(backGroundColor);
gc.fillRect(0, 0, getWidth(), getHeight());
double h = this.getHeight() - 2 * yOffset;
int xOffset = 40;
double w = this.getWidth() - 2 * xOffset;
double yZero = yOffset + h / 2;
gc.setFill(Color.BLACK);
gc.fillText("f(x)", xOffset - 30, yOffset);
gc.fillText("0", xOffset - 25, yZero + 5);
gc.fillText("2\u03c0", xOffset + w - 5, yZero - 5);
gc.setLineWidth(1.0);
gc.setStroke(Color.GRAY);
gc.strokeLine(xOffset, yOffset, xOffset, yOffset + h);
gc.strokeLine(xOffset, yZero, xOffset + w, yZero);
gc.setLineWidth(1.5);
gc.setStroke(Color.INDIANRED);
for (int x = 0; x < w; x++) {
int y = (int) ((h / 2) * sinCosFunc(x * 2 * Math.PI / w));
gc.strokeLine(xOffset + x, yZero - y, xOffset + x, yZero - y);
}
}
private double sinCosFunc(double x)
{
return Math.sin(c1 * x + d1) * Math.cos(c2 * x + d2);
}
}
FunctionCurve
package Aufgabe1.jfx;
import javafx.application.Application;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;
public class FunctionCurve extends Application {
public FunctionCurve() { }
@Override
public void start(Stage stage) throws Exception {
int width = 670;
int height = 520;
//Written by me
FXMLLoader loader = new FXMLLoader(getClass().getResource("1gui.fxml"));
Parent root = loader.load();
Scene scene = new Scene(root, width, height);
stage.setTitle(this.getClass().getSimpleName());
stage.setScene(scene);
stage.centerOnScreen();
stage.show();
}
}
Main
package Aufgabe1.jfx;
final class Main
{
private Main() {}
public static void main(String[] args)
{
javafx.application.Application.launch(FunctionCurve.class, args);
}
}
I did already create the FXML File and wrote the Controller to the best of my abilities:
FXML
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<SplitPane dividerPositions="0.08892617449664429" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" orientation="VERTICAL" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/17.0.2-ea" xmlns:fx="http://javafx.com/fxml/1" fx:controller="Aufgabe1.jfx.Controller">
<items>
<AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="100.0" prefWidth="160.0">
<children>
<HBox prefHeight="48.0" prefWidth="597.0">
<children>
<Label prefHeight="25.0" prefWidth="25.0" text="c1">
<padding>
<Insets left="5.0" right="5.0" />
</padding>
</Label>
<Spinner editable="true" prefHeight="10.0" prefWidth="50.0" />
<Label prefHeight="25.0" prefWidth="25.0" text="d1">
<padding>
<Insets left="5.0" right="5.0" />
</padding>
</Label>
<Spinner editable="true" prefHeight="10.0" prefWidth="50.0" />
<Label prefHeight="25.0" prefWidth="25.0" text="c2">
<padding>
<Insets left="5.0" right="5.0" />
</padding>
</Label>
<Spinner editable="true" prefHeight="10.0" prefWidth="50.0" />
<Label prefHeight="25.0" prefWidth="25.0" text="d2">
<padding>
<Insets left="5.0" right="5.0" />
</padding>
</Label>
<Spinner editable="true" prefHeight="10.0" prefWidth="50.0" />
<Button mnemonicParsing="false" text="Button">
<HBox.margin>
<Insets left="5.0" right="5.0" />
</HBox.margin>
</Button>
<Button mnemonicParsing="false" text="reset">
<HBox.margin>
<Insets left="5.0" right="5.0" />
</HBox.margin>
</Button>
</children>
</HBox>
</children></AnchorPane>
<AnchorPane fx:id="_canvas" prefHeight="600.0" prefWidth="400.0" />
</items>
</SplitPane>
Controller
package Aufgabe1.jfx;
import javafx.fxml.FXML;
import javafx.scene.layout.AnchorPane;
public class Controller {
@FXML
private AnchorPane _canvas ;
// called by the FXML loader after the labels declared above are injected:
public void initialize() {
FunctionCanvas c = new FunctionCanvas();
_canvas.setPrefWidth(400);
_canvas.setPrefHeight(300);
_canvas.getChildren().add(c);
c.drawFunctionCurve();
}
}
I have tried pretty much every solution i came across on the web, but whenever I run the application the canvas with the graph does not show. I am working with IntelliJ IDEA, if that might matter...
Canvas is not a resizable node, in the sense of the JavaFX layout mechanism detailed in the package documentation for javafx.scene.layout.
In particular:
Non-resizable node classes, on the other hand, do not have a consistent resizing API and so are not resized by their parents during layout. Applications must establish the size of non-resizable nodes by setting appropriate properties on each instance. These classes return their current layout bounds for min, pref, and max, and the
resize()method becomes a no-op.
This means that simply resizing the AnchorPane containing the canvas (by setting its preferred width and height) will have no effect on the size of the canvas. Instead, as stated in the documentation above, you "must establish the size of non-resizable nodes [the canvas] by setting appropriate properties on each instance". The "appropriate properties" for a canvas are simply the width and height.
So you just need
public class Controller {
@FXML
private AnchorPane canvasContainer ;
// called by the FXML loader after the labels declared above are injected:
public void initialize() {
FunctionCanvas c = new FunctionCanvas();
c.setWidth(400);
c.setHeight(300);
canvasContainer.getChildren().add(c);
c.drawFunctionCurve();
}
}
As an aside, note you can basically do all of this in the FXML: there is no need to modify the scene graph in the controller. Instead of
<AnchorPane fx:id="_canvas" prefHeight="600.0" prefWidth="400.0" />
do
<AnchorPane>
<FunctionCanvas fx:id="c" width="400" height="300" />
</AnchorPane>
(you will need to add <?import Aufgabe1.jfx.FunctionCanvas?> to the FXML preamble), and then in the controller all you need is
public class Controller {
@FXML
private FunctionCanvas c ;
public void initialize() {
c.drawFunctionCurve();
}
}