JavaFX blur effect and layoutX and layoutY - layout

I did a try with effect of the framework, but it has some weird behaviour when I blur a textfield into a Parent, the textfield is positioned at a different place, please take a look :
import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.scene.Scene;
import javafx.scene.control.CheckBox;
import javafx.scene.control.TextField;
import javafx.scene.effect.GaussianBlur;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class BlurTest extends Application {
CTextView subPane = new CTextView(100,100);
#Override
public void start(Stage stage) throws Exception {
VBox myBox = new VBox();
CheckBox chkBlur = new CheckBox("Show");
chkBlur.selectedProperty().addListener(new ChangeListener<Boolean>(){
#Override
public void changed(ObservableValue<? extends Boolean> v,
Boolean oldValue, Boolean newValue) {
if(oldValue)
subPane.getTxt().setEffect(new GaussianBlur());
else
subPane.getTxt().setEffect(null);
}
});
myBox.getChildren().addAll(new TextField("Not blur"), subPane, new TextField("Not blur"), chkBlur);
myBox.setPrefSize(250, 500);
Scene scene = new Scene(myBox);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}
And my custom textview :
import javafx.scene.Parent;
import javafx.scene.control.TextField;
public class CTextView extends Parent {
private TextField txt;
public CTextView(double w, double h) {
super();
this.txt = new TextField("Default");
this.txt.setLayoutX(20);
this.txt.setLayoutY(20);
this.getChildren().add(this.txt);
}
public TextField getTxt() {
return txt;
}
}
I don't understand why the textfield is repositioned in the Parent after blur effect.. :/
Thanks for your help

> Why is the textfield repositioned?
The GaussianBlur's default radius value is 10. When this effect applied to the node, that node's local bounds expands extra these blurring radii, but the node's width and height remains the same. The Parent does not apply CSS style and does not layout its children, however as seen in your example, it takes into account the local bounds and repositioned the node.
> Why do the textfield's setLayoutX and setLayoutY not worked?
The Parent does consider the local bounds of its child but it does not layout them according the child's layout values. Use a Region (or its subclasses) which takes care its children layout values.
public class CTextView extends Region {
private TextField txt;
public CTextView(double w, double h) {
super();
this.txt = new TextField("Default");
this.txt.setLayoutX(20);
this.txt.setLayoutY(20);
this.getChildren().add(this.txt);
}
public TextField getTxt() {
return txt;
}
}

Related

new View.OnClickListener () greyed out ->" No Adapter Attached, skipping Layout" error message

I copied code for a recycler View from a Youtube tutorial but it won't work out for me. The new View.OnClickListener() is greyed out, with Android Studio suggesting to replace out with lambda. This is the only difference from my code to the one from the tutorial... The App runs through, but doesn't show the Layout, as I get the error message E/RecyclerView: No adapter attached; skipping layout.
what can I do to fix this?
This is the Adapter class:
package com.example.yourfoodweek;
import android.content.Context;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import androidx.annotation.NonNull;
import androidx.cardview.widget.CardView;
import androidx.recyclerview.widget.RecyclerView;
import com.bumptech.glide.Glide;
import java.util.ArrayList;
public class MealsRecViewAdapter extends RecyclerView.Adapter<MealsRecViewAdapter.ViewHolder>{
private static final String TAG = "MealsRecViewAdapter";
private ArrayList <Food> meals = new ArrayList<>();
private Context mContext;
public MealsRecViewAdapter(Context mContext) {
this.mContext = mContext;
}
#NonNull
#Override
public ViewHolder onCreateViewHolder(#NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_meals_list, parent, false);
return new ViewHolder(view);
}
#Override
public void onBindViewHolder(#NonNull ViewHolder holder, int position) {
Log.d(TAG, "onBindViewHolder: Called");
holder.txtName.setText(meals.get(position).getName());
Glide.with(mContext)
.asBitmap()
.load(meals.get(position).getImageUrl())
.into(holder.imgFood);
holder.parent.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick (View v){
Toast.makeText(mContext, meals.get(position).getName() + "Selected", Toast.LENGTH_SHORT).show();
}
});
}
#Override
public int getItemCount() {
return meals.size();
}
public void setMeals(ArrayList<Food> meals) {
this.meals = meals;
notifyDataSetChanged();
}
public class ViewHolder extends RecyclerView.ViewHolder{
private CardView parent;
private ImageView imgFood;
private TextView txtName;
public ViewHolder(#NonNull View itemView){
super(itemView);
parent = itemView.findViewById(R.id.parent);
txtName = itemView.findViewById(R.id.txtMealName);
imgFood = itemView.findViewById(R.id.imgFood);
}
}
}
both problems are totally different. first one was suggestion means if you don't want to apply you can skip it. but i will not suggest to do that.
for example:
(without Lambda)
myButton.setOnClickListener(new View.OnClickListerner(){
#Override
void onClick(View v) {
// do some stuff related to action
}
});
(with Lambda)
myButton.setOnClickListener(v -> {
// do some stuff related to action
})
for other question
no layout manager attached:
if your RecyclerView doesn't have any LayoutManager attached to it then it will skip cause it will not know how to arrange/show items.
Some LayoutManagers:
LinearLayoutManager
GridLayoutManager
StaggeredGridLayoutManager
if you want to create your own LayoutManager you can do it by just extending class LayoutManager
how to use it:
....
LinearLayoutManager layoutManager = new LinearLayoutManager();
layoutManager.setOrientation = LinearLayoutManager.HORIZONTAL
myRecyclerViewObj.setLayoutManager(layoutManager);
....
no adapter attached
similar to no layout manager this will be shown when no adapter attached to recycler view for this you have to use setAdapter method to set your adapater
for example:
....
MealsRecViewAdapter adapter = new MealsRecViewAdapter(this);
myRecyclerViewObj.setAdapter(adapter);
....

JavaFX - How to resize a SVG Path right in a TableView

I'm having issues to render a SVG Image in a TableView with a CellFactory.
Im using this code here, but it don't work, the svg image is scaled, but it don't resize.
import javafx.application.Application;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.HBox;
import javafx.scene.shape.SVGPath;
import javafx.scene.shape.Shape;
import javafx.stage.Stage;
public class SVGTable extends Application {
private ObservableList<SVGExample> examples;
public static void main(String[] args) {
launch(args);
}
public SVGTable() {
examples = FXCollections.observableArrayList();
examples.addAll(new SVGExample(289),
new SVGExample(42),
new SVGExample(120));
}
#Override
public void start(Stage primaryStage) throws Exception {
AnchorPane pane = new AnchorPane();
Scene scene = new Scene(pane);
TableView<SVGExample> tableView = new TableView<>();
tableView.setMinWidth(500);
tableView.setMinHeight(400);
tableView.setItems(examples);
final TableColumn<SVGExample, Integer> ping = new TableColumn<>("Ping");
ping.setCellValueFactory(new PropertyValueFactory<>("ping"));
ping.setCellFactory(param -> new PingCell());
tableView.getColumns().add(ping);
pane.getChildren().add(tableView);
primaryStage.setScene(scene);
primaryStage.show();
}
public class SVGExample {
private final IntegerProperty ping = new SimpleIntegerProperty();
public SVGExample(int ping) {
setPing(ping);
}
public int getPing() {
return ping.get();
}
public IntegerProperty pingProperty() {
return ping;
}
public void setPing(int ping) {
this.ping.set(ping);
}
}
public class PingCell extends TableCell<SVGExample, Integer> {
private HBox hBox = new HBox();
private Label label;
private int oldValue;
private PingCell() {
label = new Label();
hBox.setAlignment(Pos.CENTER_LEFT);
oldValue = Integer.MIN_VALUE;
}
#Override
protected void updateItem(final Integer item, final boolean empty) {
if (item != null) {
label.setText(item + "ms");
int i = (item + 50) / 100;
if (i < 1)
i = 1;
if (4 < i)
i = 4;
if (i != oldValue) {
SVGPath svgPath1 = new SVGPath();
svgPath1.setContent("M149.2,8.3L127-13.9c42.4-42.4,98.7-65.8,158.5-65.8c59.8,0,116.1,23.4,158.5,65.8L421.8,8.3c-36.5-36.5-84.9-56.6-136.3-56.6C234.1-48.2,185.7-28.1,149.2,8.3z");
SVGPath svgPath2 = new SVGPath();
svgPath2.setContent("M190.9,50.1l-22.2-22.2C200-3.4,241.4-20.6,285.5-20.6c44.1,0,85.5,17.2,116.8,48.4l-22.2,22.2c-25.3-25.3-58.9-39.2-94.6-39.2C249.8,10.8,216.2,24.8,190.9,50.1z");
SVGPath svgPath3 = new SVGPath();
svgPath3.setContent("M232.7,91.8l-22.2-22.2c20.1-20.1,46.7-31.1,75-31.1s55,11.1,75,31.1l-22.2,22.2c-14.1-14.1-32.9-21.9-52.8-21.9C265.6,69.9,246.8,77.7,232.7,91.8z");
SVGPath svgPath4 = new SVGPath();
svgPath4.setContent("M285.5,98.1c-12.8,0-24.5,5.2-32.9,13.6l32.9,32.9l32.9-32.9C310,103.3,298.3,98.1,285.5,98.1z");
Shape s = SVGPath.union(SVGPath.union(SVGPath.union(svgPath1, svgPath2), svgPath3), svgPath4);
s.setScaleX(0.1);
s.setScaleY(0.1);
hBox.getChildren().clear();
hBox.getChildren().addAll(s, label);
}
setGraphic(hBox);
}
}
}
}
After run, it's look like this:
You can wrap the Shape in a Group to force re-size of layout bounds.
hBox.getChildren().addAll(new Group(s), label);
Scale is a type of transform and according to Javadocs:
Any transform, effect, or state applied to a Group will be applied to all children of that group. Such transforms and effects will NOT be included in this Group's layout bounds, however if transforms and effects are set directly on children of this Group, those will be included in this Group's layout bounds.

Drawing a border around a JavaFX Text node

I want to draw red borders around arbitrary javafx.scene.text.Text nodes in my JavaFX scenegraph, for example those in a Button object.
It is easy to retrieve all the Text nodes but not to find where they are in the scene, they have an x and y property which doesn't seem to get set properly but they do not have a width and height.
So far I have tried to add rectangles with a red stroke to a stack pane but the x and y are always wrong and I can't get the size.
One solution is to wrap the text nodes in layout pane (such as an HBox) and use CSS on the layout pane:
import javafx.application.Application;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.layout.HBox;
import javafx.scene.text.Text;
import javafx.stage.Stage;
public class TextBorderExample extends Application {
#Override
public void start(Stage primaryStage) {
final HBox root = new HBox(5);
root.getChildren().addAll(
new Text("This"), new Text("Is"), new Text("A"), createBorderedText("Red"), new Text("Bordered"), new Text("Text")
);
primaryStage.setScene(new Scene(root));
primaryStage.show();
}
private Node createBorderedText(String text) {
final HBox hbox = new HBox();
hbox.getChildren().add(new Text(text));
hbox.setStyle("-fx-border-color: red;");
return hbox ;
}
public static void main(String[] args) {
launch(args);
}
}
Another way is to use a Rectangle, as follows:
import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Bounds;
import javafx.scene.Scene;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Text;
import javafx.stage.Stage;
public class TextBorderExample extends Application {
#Override
public void start(Stage primaryStage) {
final HBox root = new HBox(5);
final Text red = new Text("Red");
final Rectangle redBorder = new Rectangle(0, 0, Color.TRANSPARENT);
redBorder.setStroke(Color.RED);
redBorder.setManaged(false);
red.boundsInParentProperty().addListener(new ChangeListener<Bounds>() {
#Override
public void changed(ObservableValue<? extends Bounds> observable,
Bounds oldValue, Bounds newValue) {
redBorder.setLayoutX(red.getBoundsInParent().getMinX());
redBorder.setLayoutY(red.getBoundsInParent().getMinY());
redBorder.setWidth(red.getBoundsInParent().getWidth());
redBorder.setHeight(red.getBoundsInParent().getHeight());
}
});
root.getChildren().addAll(new Text("This"), new Text("Is"), new Text("A"), red, new Text("Bordered"), new Text("Text"));
root.getChildren().add(redBorder);
primaryStage.setScene(new Scene(root));
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}

javafx html editor

actually i'm looking for something very similar to this thread:
How to hide the controls of HTMLEditor?
so basically i try to add a custom button to the javafx html editor but with the difference that it's implemented through FXML.
So my question is:
Is there a "work-around" to add custom buttons to the html-editor when it's implemented through FXML?
Sample solution is :
htmlEditor.setVisible(false);
Platform.runLater(new Runnable() {
#Override
public void run() {
Node[] nodes = htmlEditor.lookupAll(".tool-bar").toArray(new Node[0]);
for (Node node : nodes) {
node.setVisible(false);
node.setManaged(false);
}
htmlEditor.setVisible(true);
}
});
I have modified the #jewelsea answer for javaFX9.
I have also added some customization to move toolbars. The main idea is to get all the components by css selector, then modify or hide them. Read the class HTMLEditorSkin to get the CSS classes names, like ".html-editor-align-center" for the align button.
import java.util.Iterator;
import java.util.List;
import java.util.Set;
import java.util.concurrent.atomic.AtomicBoolean;
import java.util.regex.Pattern;
import javafx.application.Application;
import javafx.application.Platform;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Node;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.ComboBox;
import javafx.scene.control.MenuButton;
import javafx.scene.control.MenuItem;
import javafx.scene.control.RadioMenuItem;
import javafx.scene.control.ToolBar;
import javafx.scene.effect.DropShadow;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.GridPane;
import javafx.scene.web.HTMLEditor;
import javafx.stage.Stage;
public class HTMLEditorCustomizationSample2 extends Application {
// limits the fonts a user can select from in the html editor.
private static final ObservableList<String> limitedFonts = FXCollections.observableArrayList("Arial",
"Times New Roman", "Courier New", "Comic Sans MS");
private HTMLEditor htmlEditor;
public static void main(String[] args) {
launch(args);
}
#SuppressWarnings("unchecked")
#Override
public void start(Stage stage) {
htmlEditor = new HTMLEditor();
stage.setScene(new Scene(htmlEditor));
stage.show();
customizeEditor(htmlEditor);
}
private void customizeEditor(HTMLEditor htmlEditor) {
// hide controls we don't need.
Node seperator = htmlEditor.lookup(".separator");
seperator.setVisible(false);
seperator.setManaged(false);
hideByClass(htmlEditor, ".separator");
hideByClass(htmlEditor, ".html-editor-cut", ".html-editor-copy", ".html-editor-paste", ".html-editor-strike",
".html-editor-hr");
hideByClass(htmlEditor, ".html-editor-align-left"
, ".html-editor-align-center"
, ".html-editor-align-right"
, ".html-editor-align-justify", ".html-editor-outdent"
, ".html-editor-indent", ".html-editor-bullets"
, ".html-editor-numbers");
// Move the toolbars
Node top= htmlEditor.lookup(".top-toolbar");
GridPane.setConstraints(top,1,0,1,1);
Node bottom= htmlEditor.lookup(".bottom-toolbar");
GridPane.setConstraints(bottom,0,0,1,1);
Node web= htmlEditor.lookup("WebView");
GridPane.setConstraints(web,0,1,2,1);
// modify font selections.
int i = 0;
Set<Node> fonts = htmlEditor.lookupAll(".font-menu-button");
Iterator<Node> fontsIterator = fonts.iterator();
fontsIterator.next();
ComboBox<String> formatComboBox = (ComboBox<String>) fontsIterator.next();
formatComboBox.itemsProperty().addListener((obs, old, value) -> {
if (value.size() != limitedFonts.size()) {// should loop on array for equality
Platform.runLater(() -> {
value.clear();
// stop.set(true);
value.addAll(limitedFonts);
formatComboBox.setValue(limitedFonts.get(0));
});
}
});
// add a custom button to the top toolbar.
Node node = htmlEditor.lookup(".top-toolbar");
if (node instanceof ToolBar) {
ToolBar bar = (ToolBar) node;
ImageView graphic = new ImageView(
new Image("http://bluebuddies.com/gallery/title/jpg/Smurf_Fun_100x100.jpg", 16 , 16, true, true));
graphic.setEffect(new DropShadow());
Button smurfButton = new Button("", graphic);
bar.getItems().add(smurfButton);
smurfButton.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent arg0) {
htmlEditor.setHtmlText("<font face='Comic Sans MS' color='blue'>Smurfs are having fun :-)</font>");
}
});
}
}
private void hideByClass(HTMLEditor htmlEditor, String... selectors) {
for (String selector : selectors) {
Set<Node> nodes = htmlEditor.lookupAll(selector);
for (Node node : nodes) {
node.setVisible(false);
node.setManaged(false);
}
}
}
#Override
public void stop() throws Exception {
super.stop();
System.out.println(htmlEditor.getHtmlText());
}
}
Here is some sample code which customizes the HTMLEditor and adds a custom button to it. The sample code does not use fxml but really it's very similar if fxml is used. You could define the HTMLEditor in fxml and inject it into your Controller using the standard #FXML annotation. Once you have a reference to the editor, customize it in Java code using an appropriate variation of the sample code. For the added button, just create it in Java rather than fxml and it will be simpler.

How to make an undecorated window movable / draggable in JavaFX?

I have to create an application in which minimize and maximize button will be disabled.
I have used "StageStyle.UNDECORATED" with which the application will not be movable or draggable anymore, so I am searching for any other alternative to make my application.
Do anyone having solution for this?
To achieve the window to be undecorated but still movable/dragable you have to handle the appropriate MouseEvent on any node of your choice.
Example:
import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
public class SimpleWindowApplication extends Application {
private double xOffset = 0;
private double yOffset = 0;
public static void main(String[] args) {
launch(args);
}
#Override
public void start(final Stage primaryStage) {
primaryStage.initStyle(StageStyle.UNDECORATED);
BorderPane root = new BorderPane();
root.setOnMousePressed(new EventHandler<MouseEvent>() {
#Override
public void handle(MouseEvent event) {
xOffset = event.getSceneX();
yOffset = event.getSceneY();
}
});
root.setOnMouseDragged(new EventHandler<MouseEvent>() {
#Override
public void handle(MouseEvent event) {
primaryStage.setX(event.getScreenX() - xOffset);
primaryStage.setY(event.getScreenY() - yOffset);
}
});
Scene scene = new Scene(root, 800, 600);
primaryStage.setScene(scene);
primaryStage.show();
}
}
Learn more from the very valuable examples contained on Oracle's JavaFX download page under: JavaFX Demos and Samples
Sole purpose of this class is to allow undecorated Window to be dragged. It also performs the duty to ensure TaskBar remains visible with FullScreen, and ensure undecorated window not dragged out of screen.
Lastly its provides a bug fix to the error "css resource not found."
Simply paste below code in the main class in the overridden start() method just about when the Stage is ABOUT READY to be shown or after.
WindowStyle.allowDrag(root, stage);
WindowStyle.stageDimension(stage.getWidth(), stage.getHeight());
NOTE: Paste the above when the Stage is ABOUT READY to be shown or after.
For full screen window use:
WindowStyle.fullScreen(Stage stage);
To resize back to previous use:
WindowStyle.restoreScreen(Stage stage);
To add custom stylesheets to your scene, Simply paste below code in the main class in the overridden start() method after defining your scene.
scene.getStylesheets().add(WindowStyle.addStyleSheet(String css));
The name of css to be used for styling can be in the form of: main.css or styles/main.css
import javafx.geometry.Rectangle2D;
import javafx.scene.Parent;
import javafx.scene.input.MouseEvent;
import javafx.stage.Screen;
import javafx.stage.Stage;
/**
* #author: BENJAH
*/
public class WindowStyle {
private static final Rectangle2D SCREEN_BOUNDS= Screen.getPrimary()
.getVisualBounds();
private static double[] pref_WH, offset_XY;
private static String styleSheet;
private WindowStyle(String css) {
styleSheet= getClass().getResource(css).toString();
}
protected static void allowDrag(Parent root, Stage stage) {
root.setOnMousePressed((MouseEvent p) -> {
offset_XY= new double[]{p.getSceneX(), p.getSceneY()};
});
root.setOnMouseDragged((MouseEvent d) -> {
//Ensures the stage is not dragged past the taskbar
if (d.getScreenY()<(SCREEN_BOUNDS.getMaxY()-20))
stage.setY(d.getScreenY() - offset_XY[1]);
stage.setX(d.getScreenX() - offset_XY[0]);
});
root.setOnMouseReleased((MouseEvent r)-> {
//Ensures the stage is not dragged past top of screen
if (stage.getY()<0.0) stage.setY(0.0);
});
}
//Sets the default stage prefered width and height.
protected static void stageDimension(Double width, Double height) {
pref_WH= new double[]{width, height};
}
protected static void fullScreen(Stage stage) {
stage.setX(SCREEN_BOUNDS.getMinX());
stage.setY(SCREEN_BOUNDS.getMinY());
stage.setWidth(SCREEN_BOUNDS.getWidth());
stage.setHeight(SCREEN_BOUNDS.getHeight());
}
protected static void restoreScreen(Stage stage) {
stage.setX((SCREEN_BOUNDS.getMaxX() - pref_WH[0])/2);
stage.setY((SCREEN_BOUNDS.getMaxY() - pref_WH[1])/2);
stage.setWidth(pref_WH[0]);
stage.setHeight(pref_WH[1]);
}
protected static String addStyleSheet(String css) {
new WindowStyle(css);
return styleSheet;
}
}

Resources