Ist "-fx-shape" mit "-fx-background-image" kompatibel?
Ich möchte eine Textur auf eine benutzerdefinierte Form anwenden. Ich dachte, das würde funktionieren:
%Vor%Aber das tut es nicht! Ich bekomme die richtige Form, aber ohne die Textur. Alle meine anderen Regionen sind korrekt texturiert, daher weiß ich, dass die Syntax korrekt ist. Ich schätze, weil sie standardmäßig rechteckig sind.
Wenn ich stattdessen den folgenden Stil verwende:
%Vor%Dann bekomme ich einen korrekten roten Hintergrund.
Wenn beide Attribute nicht kompatibel sind, wie kann ich eine Textur auf eine benutzerdefinierte SVG-Pfadform anwenden?
Ps.S: Meine Textur PNG-Datei, ist ein kleines 10 * 10 Raster, das ich wiederhole, um meine Regionen zu füllen.
2 Antworten
Soweit es mich betrifft, arbeiten -fx-shape und -fx-background-image nicht zusammen.
JavaFX CSS bietet viele Styling-Optionen ... allerdings gibt es einige Einschränkungen und einige Dinge sind nur mit Programmierung möglich. JavaFX CSS verwendet impl_setShape() , um die Region-Klasse auf die definierte Form zu körnen (was in der API als veraltet gilt, aber Sie können es immer noch in javafx 2.2 ausprobieren, das ich gerade verwende). Wenn Sie das Hintergrundbild hinzufügen, wird die Form ignoriert und der gesamte Bereich / Bereich ausgefüllt. Das Gleiche passiert, wenn Sie mit addChildren ImageView-Objekte hinzufügen. Also - die CSS-Zeichenfolge wird nicht in das Ergebnis übersetzt, das Sie möchten.
So kann ich mir mindestens zwei Möglichkeiten vorstellen, ein Muster auf eine benutzerdefinierte SVGPath-Form anzuwenden. Die eine, die ich verwenden würde, ist mit ImagePattern gemacht. Baue zuerst die Form wie folgt
%Vor%oder Verwenden von Shape Builder
%Vor%und legen Sie das Bildmuster als Füllung fest
%Vor%Eine Alternative wäre Clipping (Hinzufügen eines benutzerdefinierten Form-Clips zu einem Bereich mit -fx-background-image im css-Stil), der ungefähr so aussehen würde
%Vor%Einer von diesen sollte den Trick machen - Sie erhalten Ihre Form mit dem strukturierten Hintergrund. Dies entspricht dem, was Sie von einer Regions- oder Pane-Klasse mit Stil erwarten würden
%Vor% Die SVGPath-Form ist also im Gegensatz zu Region / Pane wie alle Shape-Klassen nicht skalierbar, deshalb setze ich hier das -fx-scale-shape -Attribut auf false. Die Art, wie Sie es hatten, war mit der Standardeinstellung - die es auf True setzt - die Form füllt das gesamte Elternobjekt ... aus dem ich denke, dass dies auch Ihr gewünschtes Ergebnis wäre. ... gibt es jetzt wieder mehrere Möglichkeiten, die Form zum übergeordneten Objekt zu skalieren.
Ich habe es mithilfe von Group zum Einbetten der Form und mit einer Methode zum Übersetzen der Gruppe verwendet (die Bildgröße muss im ImagePattern angepasst werden, damit die Textur nicht mit der Form skaliert wird). Ich füge eine kleine funktionierende App hinzu, die ich im obigen Beispiel sah, wenn ich mich an alles richtig erinnere. (Wenn Sie möchten, dass die Form proportional skaliert wird, verwenden Sie in der addScale-Methode denselben Maßstabsfaktor anstelle von scalex und sclaey)
%Vor%Die Möglichkeit, eine Hintergrundtextur über css auf eine benutzerdefinierte Form anzuwenden, war ein Plattformfehler mit JavaFX 2.2 (Java 7).
In Java 8 ist der Plattformfehler behoben.
Beispiel css:
%Vor%Beispiel-App:
%Vor%Wenn Sie den Beispielcode auf Java 7 ausführen, wird die Form nicht auf die Hintergrundtextur angewendet:
Wenn Sie denselben Beispielcode auf Java 8b80 ausführen, wird die Form auf die Hintergrundtextur angewendet:
