Question

到目前为止，我所能找到的关于JavaFX剪辑的是d=''方法。这会强制节点仅在给定节点的边界内呈现。我想做的反过来 - 根据第二个节点的形状，特别是文本，删除节点的一部分。在（大多数）伪代码中：

Node.setClip(Node value)

这会导致（在白色背景上）......

另一个例子：

Answer 1

据我所知，目前没有内置方法。但是，这是一个使用Shapes尝试实现的示例：

package application;

import javafx.application.Application;
import javafx.beans.binding.Bindings;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.ProgressBar;
import javafx.scene.effect.InnerShadow;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.scene.shape.Rectangle;
import javafx.scene.shape.Shape;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;


public class Main extends Application {
    @Override
    public void start(final Stage primaryStage) {
        final StackPane root = new StackPane();
        final ProgressBar bar = new ProgressBar();
        final Image image = new Image( "https://farm8.staticflickr.com/7036/6952932649_3fc1cfeb8a_o_d.jpg", true );
        final ImageView imageView = new ImageView( image );
        final Text clip = new Text( "JavaFx" );
        final Scene scene = new Scene( root );

        root.setStyle( "-fx-background: pink;" );
        root.setEffect( new InnerShadow() );

        bar.prefWidthProperty().bind( root.widthProperty() );
        bar.visibleProperty().bind( Bindings.notEqual( 1, image.progressProperty() ) );
        bar.progressProperty().bind( image.progressProperty() );

        imageView.setFitWidth( 800 );
        imageView.setFitHeight( 600 );

        clip.setFont( Font.font( 144.0 ) );
    clip.setX( 400 - clip.getBoundsInLocal().getWidth() / 2 );
        clip.setY( 400 - clip.getBoundsInLocal().getHeight() / 2 );

        setInverseClip( imageView, clip );

        root.getChildren().add( bar );
        root.getChildren().add( imageView );

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

    private void setInverseClip( final Node node, final Shape clip ) {
        final Rectangle inverse = new Rectangle();
        inverse.setWidth( node.getLayoutBounds().getWidth() );
        inverse.setHeight( node.getLayoutBounds().getHeight() );
        node.setClip( Shape.subtract( inverse, clip ) );
    }

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

}

它使用相同大小的矩形覆盖目标节点，从中减去原始剪辑节点，并使用新创建的形状作为目标节点的剪辑。

Answer 2

这里是与常规Label一起使用的版本。只需将下面的侦听器添加到标签中，并确保Label文本是透明的，并且具有背景即可。

CSS：

.content-rating, .adult-rating {
  -fx-background-color: rgb(213, 222, 255);
  -fx-background-radius: 10px;
  -fx-text-fill: transparent;
}

Java代码：

InvalidationListener listener = (obs) -> {
  Text text = new Text();

  text.setFont(label.getFont());
  text.setText(label.getText());

  Bounds b = label.getLayoutBounds();
  Insets insets = label.getInsets();
  Region.layoutInArea(text, b.getMinX(), b.getMinY(), b.getWidth(), b.getHeight(), 0, insets, false, false, label.getAlignment().getHpos(), label.getAlignment().getVpos(), true);

  Rectangle r = new Rectangle(-insets.getLeft(), -insets.getTop(), b.getWidth() + insets.getRight(), b.getHeight() + insets.getBottom());

  label.setClip(Shape.subtract(r, text));
};

label.layoutBoundsProperty().addListener(listener);

它在JavaFX应用程序中的外观示例：

JavaFX使用文本进行反剪裁和裁剪？

2 个答案: