如何限制项目的可见性？

Question

假设我们有一个AnchorPane，它有一个子Pane，我们有Button。
我希望这个Button 只显示在这个Pane 中。
换句话说，如果它不完全在Pane 内，它应该被Pane 边缘切割。现在Button 可以在Pane 矩形之外可见。

Answer 1

这就是节点的clip 的用途。

例子：

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;


public class ClipTest extends Application {

  public static void main(String[] args) {
    launch(args);
  }

  @Override
  public void start(Stage primaryStage) throws Exception {

    Group root = new Group();

    StackPane pane = new StackPane();

    pane.setMaxWidth(100);
    pane.setMaxHeight(100);
    pane.setLayoutX(50);
    pane.setLayoutY(50);


    Rectangle rect = new Rectangle(100, 100);

    rect.setFill(null);
    rect.setStroke(Color.RED);

    Rectangle rect2 = new Rectangle(150, 150);

    rect2.setFill(Color.BLUE);

    pane.getChildren().addAll(rect2, rect);

    root.getChildren().add(pane);


//    Rectangle clip = new Rectangle(100, 100);
//    clip.setLayoutX(25);
//    clip.setLayoutY(25);
//    pane.setClip(clip);

    Scene scene = new Scene(root, 250, 250);

    primaryStage.setScene(scene);
    primaryStage.show();
  }
}

这会产生：

取消注释有关剪辑的行会产生：

Answer 2

您可以使用clipping 功能来实现此目的。

public class ClipPane extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Pane clipPane = new Pane();
        clipPane.setStyle("-fx-border-color: red;");
        clipPane.setPrefSize(200, 200);

        Rectangle rect = new Rectangle(200, 200);
        clipPane.setClip(rect);

        Button btn = new Button("Hello, world!");
        btn.relocate(120, 0);
        clipPane.getChildren().add(btn);

        AnchorPane root = new AnchorPane();
        root.getChildren().add(clipPane);
        AnchorPane.setTopAnchor(clipPane, 50.);
        AnchorPane.setLeftAnchor(clipPane, 50.);

        stage.setScene(new Scene(root, 300, 300));
        stage.show();
    }

    public static void main(String[] args) { launch(); }
}

Answer 3

另一种方法，使用可观察对象。裁剪窗格边界外的项目（如 css oveflow:hidden）：

// create rectangle with sizes of pane, 
// dont need to set x and y explictly 
// as positions of clip node are relative to parent node 
// (to pane in our case)
Rectangle clipRect = new Rectangle(pane.getWidth(), pane.getHeight());

// bind properties so height and width of rect 
// changes according pane's width and height
clipRect.heightProperty().bind(pane.heightProperty());
clipRect.widthProperty().bind(pane.widthProperty());

// set rect as clip rect
pane.setClip(clipRect);