css – “-fx-shape”与“-fx-background-image”兼容吗？

.myTextureShape {
-fx-shape: "M0 0 L0 50 L25 25 L50 50 L50 0 Z";
-fx-BACkground-image: url("resources/texture_bg.png");
-fx-BACkground-repeat: repeat;
}

.myTextureShape {
 -fx-shape: "M0 0 L0 50 L25 25 L50 50 L50 0 Z";
 -fx-BACkground-color: red;
}

就我而言-fx-shape和-fx-BACkground-image不能一起工作.
JavaFX CSS提供了许多样式选项……但是有一些限制,有些东西只能通过编程实现. JavaFX CSS使用impl_setShape()将Region类粗略定义为已定义的形状(在api中市场已弃用,但您仍然可以在javafx 2.2中尝试它 – 我目前正在使用它).添加背景图像会忽略形状并填充整个窗格/区域,如果使用addChildren将ImageView对象添加到其中,也会发生相同的情况.所以 – css字符串不会转换为您想要的结果.

@R_441_9447@想到至少2种将模式应用于自定义SVGPath形状的方法.
我将使用的是使用ImagePattern完成的.首先建立这样的形状

SVGPath shape = new SVGPath();
shape.setContent("M0 0 L0 50 L25 25 L50 50 L50 0 Z");

或使用形状构建器

SVGPath shape = SVGPathBuilder.create()
    .content("M0 0 L0 50 L25 25 L50 50 L50 0 Z")
    .build();

然后将图像模式设置为填充

Image img = new Image("myjavafxapp/resources/texture_bg.png");
shape.setFill(new ImagePattern(img,10,falsE));

另一种方法是使用裁剪(将自定义形状剪辑添加到窗格中,并在css样式中设置-fx-BACkground-imagE),这看起来有点像这样

Pane test = new Pane(); 
test.setStyle(" -fx-BACkground-image: url(\"myjavafxapp/res/index.jpeg\");");
SVGPath shape = new SVGPath();
shape.setContent("M0 0 L0 50 L25 25 L50 50 L50 0 Z");
test.setClip(shapE);

其中一个应该做的伎俩 – 你的纹理背景你的形状.这相当于您对具有样式的Region或Pane类的期望

.myTextureShape {
    -fx-shape: "M0 0 L0 50 L25 25 L50 50 L50 0 Z";
    -fx-scale-shape: false;
    -fx-BACkground-image: url("myjavafxapp/resources/texture_bg.png");
    -fx-BACkground-repeat: repeat; 
}

因此,SVGPath形状就像所有不可调整的Shape类一样,与Region / Pane相比,这就是我将-fx-scale-shape属性设置为false的原因.您使用它的方式是使用默认设置 – 将其设置为true – 这使得形状填充整个父对象…我猜这也是您想要的结果. …现在又有多种方法可以将形状缩放到父对象.

我使用Group来嵌入形状并使用方法转换组(图像大小需要在ImagePattern中调整,以便纹理不随形状缩放).我正在添加一个微小的工作应用程序,如果我记得所有内容,我在上面的示例中看到了这个应用程序. (如果您希望形状按比例缩放,则在addScale方法中使用相同的比例因子而不是scalex和sclaey)

package myjavafxapp;

    import javafx.application.Application;
    import javafx.application.Platform;
    import javafx.beans.value.ChangeListener;
    import javafx.beans.value.observableValue;
    import javafx.scene.Group;
    import javafx.scene.Node;
    import javafx.scene.Scene;
    import javafx.scene.layout.Pane;
    import javafx.scene.layout.StackPane;
    import javafx.scene.shape.SVGPath;
    import javafx.scene.shape.SVGPathBuilder;
    import javafx.scene.image.Image;
    import javafx.scene.paint.*;
    import javafx.scene.transform.Scale;
    import javafx.scene.transform.Translate;
    import javafx.stage.Stage;
    /**
     * @author marTint
     */
    public class MyJavaFXApp extends Application {

            private final static String svg = "M0 0 L0 50 L25 25 L50 50 L50 0 Z";
            private SVGPath shape;
            private Image img;
            private Pane resizePane;
            private Group shapeGroup;
            private Node content;

        @Override
        public void start(final Stage priMaryStagE) {

            //build the SVGPath shape
            shape = SVGPathBuilder.create().content(svg).build();
            img = new Image("myjavafxapp/res/index.jpeg");
            resizePane = new Pane();
            shapeGroup = new Group();
            resizePane.getChildren().add(shapeGroup);

            StackPane root = new StackPane();
            root.getChildren().add(resizePanE);

            Scene scene = new Scene(root,200,200); 
            priMaryStage.setScene(scenE);
            priMaryStage.show();
            //fill node content
            content = nodeCont();
            shapeGroup.getChildren().add(content);
            //resizing listening
            resizePane.widthProperty().addListener(new ChangeListener<number>(){
                            @Override
                            public void changed(ObservableValue<? extends number> observable,number oldValue,number newvalue) {
                                    addScaling();
                            }});
            resizePane.heightProperty().addListener(new ChangeListener<number>(){
                            @Override
                            public void changed(ObservableValue<? extends number> observable,number newvalue) {
                                    addScaling();
                            }});
            Platform.runLater(new Runnable() {          
                            @Override
                            public void run() {
                                    addScaling();
                            }
                    });
            }
            private Node nodeCont() {
                    Group cont = new Group();
                    cont.getChildren().add(shapE);
                    return cont;
            }
            private void addScaling() {
                    shapeGroup.getTransforms().clear();           
                    //shape boundary
                    double cx = content.getBoundsInParent().getWidth();
                    double cy = content.getBoundsInParent().getHeight();
                    //resizePane boundary
                    double px = resizePane.getWidth();
                    double py = resizePane.getHeight();
                    //if pane set
                    if (px > 0.0 && py > 0.0) {
                            //scale
                            double scalex = px/cx;
                            double scaley = py/cy;
                            //center
                            double centerx = 0.5 * (px - cx*scaleX);
                            double centery = 0.5 * (py - cy*scaley);            
                            //transform
                            shapeGroup.getTransforms().add(new Translate(centerx,centery));
                            shapeGroup.getTransforms().add(new Scale(scalex,scaley));
                            shape.setFill(new ImagePattern(img,10/scalex,10/scaley,falsE));
                    }
            }
            public static void main(String[] args) {
                    launch(args);
            }

    }