javafx transparent window background with decorations - java

I'm having a hard time figuring out how to make a transparent background for an application window in javafx. scene.setFill(null) seems to only work with stage.initStyle(StageStyle.TRANSPARENT). Doc for setFill says
Both a null value meaning paint no background and a Paint with transparency are supported, but what is painted behind it will depend on the platform.
but that doesn't make sense to me. It works (on windows 8) only with StageStyle.TRANSPARENT which removes the exit button and such which I still want.
I've looked at http://www.adam-bien.com/roller/abien/entry/completely_transparent_windows_stage_in and a few questions here.
Can this be done on windows?

I've been tinkering with similar settings, and this works for me:
#Override
public void start(Stage primaryStage) throws Exception{
Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));
primaryStage.setTitle("Hello World");
primaryStage.initStyle(StageStyle.TRANSPARENT);
primaryStage.setOpacity(0.5);
primaryStage.setFullScreen(true);
Scene scene = new Scene(root, 300, 275);
primaryStage.setScene(scene);
scene.getStylesheets().add(Main.class.getResource("main.css")
.toExternalForm());
primaryStage.show();
}
...and the css
.root {
-fx-background-color: rgba(0,0,0,0.5);
}

You can use this library. It is a fully customizable JavaFx Stage (CustomStage). You can see in-detail description of how to use it in this CustomStage Wiki
It has,
Window resizing
Default action buttons and their behaviour (close, maximize/restore, minimize)
Window dragging
Window is automatically scaled as for screen resolution
Very responsive
Stylable
Can achieve transparency
Has in-built navigation panes and drawers
etc.

Related

Javafx 3D disapear in split pane

I developed a 3d plotting tool (so-called A; which is a subscene). I want to put this subscene in a Split Pane (B). The problem is a part of my scene disappears (when I rotate the plot some parts appear). as you can see below:
trauncated plot
However; when I use HBox or Pane instead of SplitPane, everything works well.
the code is here(I simplified it for better understanding)
SplitPane splitPane = FXMLLoader.load(getClass().getResource("sample.fxml"));
Scene scene =new Scene(splitPane);
Pane pane = new HBox();
pane.getChildren().add(A);
splitPane.getItems().add(pane);
primaryStage.setScene(scene);
I solve it. It is a little bit tricky but in the subcode of sub-scene A; I use Stackpane as a root. I changed it to Group. everything works well.

How do I fix blurry nodes when added to a Stackpane?

I'm currently working on a javafx project and I keep running into the problem with blurry nodes when they are added to a Stackpane.
I have tried using setSnapToPixel(true) on the Stackpane but I still end up with a blurry result.
Stackpane pane = new Stackpane(new NodeConsole(15)); //I get a blurry result
primaryStage.setScene(new Scene(pane));
primaryStage.show();
When I use a Group I get this:
Clear Image
When I use a Stackpane I get this:
Blurry Image

How to move and color the navigator's close/minimize/maximize buttons using JavaFX

I would like to know how can I adjust the color of my top ( navigator ) of my program, right now it looks like that:
https://i.imgur.com/NdBUQzt.png
but I want it to be colored, or to make it a part of my software, like spotify does:
https://46c4ts1tskv22sdav81j9c69-wpengine.netdna-ssl.com/wp-content/uploads/2017/06/ef6b137fb60f5671e2d92a8096442a46.png
^ You can notice that the close/minimize/maximize buttons are colored ( black ) and are not in a new line, but in the same level as the software.
Another example would be Word for example:
https://filestore.community.support.microsoft.com/api/images/561dc05e-f679-40d0-8a0d-983f3d90333b
I have heard about some solutions included making my own buttons, and make their functionality to behave like the native's windows 10 ( for example ) one, but in that two cases I listed above ( Spotify and Word ), the buttons are native to the OS, I mean I can tell it's a real windows 10 close/minimize/maximize buttons.
It can be done in any way at javaFX? ( not sure if it's worth mention but I also use an Visual editor - Scene builder )
Thanks in advance.
A possible approach to your problem would be to remove the default layout of the primary stage and start modifying it by yourself. To do that you have to use an undecorated toolbar. You do that at your stage controller:
primaryStage.initStyle(StageStyle.UNDECORATED);
After that you can create your customized toolbar. Here is a very basic example:
primaryStage.initStyle(StageStyle.UNDECORATED);
BorderPane borderPane = new BorderPane();
borderPane.setStyle("-fx-background-color: green;");
ToolBar toolBar = new ToolBar();
int height = 25;
toolBar.setPrefHeight(height);
toolBar.setMinHeight(height);
toolBar.setMaxHeight(height);
toolBar.setStyle("-fx-background-color: blue;");
borderPane.setTop(toolBar);
primaryStage.setScene(new Scene(borderPane, 300, 250));
primaryStage.show();
Anyways you can play with the design and try different ways in order to fit your preferences.
As for the part of native toolbar buttons one idea would be imitating them.
Have a look in the following link how to design them.
http://fxexperience.com/2011/12/styling-fx-buttons-with-css/

JavaFX Visualizations in Canvas

I want to animate sorting algorithms within a canvas in a javafx app. Frstly I have everything within a Border Panel. In the Left section I have a Scroll Pane with a Vbox within that holding the menu buttons for selecting the specific algorithm to animate. In the Center section I have a Vbox with a Canvas in it that I want to animate the visualizations in. My question is how to set the scene to animate the visualization within the Canvas on menu button click? Say I have a BubbleSort class that I want to animate in the Canvas. Would I accomplish this through Main or a controller? My current Main is below:
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception{
Parent root = FXMLLoader.load(getClass().getResource("views/HomeView.fxml"));
primaryStage.setTitle("Hello World");
primaryStage.setScene(new Scene(root, 300, 275));
root.getStylesheets().add("app/styling/css/styles.css");
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
In a JavaFX Application, the main method's purpose (actually the start method) is only to initialize the FXML and other major pieces. The bulk of your UI logic should be contained in your Controller class.
First, you need to define an action handler in your controller. There are many tutorials available online, and it is a fairly simple task in Scenebuilder. Google is your best friend here.
For animations, since JavaFX doesn't allow its displayed contents to be modified by threads other than the JavaFX Application Thread, in which the main application runs, you will have to use classes from the javafx.animationpackage. See Creating Transitions and Timeline Animation in JavaFX.

How to create Splash screen with transparent background in JavaFX

I am trying to create a splash screen like the example I've provded.
It seems that AnchorPane does not allow transparent background, I've tried setting the css of the AnchorPane to -fx-background-color: rgba(255,0,255,0.1) ; but the white background still shows up.
All I have in my fxml file is a AnchorPane with ImageView with contain the png image
I've looked everywhere but can't find any solution, any help would be appreciated. Thanks
Try this JavaFX splash sample created for the Stackoverflow question: Designing a splash screen (java). And a follow up sample which also provides application initialization progress feedback.
JavaFX does offer the Preloader interface for smooth transfer from splash to application, but the above samples don't make use of it.
The splash samples above also don't do the transparent effect, but this dialog sample shows you how to do that and you can combine it with the previous splash samples to get the effect you want.
The transparent effect is created by:
stage.initStyle(StageStyle.TRANSPARENT).
scene.setFill(Color.TRANSPARENT).
Ensuring your root node is not an opaque square rectangle.
Which is all demonstrated in Sergey's sample.
Related question:
How to use javaFX Preloader with stand-alone application in Eclipse?
Update Apr 2016 based on additional questions
the preloader image isnt in the foreground. I have tried stage.toFront(), but doesnt help.
A new API was created in Java 8u20 stage.setAlwaysOnTop(true). I updated the linked sample to use this on the initial splash screen, which helps aid in a smoother transition to the main screen.
For Java8+
For modena.css (the default JavaFX look and feel definition in Java 8), a slight shaded background was introduced for all controls (and also to panes if a control is loaded).
You can remove this by specifying that the default background is transparent. This can be done by adding the following line to your application's CSS file:
.root { -fx-background-color: transparent; }
If you wish, you can use CSS style classes and rules or a setStyle call (as demonstrated in Sergey's answer) to ensure that the setting only applies to the root of your splash screen rather than all of your app screens.
See related:
how to make transparent scene and stage in javafx?
You need to have transparent Stage and Scene for that. Pane itself doesn't have a color.
public void start(Stage primaryStage) {
Button btn = new Button("Say 'Hello World'");
AnchorPane root = new AnchorPane();
root.getChildren().add(btn);
// Java 8: requires setting the layout pane background style to transparent
// https://bugs.openjdk.java.net/browse/JDK-8092764
// "Modena uses a non-transparent background by default"
root.setStyle("-fx-background-color: transparent;");
Scene scene = new Scene(root, 300, 250, Color.TRANSPARENT);
primaryStage.initStyle(StageStyle.TRANSPARENT);
primaryStage.setScene(scene);
primaryStage.show();
}

Categories

Resources