CODEWITHSUNDEEP
cssjavafxbackground-color
coolgarcon
coolgarcon

Reputation: 31

Java FX CSS Divdie Background into 2 Colors with Specific Coordinates

I am new to Java FX CSS. I want to divide the background into 2 colors at with specific x,y coordinates : -

  1. White Color: - (0,0) to (700,1200)
  2. Black Color: - (700,0) to (1900,1200)

So this will look like 2 rectangles left side is of light grey color and right is black color. I could create a png file using paint but it's too much work.

Upvotes: 1

Views: 1305

Answers (1)

James_D
James_D

Reputation: 209553

You can do

.root {
    -fx-background-color: linear-gradient(from 0px 0px to 1900px 0px, white 0%, white 36.84%, black 36.84%, black 100%);
}

(Note 700/1900 = 36.84%).

Here's an simple test example, with the code above in two-tone-background.css:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.stage.Stage;

public class TwoToneBackground extends Application {

    @Override
    public void start(Stage primaryStage) {
        Scene scene = new Scene(new Pane(), 1900, 1200);
        scene.getStylesheets().add("two-tone-background.css");
        scene.getRoot().applyCss();
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

This results in:

enter image description here

Upvotes: 1

Related Questions