JavaFX裁剪产生“彩票刮刮票”效果
问题描述:
我开始玩JavaFX
GraphicsContext
。 特别是剪辑部分对我来说很有趣。JavaFX裁剪产生“彩票刮刮票”效果
所以我试图创建一些图形和为它创建剪贴蒙版(一个简单的矩形,其左右移动)
,但我注意到它的一些奇怪的行为(不知道这是一个错误,或由于不正确代码使用)
下面你可以找到一个示例应用程序来显示该问题。
说明什么,我从我的代码预期: 白色帆布与洋红色矩形文本,这是品红上述唯一可见的(虽然它横跨绘制)
其实这正是你所看到的第一 !
当您移动应用程序窗口时,MAGENTA矩形移动(如预期)!但ANTIQUEWHITE填充变得可见(我从未预料过),任何曾经被MAGENTA覆盖过的区域现在都可见(无裁剪)
ANTIQUEWHITE和MAGENTA的东西,用来使它更明显地出现问题。因为整个画布在开始时被清除并且只有一个裁剪被完成,所以对于重新绘制(或在旧绘图上绘画)应该不是问题
启动应用程序并移动它以查看“彩票刮刮票”影响
public class ClippingExampleApp extends Application {
private boolean clip = true;
private static Bounds clippingArea = new BoundingBox(100, 50, 300, 300);
public static void main(String[] args) {
launch(args);
}
@Override
public void start(Stage primaryStage) {
primaryStage.setTitle("Clipping Test App");
primaryStage.setX(100);
primaryStage.setY(50);
Group root = new Group();
Canvas canvas = new Canvas(640, 480);
root.getChildren().add(canvas);
primaryStage.setScene(new Scene(root));
ChangeListener<Number> updateBounds = new ChangeListener<Number>() {
@Override
public void changed(ObservableValue<? extends Number> arg0, Number arg1, Number arg2) {
clippingArea = new BoundingBox(primaryStage.getX(), primaryStage.getY(), 300, 300);
draw(canvas, clip);
}
};
primaryStage.yProperty().addListener(updateBounds);
primaryStage.xProperty().addListener(updateBounds);
primaryStage.widthProperty().addListener(updateBounds);
primaryStage.heightProperty().addListener(updateBounds);
primaryStage.show();
clippingArea = new BoundingBox(primaryStage.getX(), primaryStage.getY(), 300, 300);
draw(canvas, clip);
}
private static void draw(Canvas canvas, boolean clip) {
GraphicsContext gc = canvas.getGraphicsContext2D();
// CLEAR THE COMPLETE CANVAS
gc.clearRect(0, 0, canvas.getWidth(), canvas.getHeight());
gc.save();
if (clip) {
// clipping rect
gc.rect(clippingArea.getMinX(), clippingArea.getMinY(), clippingArea.getWidth(), clippingArea.getHeight());
gc.clip();
// fill the whole background (this should only affect the clipped
// area
gc.setFill(Color.ANTIQUEWHITE);
gc.fillRect(0, 0, canvas.getWidth(), canvas.getHeight());
// this should overlap the Color.ANTIQUEWHITE - so no ANTIQUEWHITE is visible
gc.setFill(Color.MAGENTA);
gc.fillRect(clippingArea.getMinX(), clippingArea.getMinY(), clippingArea.getWidth(), clippingArea.getHeight());
// finally fill the text, which sould only be visible where the magenta rect is...
String text = "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.";
gc.setFill(Color.BLACK);
gc.fillText(text, 50, 100);
}
gc.restore();
}
}
答
注意,电流通路不会恢复。
所以所有的gc.rect()
调用你累积到一个单一的路径作为剪辑。
如果添加
gc.beginPath();
在if (clip)
块的开始清路,你看到的行为,我认为你期待。
+0
!实际上我认为在每次绘制之后路径都会被清除 - 并且不需要beginPath。 – lumo
你的问题是什么? – Sedrick
显然这个问题是如何解决这个奇怪的行为,并得到该地区削减,这是谢谢你的MAGENTA – lumo