JavaFx HTMLEditor doesn't take all free size on the container - javafx-2

I try to set javafx HTMLEditor to get all free size on the container.
The next is the source code.
public class HtmlEditorTest extends Application {
#Override
public void start(Stage stage) {
stage.setTitle("HTMLEditor Sample");
stage.setWidth(400);
stage.setHeight(300);
final HTMLEditor htmlEditor = new HTMLEditor();
htmlEditor.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
MigPane migPane = new MigPane("fill, debug", "[fill]", "fill");
migPane.add(htmlEditor);
Scene scene = new Scene(migPane);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}
If I'll replace HTMLEditor with TextArea I get the expected behaviour. You may see result here
setting htmlEditor.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE)
not solved the problem (based on this answer.
As you may see on the picture I use MigPane in debug mode. And actually the TextArea and HTMLEditor taking the whole container free space. However HTMLEditor text area and scroll bar don't take the free space within HTMLEditor.
How I may fix this problem?

The next addition solved this issue.
WebView webview = (WebView) editor.lookup("WebView");
GridPane.setHgrow(webview, Priority.ALWAYS);
GridPane.setVgrow(webview, Priority.ALWAYS);

Related

Scaling in JavaFX and ScrollPanes

I've been trying to work with the scaling transform in JavaFX, but haven't quite been able to wrap my head around it. Basically, I have a Pane containing a complex graph and would like to be able to rescale it. The scaling part itself works fine, however, the enclosing scroll pane will not adapt to the graph.
For simplicity's sake, i'll post a short example in which my graph is replaced by a label:
public class TestApp extends Application {
#Override public void start(final Stage stage) throws Exception {
final Label label = new Label("Hello World");
label.getTransforms().setAll(new Scale(0.5, 0.5));
label.setStyle("-fx-background-color:blue");
label.setFont(new Font(200));
final ScrollPane scrollPane = new ScrollPane();
scrollPane.setContent(label);
stage.setScene(new Scene(scrollPane));
stage.setWidth(200);
stage.setHeight(100);
stage.show();
}
public static void main(String[] args) {
Application.launch(args);
}
}
The label will scale correctly, but the enclosing scroll pane's bars will still accomodate a component of the original size.
I've tried so far:
Playing around with the labels min and pref size
wrapping the label inside a Group (no scrollbars will appear whatsoever)
scaling the enclosing Group rather than the label
What am I missing? What can I do to make the ScrollPane adapt to the content view?
Thanks for your help.
According to the ScrollPane document you might try to wrap a Pane in a Group so the ScrollPane is scroll by visual bound not the actual layout bound.
ScrollPane layout calculations are based on the layoutBounds rather than the
boundsInParent (visual bounds) of the scroll node. If an application wants the
scrolling to be based on the visual bounds of the node (for scaled content etc.),
they need to wrap the scroll node in a Group.
I implemented scaling in a ScrollPane for Graphs and other nodes in
this example of scrollpane viewports, transforms and layout bounds in JavaFX.
The code was implemented when I was first learning JavaFX, so certainly the code could be cleaner and perhaps there are simpler ways to accomplish this (e.g. using a Group as the container for the scaled node as suggested in the ScrollPane documentation).
One key to getting the solution I wanted (ScrollBars only appearing when you are zoomed in and the node is larger than the visible viewport), was this code:
// create a container for the viewable node.
final StackPane nodeContainer = new StackPane();
nodeContainer.getChildren().add(node);
// place the container in the scrollpane and adjust the pane's viewports as required.
final ScrollPane scrollPane = new ScrollPane();
scrollPane.setContent(nodeContainer);
scrollPane.viewportBoundsProperty().addListener(
new ChangeListener<Bounds>() {
#Override public void changed(ObservableValue<? extends Bounds> observableValue, Bounds oldBounds, Bounds newBounds) {
nodeContainer.setPrefSize(
Math.max(node.getBoundsInParent().getMaxX(), newBounds.getWidth()),
Math.max(node.getBoundsInParent().getMaxY(), newBounds.getHeight())
);
}
});
...
// adjust the view layout based on the node scalefactor.
final ToggleButton scale = new ToggleButton("Scale");
scale.setOnAction(new EventHandler<ActionEvent>() {
#Override public void handle(ActionEvent actionEvent) {
if (scale.isSelected()) {
node.setScaleX(3); node.setScaleY(3);
} else {
node.setScaleX(1); node.setScaleY(1);
}
// runlater as we want to size the container after a layout pass has been performed on the scaled node.
Platform.runLater(new Runnable() {
#Override public void run() {
nodeContainer.setPrefSize(
Math.max(nodeContainer.getBoundsInParent().getMaxX(), scrollPane.getViewportBounds().getWidth()),
Math.max(nodeContainer.getBoundsInParent().getMaxY(), scrollPane.getViewportBounds().getHeight())
);
}
});
}
});

How to align icon and text inside the big button?

I have quite a big button (minWidth and minHeight were explicitly set to big numbers), and inside that big button there is relatively small icon and some text. Icon and text do not consume all available space, and end up being placed in the center of the button.
I want to put icon and text to the left side of the button. But it seems that I do not understand what all those alignments mean, since setting alignment to BASELINE_LEFT or setting textAlignment to LEFT didn't change anything.
How can I fix it?
Property textAlignment controls alignment for multiline text so it wouldn't help you.
But both
btn.setStyle("-fx-alignment: LEFT;");
or
btn.setAlignment(Pos.BASELINE_LEFT);
should work for you. See example below.
public class ILoveBigButtonsAndICannotLie extends Application {
#Override
public void start(Stage primaryStage) {
Button btn = new Button();
btn.setText("Button");
btn.setGraphic(new Rectangle(10,10, Color.RED));
btn.setMinHeight(200);
btn.setMinWidth(250);
//btn.setStyle("-fx-alignment: LEFT;");
btn.setAlignment(Pos.BASELINE_LEFT);
StackPane root = new StackPane();
root.getChildren().add(btn);
primaryStage.setScene(new Scene(root, 300, 250));
primaryStage.show();
}
public static void main(String[] args) { launch(); }
}

ListView clipping

i working little bit with the ListView from JavaFx2. I´m running into one issue.
Is it possible to turn off the clipping of the ListCell/ListView?
I add an ImageView that has to be wider than the ListView and JavaFx2 shows automatically a scrollbar.
This my code snipped how i add the ImageView to my List:
list.setCellFactory(new Callback<ListView<String>, ListCell<String>>() {
#Override
public ListCell<String> call(ListView<String> param) {
final ListCell<String> blub = new ListCell<String>() {
#Override
protected void updateItem(String item, boolean empty) {
super.updateItem(item, empty);
if (item != null) {
StackPane p = new StackPane();
Label label = new Label(item);
p.getChildren().addAll(img, label);
setGraphic(p);
p.setAlignment(Pos.CENTER_LEFT);
}
}
};
blub.setStyle("-fx-background-color:transparent");
return blub;
}
});
Big thanks!
I don't think it's possible.
Maybe try to play with the Skin of the ListView. It seems that the scroll bar are managed in this class. It do not use a scroll pane.
Another solution could be replacing the ListView by a VBox in a ScrollPane.
Finally, you could try to modify img (by the way, where it come from, and what Class is it ?) to only show what you need.
Anyway, I'm interested by the solution you will use.

setFocusTraversable behavior on MenuBar in JavaFX 2.0

I have noticed an issue with setFocusTraversable() on MenuBar control. If I call setFocusTraversable(false) on menuBar object the focus traverses (I can see the menubar getting highlighted/selected) to menu when I press Tab from TextField but the event (changed()) does not get fired. If I call setFocusTraversable(true) on menuBar object and press Tab when in TextField the focus does not visually traverses to MenuBar(TextField loses focus) but the event gets fired and additionally the focus can not be set on TextField using Tab or Shift + Tab. I am not sure if this is a bug or problem with my understanding.
Here is the code.
public class MenuTest extends Application
implements ChangeListener
{
MenuBar menuBar = new MenuBar();
TextField tf1 = new TextField("One");
public static void main(String[] args)
{
Application.launch(args);
}
#Override
public void start(Stage primaryStage)
{
Group content = new Group();
BorderPane paneLayout = new BorderPane();
final Menu menu1 = new Menu("File");
menuBar.getMenus().addAll(menu1);
Menu exit = new Menu("Exit");
menu1.getItems().add(exit);
content.getChildren().add(tf1);
paneLayout.setTop(menuBar);
paneLayout.setCenter(content);
Scene scene = new Scene(paneLayout, 300, 250);
primaryStage.setScene(scene);
primaryStage.show();
menuBar.setFocusTraversable(false);
menuBar.focusedProperty().addListener(this);
tf1.focusedProperty().addListener(this);
tf1.requestFocus();
}
public void changed(ObservableValue ov, Object t, Object t1)
{
System.out.println("focus gained - " + ov.toString());
}
}
Please help.
Thanks,
KK
PS: MenuBar API explicitly says that "MenuBar sets focusTraversable to false." but behaves differently.
Unfortunately you've met a bug: http://javafx-jira.kenai.com/browse/RT-20595

How to remove JavaFX stage buttons (minimize, maximize, close)

How to remove JavaFX stage buttons (minimize, maximize, close)? Can't find any according Stage methods, so should I use style for the stage? It's necessary for implementing Dialog windows like Error, Warning, Info.
If you want to disable only the maximize button then use :
stage.resizableProperty().setValue(Boolean.FALSE);
or if u want to disable maximize and minimize except close use
stage.initStyle(StageStyle.UTILITY);
or if you want to remove all three then use
stage.initStyle(StageStyle.UNDECORATED);
You just have to set a stage's style. Try this example:
package undecorated;
import javafx.application.Application;
import javafx.stage.StageStyle;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class UndecoratedApp extends Application {
public static void main(String[] args) {
Application.launch(args);
}
#Override
public void start(Stage primaryStage) {
primaryStage.initStyle(StageStyle.UNDECORATED);
Group root = new Group();
Scene scene = new Scene(root, 100, 100);
primaryStage.setScene(scene);
primaryStage.show();
}
}
When learning JavaFX 2.0 these examples are very helpful.
primaryStage.setResizable(false);
primaryStage.initStyle(StageStyle.UTILITY);
I´m having the same issue, seems like an undecorated but draggable/titled window (for aesthetic sake) is not possible in javafx at this moment. The closest approach is to consume the close event.
stage.setOnCloseRequest(new EventHandler<WindowEvent>() {
#Override
public void handle(WindowEvent event) {
event.consume();
}
});
If you like lambdas
stage.setOnCloseRequest(e->e.consume());
stage.initModality(Modality.APPLICATION_MODAL);
stage.setResizable(false);
I found this answer here -->
http://javafxportal.blogspot.ie/2012/03/to-remove-javafx-stage-buttons-minimize.html
We can do it:
enter code here
#Override
public void start(Stage primaryStage) {
primaryStage.initStyle(StageStyle.UNDECORATED);
Group root = new Group();
Scene scene = new Scene(root, 100, 100);
primaryStage.setScene(scene);
primaryStage.show();
}
stage.initStyle(StageStyle.DECORATED);
stage.setResizable(false);
You can achieve this, you call the following methods on your stage object
stage.initModality(Modality.APPLICATION_MODAL); // makes stage act as a modal
stage.setMinWidth(250); // sets stage width
stage.setMinHeight(250); // sets stage height
stage.setResizable(false); // prevents resize and removes minimize and maximize buttons
stage.showAndWait(); // blocks execution until the stage is closed

Resources