JavaFX 2.0 subwindow - user-interface

How can I display a new window in JavaFX 2.0? For example after button click action.
I want both windows (the main window and the new window) to communicate each other.
Thx for help.

new Stage(new Scene(new Group(new Text(10,10, "my second window")))).show();
Communicating between two windows is similar as for any two objects in Java.

You create new windows by calling new Stage() and show them by stage.show().
Here is an example of creating a new Stage with a checkbox control which modifies text of a label displayed in a different Stage.
import javafx.application.Application;
import javafx.beans.value.*;
import javafx.event.EventHandler;
import javafx.scene.*;
import javafx.scene.control.*;
import javafx.scene.layout.StackPane;
import javafx.stage.*;
public class SecondStage extends Application {
public static void main(String[] args) { launch(args); }
#Override public void start(Stage primaryStage) {
// setup some dymamic data to display.
final String STANDARD_TEXT = "Every Good Boy Deserves Fruit";
final String ALTERNATE_TEXT = "Good Boys Deserve Fruit Always";
final Label label = new Label(STANDARD_TEXT);
// configure the primary stage.
StackPane primaryLayout = new StackPane();
primaryLayout.getChildren().add(label);
primaryLayout.setStyle("-fx-background-color: lightgreen; -fx-padding: 10;");
primaryStage.setScene(new Scene(primaryLayout, 200, 100));
primaryStage.setTitle("Primary Stage");
// configure the secondary stage.
final Stage secondaryStage = new Stage(StageStyle.UTILITY);
CheckBox alternateTextCheck = new CheckBox("Show alternate text");
alternateTextCheck.selectedProperty().addListener(new ChangeListener<Boolean>() {
#Override public void changed(ObservableValue<? extends Boolean> selected, Boolean oldValue, Boolean newValue) {
if (newValue) label.setText(ALTERNATE_TEXT); else label.setText(STANDARD_TEXT);
}
});
StackPane secondaryLayout = new StackPane();
secondaryLayout.getChildren().add(alternateTextCheck);
secondaryLayout.setStyle("-fx-background-color: cornsilk; -fx-padding: 10;");
secondaryStage.setScene(new Scene(secondaryLayout, 200, 100));
secondaryStage.setTitle("Secondary Stage");
// specify stage locations.
secondaryStage.setX(400); secondaryStage.setY(200);
primaryStage.setX(400); primaryStage.setY(350);
// add a trigger to hide the secondary stage when the primary stage is hidden.
// this will cause all stages to be hidden (which will cause the app to terminate).
primaryStage.setOnHidden(new EventHandler<WindowEvent>() {
#Override public void handle(WindowEvent onClosing) {
secondaryStage.hide();
}
});
// show both stages.
primaryStage.show();
secondaryStage.show();
}
}

Inside the button click action you can create a new satge and then a object of the other class you want to display. after that call the start method using the created object.
Stage stage= new Stage();
NewClass nc= new NewClass();
nc.start(stage);
hope this will work!!!

Related

TableView columns position and TabbedPane tabs start from Right Side instead of left in JavaFX?

i've been searching for hours and could not find any way to make the tableView columns and tabs of a TabbedPane start from the right side instead of left.
As we can see in the picture java by default create them from the left side to the right, and leave empty space on the right side. Is there any way to do this vice versa ?
Thank you
see image here
Use setNodeOrientation(NodeOrientation.RIGHT_TO_LEFT);
import javafx.application.Application;
import javafx.geometry.NodeOrientation;
import javafx.scene.Scene;
import javafx.scene.control.Tab;
import javafx.scene.control.TabPane;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.stage.Stage;
public class NodeOrientationTest extends Application {
#Override
public void start(Stage primaryStage) {
TabPane tabPane = new TabPane();
tabPane.setNodeOrientation(NodeOrientation.RIGHT_TO_LEFT);
Tab tab1 = new Tab("Tab 1");
Tab tab2 = new Tab("Tab 2");
tabPane.getTabs().addAll(tab1, tab2);
TableView<Void> table = new TableView<>();
table.setNodeOrientation(NodeOrientation.RIGHT_TO_LEFT);
table.getColumns().add(new TableColumn<Void, Void>("Column 1"));
table.getColumns().add(new TableColumn<Void, Void>("Column 2"));
tab1.setContent(table);
Scene scene = new Scene(tabPane, 800, 600);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
Note that the table view will, by default, inherit this from its parent, so you can omit the call to table.setNodeOrientation(NodeOrientation.RIGHT_TO_LEFT); and achieve the same result. (Or just set it on the scene.)

How do I display two javafx GUI screens in the same program

My question is how to display more than one user interface screen per program. I'm sure this question has been asked before, but I haven't found a solution that works for me (or should I say that I understand). There isn't anything exotic about the scenarios I'm talking about. The first is simply validating inputs from a screen and re-displaying the same screen in the case of errors.
I'll pose the question in terms of the second more complicated scenario: displaying an input data screen, processing the inputs; and then displaying the outputs. This complicated somewhat by the fact that the first, a simple screen with 5 text boxes and a command button, uses an FXML file, whereas the second, a multi-select list box does not. The flow is:
1. Main program calls
2. A loader program which loads the FXML and somehow or another calls
3. A controller which receives the inputs and processes them to produce output.
The final step is to display the output in the form of a multi-select list box. Note that the first GUI employs a controller, which is a separate file, to process the inputs, whereas the second uses an event handler, which is in the same file as the screen definition, to make the selection(s) when the user clicks a command button.
Various SO posts have said that the way to go is to not shut down the application once the first GUI has completed via but Keep the JavaFX run time going in the background with
Platform.setImplicitExit(false);
and to define each GUI and simply switch scenes to the one you want to display. But where, given the scenario I described do you put the code? The second GUI has three pieces: screen definition, event handler(s), and scene switching code. Where do you put each? #2 or #3. If you put some in #2 and some in #3, how does #3 know what you did in #2?
The code for #2 the FMXL loader:
public class inputData extends Application {
public static void load() {
launch();
}
#Override
public void start(Stage stage) throws Exception {
GridPane inpRoot = FXMLLoader.load(getClass().getResource("inputData.fxml"));
Scene inpScene = new Scene(inpRoot, 300, 275);
stage.setTitle("Amsnag 2.1 - Query Input");
stage.setScene(inpScene);
stage.show();
}
}
Code for #3, the list box definition and handlers, which worked fine running separately. It's only when I tried to incorporate it with the rest of the program that it failed.
public class multiList extends Application {
public static void load() {
launch();
}
public static final ObservableList options = FXCollections.observableArrayList();
#Override
public void start(final Stage stage) {
final ListView<String> listView = new ListView<>();
listView.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);
// load list from DB
Connection conn = sql.connect();
try {
// initialize option table
ResultSet rs = sql.select(conn,
"select distinct connDesc,accom from option order by connDEsc,accom");
while (rs.next()) {
String opt = rs.getString("connDesc") + ": " + rs.getString("accom");
listView.getItems().add(opt);
}
conn.close();
}
catch (SQLException e) {
System.out.println(e.getMessage()+ " from init");
}
// button to display fares
final Button displayButton = new Button("Display Fares");
// handle button click
displayButton.setOnAction(new EventHandler<ActionEvent>() {
#Override public void handle(ActionEvent event) {
Platform.exit(); // close list box
ObservableList selectedIndices = listView.getSelectionModel().getSelectedItems();
// lcreate temp table with selected options
Connection conn = sql.connect();
try {
// initialize option table
ResultSet rs = sql.select(conn,
"create temporary table selected (connDesc varchar(200),accom varchar(50))");
for(Object o : selectedIndices){
String option = o.toString();
// extract connDesc+accom from displayed option
msg.g(option);
}
conn.close();
}
catch (SQLException e) {
System.out.println(e.getMessage()+ " from init");
}
}
} ); // end of display handler
// quit button
final Button resetButton = new Button("Quit");
resetButton.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
Platform.exit();
}
});
final HBox controls = new HBox(10);
controls.setAlignment(Pos.CENTER);
controls.getChildren().addAll(displayButton, resetButton);
final VBox layout = new VBox(10);
layout.setAlignment(Pos.CENTER);
layout.setStyle("-fx-padding: 10; -fx-background-color: cornsilk;");
layout.getChildren().setAll(listView, controls);
layout.setPrefWidth(320);``enter code here
Scene scene = new Scene(layout);
// stage.setScene(new Scene(layout));
stage.setScene(scene);
stage.setTitle("Select one or more options");
stage.show();
}
public static void main(String[] args) { launch(args); }
}
You can't reuse an Application subclass in a different application.
The Application class represents an entire application, or perhaps more specifically its lifecycle. So it has methods such as init(), start(), and stop() which are invoked by the FX Application Toolkit at the appropriate moments in the lifecycle of the application.
The layout for your multiList (aside: please use proper naming conventions) class is performed in the start() method, so it can only happen at the start of the application. By putting the layout code here, you make it impossible to reuse so that it is performed at a later point in a different application.
So move the layout for MultiList to a separate class:
public class MultiList {
public static final ObservableList options = FXCollections.observableArrayList();
private final VBox view ;
public MultiList() {
final ListView<String> listView = new ListView<>();
listView.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);
// load list from DB
Connection conn = sql.connect();
try {
// initialize option table
ResultSet rs = sql.select(conn,
"select distinct connDesc,accom from option order by connDEsc,accom");
while (rs.next()) {
String opt = rs.getString("connDesc") + ": " + rs.getString("accom");
listView.getItems().add(opt);
}
conn.close();
}
catch (SQLException e) {
System.out.println(e.getMessage()+ " from init");
}
// button to display fares
final Button displayButton = new Button("Display Fares");
// handle button click
displayButton.setOnAction(new EventHandler<ActionEvent>() {
#Override public void handle(ActionEvent event) {
Platform.exit(); // close list box
ObservableList selectedIndices = listView.getSelectionModel().getSelectedItems();
// create temp table with selected options
Connection conn = sql.connect();
try {
// initialize option table
ResultSet rs = sql.select(conn,
"create temporary table selected (connDesc varchar(200),accom varchar(50))");
for(Object o : selectedIndices){
String option = o.toString();
// extract connDesc+accom from displayed option
msg.g(option);
}
conn.close();
} catch (SQLException e) {
System.out.println(e.getMessage()+ " from init");
}
}
}); // end of display handler
// quit button
final Button resetButton = new Button("Quit");
resetButton.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
Platform.exit();
}
});
final HBox controls = new HBox(10);
controls.setAlignment(Pos.CENTER);
controls.getChildren().addAll(displayButton, resetButton);
view = new VBox(10);
view.setAlignment(Pos.CENTER);
view.setStyle("-fx-padding: 10; -fx-background-color: cornsilk;");
view.getChildren().setAll(listView, controls);
view.setPrefWidth(320);
}
public Parent getView() {
return view ;
}
}
Now if you want to test this out on its own, you can write an application for it:
public class MultiListApp extends Application {
#Override
public void start(Stage primaryStage) {
MultiList multiList = new MultiList() ;
Scene scene = new Scene(multiList.getView());
primaryStage.setScene(scene);
primarStage.setTitle("Select one or more options");
primaryStage.show();
}
}
Or in the controller class for InputData.fxml, you can do the same thing:
public class InputDataController {
#FXML
private void someEventHandler() {
MultiList multiList = new MultiList() ;
Scene scene = new Scene(multiList.getView());
Stage stage = new Stage();
stage.setScene(scene);
stage.setTitle("Select one or more options");
stage.show();
}
}

Create GUI in SceneBuilder(FXML) instead of Java code

My JavaFX code creates a stage which contains a simple text field. This field allows a user to drag-and-drop text into it, so it can parse out the text/html componenets.
Currently the text field and stage are created in Java code, but I'd like to design the GUI in Scene Builder. Two questions:
How do I convert the Java code into FXML?
How do I change the textfield into a textarea so it can be larger?
Other stages that I've designed in Scene Builder have been created like:
FXMLLoader loader = new FXMLLoader(getClass().getResource("menu.fxml"));
Parent root = loader.load();
Controller controller = loader.getController();
Scene scene = new Scene(root, 420, 580);
controller.setPrimaryScene(scene);
scene.getStylesheets().add("styleMain.css");
primaryStage.setTitle("Demo");
primaryStage.setScene(scene);
primaryStage.show();
But my Java code uses DragEvents and lambdas so I'm confused how to approach this. Does the event handler code remain in Java, and the design code transfer to FXML somehow?
public void start(Stage stage) throws Exception {
TextField textField = new TextField();
textField.textProperty().addListener(new ChangeListener<String>() {
#Override
public void changed(final ObservableValue<? extends String> observable, final String oldValue, final String newValue) {
htmlFound = newValue;
textFound = html2text(newValue);
}
});
textField.setPromptText("Drag data here");
textField.addEventHandler(
DragEvent.DRAG_OVER,
event -> {
if (event.getDragboard().hasHtml()) {
event.acceptTransferModes(TransferMode.COPY);
}
event.consume();
});
textField.addEventHandler(
DragEvent.DRAG_DROPPED,
event -> {
Dragboard dragboard = event.getDragboard();
if (event.getTransferMode() == TransferMode.COPY &&
dragboard.hasHtml()) {
textField.setText(dragboard.getHtml());
event.setDropCompleted(true);
}
event.consume();
});
StackPane stackPane = new StackPane(textField);
stackPane.setPadding(new Insets(5));
stage.setScene(new Scene(stackPane, 300, 150));
stage.setTitle("Drag and Drop");
stage.show();

About TextField with a small icon

I want to code a TextField component with icon.
So the behavior is as follow:
If the TextField contains an empty string, I use "lens.png".
Otherwise, i use "cross.png".
using the JavaFX Scene Builder, I added a TextFiled and an ImageView in the stack pane.
My code is the following:
#FXML
private TextField textSearch;
#FXML
private ImageView imageView;
final Image lensIcon = new Image("/issue/images/lens.png");
final Image crossIcon = new Image("/issue/images/cross.png");
//initialize () method
textSearch.textProperty().addListener(obs -> {
final String text = textSearch.getText();
Image icon = (text==null || text.isEmpty()) ? lensIcon : crossIcon;
imageView.setImage(icon);
imageView.setMouseTransparent(icon == lensIcon);
}
);
imageView.setOnMouseClicked(evt -> textSearch.setText(null));
my issue is the following:
How to prevent writing caracters below the icon (ImageView). the following figure illustrate my issue.
ControlsFX is an JavaFX API that supplies a ton of advanced controls UI that didn't come with JavaFX out of the box.
ControlsFX - http://fxexperience.com/controlsfx/
FontAwesomeFX supplies hundreds of icons (such as a cross in your case above)
FontAwesomeFX - https://bitbucket.org/Jerady/fontawesomefx/downloads/
Here is a demo solution to your problem after importing both these fantastic APIs
public class TextFields_Demo extends Application {
private Parent createContent() {
Pane root = new Pane();
CustomTextField customTextField = new CustomTextField();
FontAwesomeIconView icon = new FontAwesomeIconView(FontAwesomeIcon.CLOSE);
customTextField.setRight(icon);
root.getChildren().add(customTextField);
return root;
}
#Override
public void start(Stage primaryStage) {
Scene scene = new Scene(createContent());
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}

Interoperability problems when using JavaFx combobox within SWT Dialog

JavaFx is supposed to be easily integrated in an SWT application (see here: http://docs.oracle.com/javafx/2/swt_interoperability/jfxpub-swt_interoperability.htm) and both toolkits use the same threading model.
However things get strange, when I open a dialog containing an FxCanvas which contains a JavaFx ComboBox. If I open the combo box popup menu and then close the dialog, the popup menu stays open. If I now move the mouse onto the popup a null pointer exception is thrown within javafx. When doing this within a larger application all JavaFx GUIs remain broken until the application is restarted.
Any ways to work around this?
Example code below: Close the dialog with 'Ok' or the window close button. Exit the application with 'Cancel'
package test;
import javafx.embed.swt.FXCanvas;
import javafx.geometry.Insets;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.ComboBox;
import javafx.scene.layout.StackPane;
import org.eclipse.jface.dialogs.Dialog;
import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Control;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;
public class TestFx {
static class MyDialog extends Dialog {
Parent w;
public MyDialog(Shell parent,Parent n) {
super(parent);
this.w = n;
setShellStyle(SWT.RESIZE| SWT.BORDER | SWT.TITLE |SWT.CLOSE );
}
#Override
public void cancelPressed() {
System.exit(0);
}
#Override
protected Control createDialogArea(Composite parent) {
Composite container = (Composite) super.createDialogArea(parent);
container.setLayout(new FillLayout());
FXCanvas fxCanvas = new FXCanvas(container, SWT.NONE);
Scene scene = new Scene(w);
fxCanvas.setScene(scene);
return container;
}
}
private static Parent createScene() {
StackPane pane = new StackPane();
pane.setPadding(new Insets(10));
ComboBox<String> c = new ComboBox<String>();
c.getItems().addAll("Test1","Test2");
pane.getChildren().add(c);
return pane;
}
public static void main(String[] args) {
Display display = new Display();
Shell shell = new Shell(display);
while (true) {
MyDialog d = new MyDialog(shell,createScene());
d.open();
}
}
}
Exception:
java.lang.NullPointerException
at com.sun.javafx.tk.quantum.GlassScene.sceneChanged(GlassScene.java:290)
at com.sun.javafx.tk.quantum.ViewScene.sceneChanged(ViewScene.java:156)
at com.sun.javafx.tk.quantum.PopupScene.sceneChanged(PopupScene.java:30)
at com.sun.javafx.tk.quantum.GlassScene.markDirty(GlassScene.java:157)
at javafx.scene.Scene$ScenePulseListener.pulse(Scene.java:2214)
at com.sun.javafx.tk.Toolkit.firePulse(Toolkit.java:363)
at com.sun.javafx.tk.quantum.QuantumToolkit.pulse(QuantumToolkit.java:460)
at com.sun.javafx.tk.quantum.QuantumToolkit$9.run(QuantumToolkit.java:329)
at org.eclipse.swt.internal.win32.OS.DispatchMessageW(Native Method)
at org.eclipse.swt.internal.win32.OS.DispatchMessage(OS.java:2546)
at org.eclipse.swt.widgets.Display.readAndDispatch(Display.java:3756)
at org.eclipse.jface.window.Window.runEventLoop(Window.java:825)
at org.eclipse.jface.window.Window.open(Window.java:801)
at test.TestFx.main(TestFx.java:55)
At work we're developing some applications using JavaFX, on top of and old Swing platform and we also have found this issue.
Apparently it is caused by some issues on JFXPanel which is not correctly propagating some window events (focus, iconifying, etc) to the FX framework. The issue affects not only the ComboBox component, but every component that uses a PopupWindow (Menu, Tooltip, etc), specially when using Swing's JInternalFrame.
So, when a Popup is displaying and the window is minimized or closed, the Popup does not hide, causing the FX thread to crash if you try subsequently to interact with it.
The workaround mentioned above works, but only for ComboBox, as Menu and Tooltip does not inherit from the Node class, so didn't work for us :(
I developed another workaround which resolved the problem for all components that display popups, which basically forces all popups to close whenever a JFXPanel loses focus:
private static void initFX(final JFXPanel jfxPanel) {
final TestFxPanel parent = new TestFxPanel();
final Scene scene = new Scene(parent);
jfxPanel.setScene(scene);
jfxPanel.addFocusListener(new FocusAdapter() {
#Override
public void focusLost(final FocusEvent e) {
System.out.println(jfxPanel.getName() + ": FocusLost");
runFocusPatch(scene);
}
});
}
static void runFocusPatch(final Scene scene) {
Platform.runLater(new Runnable() {
#Override
public void run() {
System.out.println("Running patch");
final Iterator<Window> winIter = scene.getWindow().impl_getWindows();
while (winIter.hasNext()) {
final Window t = winIter.next();
if (t instanceof PopupWindow) {
System.out.println("Got a popup");
Platform.runLater(new Runnable() {
#Override
public void run() {
((PopupWindow) t).hide();
}
});
}
}
}
});
}
I confirm that the issue is NOT present in 8.0. Sadly we are not allowed to java 8 in production software as its still in beta stage.
best regards.
I found a workaround when using Java7: Override the close method in Dialog to hide the combo box popups:
#Override
public boolean close() {
Set<Node> nodes = w.lookupAll("#");
for (Node n : nodes)
if (n instanceof ComboBox)
((ComboBox)n).hide();
return super.close();
}
The trouble is discussed here : javafx-jira.kenai.com/browse/RT-30991
Developer has said, that the issue is fixed in JavaFX-8

Resources