【发布时间】:2019-04-01 18:14:22
【问题描述】:
在显示图像视图的可调整大小的窗格中,我想选择多个矩形。
为此,我创建了一个类 SelectableImageViewPane。 ImageViewPane 和 RubberBandSelection 这两个类来自我是提交者的 com.bitplan.javafx 项目。
当调整窗口大小时,相关窗格的大小会很好地调整,正如您从 e.g. 生成的调试输出中看到的那样。 SelectableImageViewPaneDemo 和以下示例截图。不幸的是,选择矩形没有调整大小/重新定位。
我如何确保子矩形相对于周围的玻璃窗格调整大小/重新定位并与 ImageViewPane/ImageView 同步?
package com.bitplan.javafx;
import java.util.logging.Level;
import java.util.logging.Logger;
import javafx.geometry.Bounds;
import javafx.geometry.Pos;
import javafx.scene.Node;
import javafx.scene.image.ImageView;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
/**
* an ImageViewPane with a RubberBandSelection that properly resizes the rectangles
* @author wf
*
*/
public class SelectableImageViewPane extends StackPane {
protected static Logger LOGGER = Logger.getLogger("com.bitplan.javafx");
public static boolean debug=true;
private RubberBandSelection selection;
private ImageViewPane imageViewPane;
private Pane glassPane;
/**
* get my selection
* @return
*/
public RubberBandSelection getSelection() {
return selection;
}
/**
* show the bound of the given node with the given title
* @param title
* @param n
*/
public void showBounds(String title,Node n) {
if (debug) {
Bounds b = n.getLayoutBounds();
LOGGER.log(Level.INFO,String.format("%s: min %.0f,%.0f max %.0f,%.0f",title,b.getMinX(),b.getMinY(),b.getMaxX(),b.getMaxY()));
}
}
@Override
protected void layoutChildren() {
super.layoutChildren();
int index=1;
if (debug) {
showBounds("pane",this);
showBounds("imageViewPane",imageViewPane);
showBounds("glassPane",glassPane);
showBounds("imageView",imageViewPane.imageViewProperty().get());
}
for (Node n:selection.selected) {
showBounds(""+(index++),n);
}
}
/**
* create me
* @param imageView
*/
public SelectableImageViewPane(ImageView imageView) {
imageViewPane=new ImageViewPane(imageView);
getChildren().add(imageViewPane);
StackPane.setAlignment(imageViewPane, Pos.CENTER);
glassPane = new AnchorPane();
glassPane.setStyle("-fx-background-color: rgba(0, 0, 0, 0.1);");
getChildren().add(glassPane);
//glassPane.prefWidthProperty().bind(imageViewPane.widthProperty());
//glassPane.prefHeightProperty().bind(imageViewPane.heightProperty());
selection = new RubberBandSelection(glassPane);
selection.setSelectButton(true);
}
}
更新 同时I modified RubberBandSelection 记住父级中矩形的相对边界(以后在我的应用程序中使用矩形时我将需要它)。如果父级的尺寸发生变化,此信息可用于在父级中正确布局矩形。
Bounds rB = s.relativeBounds;
double w = getWidth();
double h=getHeight();
double minX=rB.getMinX()*w;
double minY=rB.getMinY()*h;
double width=rB.getWidth()*w;
double height=rB.getHeight()*h;
layoutInArea(s.node, minX,minY,width,height, 0, HPos.LEFT,
VPos.TOP);
该解决方案效果更好,但仍有一些问题可能涉及父级内的 x/y 偏移。
更新了 SelectableImageViewPane
package com.bitplan.javafx;
import java.util.logging.Level;
import java.util.logging.Logger;
import com.bitplan.javafx.RubberBandSelection.Selection;
import javafx.geometry.Bounds;
import javafx.geometry.HPos;
import javafx.geometry.Pos;
import javafx.geometry.VPos;
import javafx.scene.Node;
import javafx.scene.image.ImageView;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
/**
* an ImageViewPane with a RubberBandSelection that properly resizes the
* rectangles
*
* @author wf
*
*/
public class SelectableImageViewPane extends StackPane {
protected static Logger LOGGER = Logger.getLogger("com.bitplan.javafx");
public static boolean debug = true;
private RubberBandSelection selection;
private ImageViewPane imageViewPane;
private Pane glassPane;
/**
* get my selection
*
* @return
*/
public RubberBandSelection getSelection() {
return selection;
}
/**
* show the bound of the given node with the given title
*
* @param title
* @param n
*/
public void showBounds(String title, Node n) {
if (debug) {
Bounds b = n.getLayoutBounds();
LOGGER.log(Level.INFO, String.format("%s: min %.0f,%.0f max %.0f,%.0f", title, b.getMinX(), b.getMinY(),
b.getMaxX(), b.getMaxY()));
}
}
@Override
protected void layoutChildren() {
super.layoutChildren();
int index = 1;
if (debug) {
showBounds("pane", this);
showBounds("imageViewPane", imageViewPane);
showBounds("glassPane", glassPane);
showBounds("imageView", imageViewPane.imageViewProperty().get());
}
for (Selection s : selection.selected.values()) {
if (debug) {
showBounds("" + (index++), s.node);
LOGGER.log(Level.INFO, s.asPercent());
}
Bounds rB = s.relativeBounds;
double w = getWidth();
double h=getHeight();
double minX=rB.getMinX()*w;
double minY=rB.getMinY()*h;
double width=rB.getWidth()*w;
double height=rB.getHeight()*h;
layoutInArea(s.node, minX,minY,width,height, 0, HPos.LEFT,
VPos.TOP);
}
}
/**
* create me
*
* @param imageView
*/
public SelectableImageViewPane(ImageView imageView) {
imageViewPane = new ImageViewPane(imageView);
getChildren().add(imageViewPane);
StackPane.setAlignment(imageViewPane, Pos.CENTER);
glassPane = new AnchorPane();
glassPane.setStyle("-fx-background-color: rgba(0, 0, 0, 0.1);");
getChildren().add(glassPane);
// glassPane.prefWidthProperty().bind(imageViewPane.widthProperty());
// glassPane.prefHeightProperty().bind(imageViewPane.heightProperty());
selection = new RubberBandSelection(glassPane);
selection.setSelectButton(true);
}
}
【问题讨论】:
-
基本上,您需要“锚定”图像上的矩形(f.i.前上角),然后将锚点与图像一起转换并将调整大小的矩形移动到转换后的锚点(不能显然,尝试一下,因为您没有提供minimal reproducible example ;)
-
@kleopatra - 感谢您对此进行调查。目前我正在研究一种方法,它可以记住父级中的相对位置并将其用于布局。
标签: java javafx resize autoresize