I have a ListView with a custom ListCellFactory. In my CustomListCell implemenation I use setGraphic to set the list item graphic to a GridPane but I am not able not let the GridPane fill the whole width of the ListView. The following is a short version of my code:
class MyListCell extends ListCell<MyObject>
{
private final GridPane _myComponent;
public MyListCell()
{
...
setContentDisplay(ContentDisplay.GRAPHIC_ONLY); // does not help
//this.setPrefWidth(0); // does not help
myComponent.prefWidthProperty().bind(this.widthProperty()); // does not help
}
...
#Override
protected void updateItem(MyObject item, boolean empty)
{
...
setGraphic(_myComponent);
...
}
}
Even with the prefWidth bounding from another post my GridPane will not grow! No matter what combination of layout constraints I use it looks as follows:
Example View
The GridPane shall expand to the full width of the ListCell (I want to add a delete button at the buttom right corner). I'm getting crazy, please help!
With a little bit of css, you can check that the GridPane is actually using all the available space in the cell, but your controls are not:
public MyListCell(){
...
_myComponent.setStyle("-fx-border-color: black;");
}
So you need to select the column you want to take all the available space, and force it to use it.
Let's say you have one Label in the first cell, and one Button in the second, that should be aligned to the right. All you need to do is create a new ColumnConstraints for the second column of the grid, and set it to grow always and align the content to the right:
private final Label label = new Label();
private final Button button = new Button("Click");
public MyListCell(){
_myComponent.add(label, 0, 0);
ColumnConstraints c1 = new ColumnConstraints();
_myComponent.add(button, 1, 0);
ColumnConstraints c2 = new ColumnConstraints();
c2.setHgrow(Priority.ALWAYS);
GridPane.setHalignment(button, HPos.RIGHT);
_myComponent.getColumnConstraints().addAll(c1,c2);
}
And you will have your custom list cell:
Related
I am building an application using JavaFX. What I am trying to do is generate a message according to the user input values. So there are one text-field and one combo-box and one check-box per row and there are many rows like the following.
Let's say I will generate three different messages according to the user values. So I need to check whether those fields are empty or not and check each field's value to generate a specific message. Checking fields are okay for just three rows like the above. But I have 10 fields. So I have to check each and generate or append my own message. And also if the user checked the check-box need to group all checked row values. So what I am asking is there any good way (best practice) to achieve what I need or an easy one also? I have tried with HashMap and ArrayList. But those are not working for this.
Really appreciate it if anybody can help me. Thanks in advance.
I would probably recommend a custom node that you create on your own like below. This example is not supposed to have the same functionality as your application but just to show how to create and use custom nodes. I kept your idea in mind when creating this example it has your textfield combobox and checkbox and they are a little easier to manage. Give it a run and let me know if you have any questions
public class Main extends Application {
#Override
public void start(Stage stage) {
VBox vBox = new VBox();
vBox.setAlignment(Pos.CENTER);
ArrayList<String> itemList = new ArrayList<>(Arrays.asList("Dog", "Cat", "Turkey"));
ArrayList<HBoxRow> hBoxRowArrayList = new ArrayList<>();
for (int i = 0; i<3; i++) {
HBoxRow hBoxRow = new HBoxRow();
hBoxRow.setComboBoxValues(FXCollections.observableList(itemList));
hBoxRowArrayList.add(hBoxRow);
vBox.getChildren().add(hBoxRow.gethBox());
}
Button printTextfieldsButton = new Button("Print Textfields");
printTextfieldsButton.setOnAction(event -> {
for (HBoxRow hBoxRow : hBoxRowArrayList) {
System.out.println("hBoxRow.getTextFieldInput() = " + hBoxRow.getTextFieldInput());
}
});
vBox.getChildren().add(printTextfieldsButton);
stage.setScene(new Scene(vBox));
stage.show();
}
//Below is the custom Node
public class HBoxRow {
HBox hBox = new HBox();
ComboBox<String> comboBox = new ComboBox<>();
TextField textField = new TextField();
CheckBox checkBox = new CheckBox();
public HBoxRow(){
hBox.setAlignment(Pos.CENTER);
textField.setPrefWidth(150);
comboBox.setPrefWidth(150);
checkBox.setOnAction(event -> {
textField.setDisable(!textField.isDisabled());
comboBox.setDisable(!comboBox.isDisabled());
});
hBox.getChildren().addAll(checkBox, textField, comboBox);
}
public void setComboBoxValues(ObservableList observableList) {
comboBox.setItems(observableList);
}
public HBox gethBox(){
return hBox;
}
public String getTextFieldInput(){
return textField.getText();
}
}
}
I am trying to put multiple textfields in a circle in JavaFX. I could add a field in the centre using StackPane as explained in the below-mentioned post but unable to add multiple textfields. I tried using different panes for that but it didn't work.
Added the code that doesn't work.I want to add two text fields at any place inside a circle. Using gridpane for it didn't work. Moreover, I want to create x number of circle dynamically at any place in a gridpane and add multiple text fields to the circle, is it possible to do that using JavaFX?
Hope I am able to explain the problem statement correctly. Any response is appreciated :)
#Override
public void start(Stage arg0) throws Exception {
arg0.setTitle("Text Boxes In circle");
arg0.setMaxWidth(500);
Circle circle = createCircle(); // This function is to form a circle.
Text text = new Text("42");
Text text1 = new Text("36");
text.setBoundsType(TextBoundsType.VISUAL);
text1.setBoundsType(TextBoundsType.VISUAL);
GridPane box = new GridPane();
// box.setConstraints(text, 2, 0); commented this out to check if it was not
// causing problem but still didn't work
// box.setConstraints(text1, 2, 1);
// box.setAlignment(Pos.CENTER); Even used this to center the gridPane didn't
// work either.
StackPane stack = new StackPane();
box.getChildren().addAll(text, text1);
stack.getChildren().addAll(box, circle);
Scene scene = new Scene(stack);
arg0.setScene(scene);
arg0.show();
}
public static void main(String[] args) {
launch(args);
}
private static Circle createCircle() {
final Circle circle = new Circle(100);
circle.setStroke(Color.FORESTGREEN);
circle.setStrokeWidth(10);
circle.setStrokeType(StrokeType.INSIDE);
circle.setFill(Color.AZURE);
return circle;
}
how to put a text into a circle object to display it from circle's center?
I am trying to switch to javafx instead of swing but it has been a bit bumpy trying to find methods that do the exact tasks.
I am trying to get the buttons width to fill the entire scene and adjusts accordingly when you adjust the scene size.
Get a small empty border around text area and buttons.
Getting a method that reads a plain text file and replaces the current Text Area (not append).
package gui;
mport javafx.application.Application;
mport javafx.scene.Scene;
mport javafx.scene.control.Button;
mport javafx.stage.Stage;
mport javafx.scene.layout.*;
mport javafx.scene.control.TextArea;
public class Main extends Application{
#Override
public void start(Stage primaryStage) throws Exception {
primaryStage.setTitle("TextArea Experiment 1");
TextArea textArea = new TextArea();
// Which TextArea method would I call to set a plain
// text file into the text area ?
BorderPane border = new BorderPane();
border.setCenter(textArea);
//border.setBorder(new EmptyBorder(10,10,10,10));
// Is there a method like this in JavaFx ?
GridPane grid = new GridPane();
border.setBottom(grid);
double screensize = border.getMaxWidth();
Button option1 = new Button("Button 1");
Button option2 = new Button("Button 2");
Button option3 = new Button("Button 3");
// how can I get the buttons to be max scene size and
//adjust dynamically to scene dimensions ?
option1.setMaxSize(Double.MAX_VALUE,Double.MAX_VALUE);
//option1.setPrefWidth(Double.MAX_VALUE);
System.out.println(screensize);
grid.add(option1, 0,1);
grid.add(option2,0,2);
grid.add(option3,0,3);
Scene scene = new Scene(border, 200, 100);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
Application.launch(args);
}
}
first of all I suggest that to take a look at this tutorial: http://code.makery.ch/library/javafx-8-tutorial/
If you want to build a well structured javafx application you have to make an .fxml file, a Controller class and (some) model class(es).
But for those points here are the answers.
If you want to set a Region's size you have to use .setPrefSize(double,double) method, if you want to set dynamic you have to use for example myButton.prefSizeProperty().bind(anyRegionYouWantToBindTo.widthProprty())
I don't really understand what you want, I think you would like to use some styling, then you can write a .css file then arr it to textArea's styleClass.
After you get the text from the file instead of using textArea.appendText(String) you have to user textArea.setText(String)
I think these are the sollutions for your problems but I strongly recommend to read a tutorial about javafx. So have fun :)
Rewrite your question and only ask the question for this answer. You can then ask the other questions on their own thread.
GridPane grid = new GridPane();
grid.setMaxWidth(Double.MAX_VALUE);//Make sure the GridPane MaxWidth is set to MAX_VALUE. you can use grid.gridLinesVisibleProperty().set(true); to get an idea of the GRIDPANES current borders
border.setBottom(grid);
grid.gridLinesVisibleProperty().set(true);
Button option1 = new Button("Button 1");
option1.setMaxWidth(Double.MAX_VALUE);//Set button one MaxWidth to MAX_VALUE
Button option2 = new Button("Button 2");
option2.setMaxWidth(Double.MAX_VALUE);//Set button two MaxWidth to MAX_VALUE
Button option3 = new Button("Button 3");
option3.setMaxWidth(Double.MAX_VALUE);//Set button three MaxWidth to MAX_VALUE
//Add ColumnConstraints and set the width to 100%.
ColumnConstraints columnConstraint = new ColumnConstraints();
columnConstraint.setPercentWidth(100);
grid.getColumnConstraints().add(0, columnConstraint);
grid.add(option1, 0, 1);
grid.add(option2, 0, 2);
grid.add(option3, 0, 3);
For example, I use an imageview as the sub node of a vbox, when I change the size property(fitWidthProperty and fitHeightProperty), the size of box also changes. How can I stop this? There just do it like the code follows.But actually Vbox is the child of GridPane which I don't list it.
public int DEFAULT_WIDTH = 200;
//onAction means a click on button
public void onAction(){
changeDefaultWidth();
}
//initial another control ,just like pagination.
public void configureCellFactory(){
VBox box = new VBox();
ImageView imageView = new ImageView();
imageView.fitWidthProperty().bind(default_width);
box.getChildren().add(imageView);
}
Above, I have added a screen shot - now that I can add images. The bottom of the screen shot shows the edge of the scene (with no scrollbar on outer container 2).
This scene may become too busy - but I am attempting to use nested scroll panes which contain either a FlowPane or VBox. I am defining "inner containers" which is a VBox and includes a textfield and scroll pane which has a flow pane as it's content. The flow pane loads a number of "status blocks". The scroll pane for the inner containers seems to be working okay. Below is a code snippet from the inner container:
public class InnerContainer extends VBox
{
// Declare the various parts of the inner container
private TextField m_icName = null; // Name of the inner container
private ScrollPane m_icScroll = null;
private FlowPane m_icFlow = null; // Holds the status blocks
// List of status blocks in this inner container
private ArrayList<StatusBlock> m_statBlockList = null;
/******************************************************************
* Create the containers and controls used by the inner container *
******************************************************************/
public InnerContainer()
{
m_statBlockList = new ArrayList<>(); // Set up list of status blocks
setMinSize(200.0, 170.0);
setPrefSize(200, 170);
setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
setPadding(new Insets(5, 5, 5, 5));
m_icName = new TextField();
m_icName.setMaxWidth(Double.MAX_VALUE);
m_icScroll = new ScrollPane();
m_icScroll.setFitToWidth(true);
m_icScroll.setFitToHeight(true);
m_icScroll.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
VBox.setVgrow(m_icScroll, Priority.ALWAYS);
m_icFlow = new FlowPane();
m_icFlow.setPrefWrapLength(650.0); // This is the "wrap" point
m_icFlow.setVgap(5);
m_icFlow.setHgap(5);
m_icFlow.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
m_icScroll.setContent(m_icFlow);
// Add the elements to the vbox
getChildren().addAll(m_icName, m_icScroll);
VBox.setVgrow(this, Priority.ALWAYS);
I've been unable to get the scroll bars to work properly for the outer containers. If I add inner containers the outer container just keeps growing and I can never get the scroll bar to show up (even if it exceeds the size of the screen). I suspect I am having trouble correctly computing the size of the content of the outer container. The outer container is a VBox which contains a text field and a scrollpane which has content of a VBox. The final VBox can consist of one to many inner containers.
Here is a code snippet from the outer container:
public class OuterContainer extends VBox
{
// Declare the various parts of the outer container
private TextField m_ocName = null; // Name of the outer container
private ScrollPane m_ocScroll = null;
private VBox m_ocMainVBox = null;
private ArrayList<InnerContainer> m_innerContList = null;
public OuterContainer()
{
// Setup the inner container list
m_innerContList = new ArrayList<>();
setSpacing(8);
setPrefSize(USE_COMPUTED_SIZE, USE_COMPUTED_SIZE);
setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
setPadding(new Insets(5, 5, 5, 5));
m_ocName = new TextField();
m_ocName.setMaxWidth(Double.MAX_VALUE);
m_ocScroll = new ScrollPane();
m_ocScroll.setFitToWidth(true);
m_ocScroll.setFitToHeight(true);
m_ocScroll.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
VBox.setVgrow(m_ocScroll, Priority.ALWAYS);
m_ocMainVBox = new VBox();
m_ocMainVBox.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
VBox.setVgrow(m_ocMainVBox, Priority.ALWAYS);
m_ocMainVBox.setSpacing(5);
m_ocMainVBox.setMinSize(1.0, 1.0);
m_ocScroll.setContent(m_ocMainVBox);
// Add the elements to the top vbox
getChildren().addAll(m_ocName, m_ocScroll);
VBox.setVgrow(this, Priority.ALWAYS);
There is a final outer class which also should potentially have a scrollbar. It also isn't working correctly, but I suspect the issue is similar to what I am asking for help with here.
Thanks in advance for any help.
I've abandoned trying to use three scrollbars and will instead use a single scrollbar. However, I believe the root issue was addressed in:
Java FX scales the parent based on the content size
The size of the FlowPane or VBox used as the content of the ScrollPane keeps growing as the size of the content grows. This also causes the height of the scrollpane to grow. To resolve this, I am now basing the pref height of the scroll pane on the height of the stage. I've also added a change listener that looks for changes to the stage height property. It is similar to the following code snippet:
m_dashScroll.setPrefHeight(TopClass.getStage().getHeight() - DECORATION_OFFSET);
TopClass.getStage().heightProperty().addListener(new ChangeListener<Number>()
{
#Override
public void changed(ObservableValue<? extends Number> ov,
Number oldVal, Number newVal)
{
m_dashScroll.setPrefHeight(newVal.doubleValue() - DECORATION_OFFSET);
}
});
This required a static reference to the stage, so I would be interested if there are better ways to do this. [Also, I could use a lambda here if desired.]