I create a button and I want to set up its width and height through css. I tried this but it didn't work.
Other properties( such as font-size and text fill) are fine and work correctly. But the width of Button seems to be fixed and doesn't change.
package sample;
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception{
VBox root = new VBox();
Button button = new Button("Button");
root.getChildren().add(button);
Scene scene = new Scene(root);
scene.getStylesheets().add(getClass().getResource("Style.css").toExternalForm());
button.setId("button");
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
And in "Style.css":
#button{
-fx-width: 300;
-fx-font-size:20;
-fx-text-fill: yellow;
}
Related
I am trying to add some custom css to a button of mine, the css file is in the same folder as my testButton.java. this is my main/only class:
import com.jfoenix.controls.JFXButton;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.HPos;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.stage.Stage;
import javafx.stage.Window;
public class testButton extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
primaryStage.setTitle("Vulpix Skyen");
GridPane gridPane = createRegistrationFormPane();
addUIControls(gridPane);
Scene scene = new Scene(gridPane, 800, 500);
scene.getStylesheets().clear();
scene.getStylesheets().add(getClass().getResource("test.css").toExternalForm());
primaryStage.setScene(scene);
primaryStage.show();
}
private GridPane createRegistrationFormPane() {
GridPane gridPane = new GridPane();
return gridPane;
}
private void addUIControls(GridPane gridPane) {
JFXButton jfoenixButton = new JFXButton("JFoenix Button");
JFXButton button = new JFXButton("Raised Button".toUpperCase());
button.getStyleClass().add("button-raised");
jfoenixButton.getStyleClass().add("button-raised");
gridPane.add(jfoenixButton, 0, 0);
gridPane.add(button, 1, 0);
}
public static void main(String[] args) {
launch(args);
}
}
and here is the css file:
.button-raised {
-fx-padding: 0.7em 0.57em;
-fx-font-size: 140px;
-jfx-button-type: raised;
-fx-background-color: rgb(77, 102, 204);
-fx-pref-width: 200;
-fx-text-fill: ORANGE;
}
And no matter what I change, my button stays the same default style. nothing in particular i am trying to add with the css, but no idea why its not changing at all.
You are not adding the styled button to the gridPane. The only button added to the pane is jfoenixButton which does not have the button-raised class.
Either add the class to that button too:
jfoenixButton.getStyleClass().add("button-raised");
Or add the styled button to your gridPane:
gridPane.add(button, 1, 0);
One of the options should solve your problem.
You should import your CSS in your GridPane (with Scene Builder) to allow you utilize jfoenixButton.getStyleClass().add("button-raised");
I made a javafx program using a horizontal SplitPane with a Canvas on one side in which something is drawn. When the SplitPane is resized the Canvas resizes with it.
Everything worked fine until I switched to Java 10. Suddenly the Canvas-side can only be expanded, not reduced.
Anyone has an idea why that is?
(The working Java version was 1.8.0_181)
package test;
import javafx.application.Application;
import javafx.geometry.Orientation;
import javafx.scene.Scene;
import javafx.scene.control.SplitPane;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class Test extends Application {
private static Display display;
#Override
public void start(Stage primaryStage) {
display = new Display();
StackPane stackPaneDisplay = new StackPane();
stackPaneDisplay.getChildren().add(display);
stackPaneDisplay.setStyle("-fx-background-color: white");
AnchorPane anchorPaneDisplay = new AnchorPane();
anchorPaneDisplay.getChildren().add(stackPaneDisplay);
AnchorPane.setBottomAnchor(stackPaneDisplay, Double.MIN_VALUE);
AnchorPane.setTopAnchor(stackPaneDisplay, Double.MIN_VALUE);
AnchorPane.setLeftAnchor(stackPaneDisplay, Double.MIN_VALUE);
AnchorPane.setRightAnchor(stackPaneDisplay, Double.MIN_VALUE);
display.widthProperty().bind(stackPaneDisplay.widthProperty());
display.heightProperty().bind(stackPaneDisplay.heightProperty());
StackPane stackPaneLeft = new StackPane();
SplitPane splitPane = new SplitPane();
splitPane.setOrientation(Orientation.HORIZONTAL);
splitPane.getItems().addAll(stackPaneLeft, anchorPaneDisplay);
BorderPane root = new BorderPane();
root.setCenter(splitPane);
Scene scene = new Scene(root);
primaryStage.setMaximized(true);
primaryStage.setScene(scene);
primaryStage.show();
splitPane.setDividerPositions(0.2);
}
public static void main(String[] args) {
launch(args);
}
}
and the Canvas-Class
package test;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
public class Display extends Canvas {
GraphicsContext gc = this.getGraphicsContext2D();
public Display() {
widthProperty().addListener(e -> {
draw();
});
}
public void draw() {
gc.strokeOval(500, 500, 100, 100);
}
}
Thanks in advance
So, I can't seem to make the HBox show up in my application. The Button shows up, but the HBox does not. Can someone please let me know what I'm doing wrong?
package cyanlauncher;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
public class Main extends Application {
private int numApps = 0;
private float btnSize = 48;
private float btnSpacing = 12;
#Override
public void start(Stage primaryStage) {
primaryStage.initStyle(StageStyle.TRANSPARENT);
primaryStage.setTitle("CyanLauncher");
Button quitBtn = new Button();
Pane root = new Pane();
root.getChildren().add(addHBox());
quitBtn.setGraphic(new ImageView(new Image(getClass().getResourceAsStream("./../data/exit.png"))));
quitBtn.setLayoutX(10 + ((btnSize + btnSpacing) * numApps));
quitBtn.setLayoutY(7);
quitBtn.setPadding(new Insets(0,0,0,0));
quitBtn.setPrefSize(btnSize, btnSize);
quitBtn.setOnAction(new EventHandler<ActionEvent>(){
#Override
public void handle(ActionEvent event){
System.exit(0);
}
});
root.getChildren().add(quitBtn);
Scene scene = new Scene(root,64,64);
scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
scene.setFill(null);
primaryStage.setScene(scene);
primaryStage.show();
}
public HBox addHBox() {
HBox hbox = new HBox();
hbox.setPrefSize(64, 64);
hbox.setLayoutX(10);
hbox.setLayoutY(7);
return hbox;
}
public static void main(String[] args) {
launch(args);
}
}
And here is my CSS:
/* JavaFX CSS - Leave this comment until you have at least create one rule which uses -fx-Property */
.root {
-fx-background-color: rgba(0,255,0,1);
}
.button {
-fx-background-color: rgba(0,0,255,1);
}
.hbox {
-fx-background-color: rgba(255,0,0,1);
}
HBox has no style class by default (see docs). So you need to do hbox.getStyleClass().add("hbox") in your (really badly named) addHBox() method.
I'm trying to make a "launcher" with javafx.
This is my code :
I'm not shure you have to read all of this code, this code is here.
I'm trying to put a javaFX "play" button (i know how to make a button and how to set up an onclick event but i don't know where to add it :/)
Have you got an idea ? Thx.
package fr.whiteplay.main.launcher;
public class Launcher{
private static WebViewSample launcher;
private static String[] a;
public static void main(String[] args){
launcher = new WebViewSample();
a = args;
}
public static void start(){
launcher.go(a);
}
}
package fr.whiteplay.main.launcher;
import javafx.application.Application;
import javafx.geometry.HPos;
import javafx.geometry.VPos;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import javafx.scene.paint.Color;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
public class WebViewSample extends Application{
private Browser browser;
private Scene scene;
public void start(Stage stage){
// create the scene
stage.setTitle("WhitePlay");
browser = new Browser();
scene = new Scene(browser, 992, 620, Color.web("#000000"));
stage.setScene(scene);
stage.show();
}
public static void go(String[] args){
launch(args);
}
}
package fr.whiteplay.main.launcher;
import javafx.geometry.HPos;
import javafx.geometry.VPos;
import javafx.scene.Node;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
class Browser extends Region{
final WebView browser = new WebView();
final WebEngine webEngine = browser.getEngine();
public Browser(){
getStyleClass().add("browser");
webEngine.load("http://www.whiteplay.fr/launcher/index.html");
getChildren().add(browser);
}
private Node createSpacer(){
Region spacer = new Region();
HBox.setHgrow(spacer, Priority.ALWAYS);
return spacer;
}
protected void layoutChildren(){
layoutInArea(browser, 0, 0, getWidth(), getHeight(), 0, HPos.CENTER, VPos.CENTER);
}
}
Instead of the browser itself, the scene root must be a structured panel, which contains the browser, the button, and whatever else.
The simplest example is to replace your WebViewSample.start() method with the following:
public void start(Stage stage){
// create the scene
stage.setTitle("WhitePlay");
browser = new Browser();
BorderPane root = new BorderPane();
root.setCenter(browser);
Button button = new Button("Play");
root.setBottom(button);
button.setOnAction(a -> System.out.println("Play"));
scene = new Scene(root, 992, 620, Color.web("#000000"));
stage.setScene(scene);
stage.show();
}
Check this page for further reference on various layouts options, and how to work with them.
How I will get white rectangle in the middle of scene. I wanna preserve my own code and the height and width of it. Probably it should be use to set X and Y layouts. but I do not know how. When I set them, it resize it from upper left corner.
Code:
Pane paneCanvas = new Pane();
final Canvas canvas = new Canvas();
paneCanvas.setStyle("-fx-background-color: white;");
canvas.setHeight(32);
canvas.setWidth(32);
paneCanvas.getChildren().add(canvas);
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
Try this example ... for position in middle of scene you can calculate width this formula:
layoutxcanvas=(widthscene/2)-(widthcanvas/2)
layoutycanvas=(heightscene/2)-(heightcanvas/2)
import java.awt.Graphics2D;
import java.awt.Paint;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.control.Button;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
public class JavaFXApplication1 extends Application {
#Override
public void start(Stage primaryStage) {
Pane paneCanvas = new Pane();
final Canvas canvas = new Canvas();
paneCanvas.setStyle("-fx-background-color: black;");
canvas.setHeight(32);
canvas.setWidth(32);
canvas.getGraphicsContext2D().setFill(Color.WHITE);
canvas.getGraphicsContext2D().fillRect(0, 0, 32, 32);
canvas.setLayoutX((300/2)-(32/2));
canvas.setLayoutY((300/2)-(32/2));
paneCanvas.getChildren().add(canvas);
Scene scene=new Scene(paneCanvas,300,300);
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
}
/**
* #param args the command line arguments
*/
public static void main(String[] args) {
launch(args);
}