Hintergrund mit 2 Farben in JavaFX?

8

In JavaFX 2, mit CSS, ist es möglich einen Hintergrund mit 2 Farben zu erstellen? Denken Sie z.B. a TableCell mit einer Höhe von 10 px. Ich möchte, dass die ersten 2 px (vertikal) rot sind, die restlichen 8 px (vertikal) sollen auf der Standardhintergrundfarbe bleiben. Ist das mit CSS in JavaFX 2 möglich? Wie?

Beispiel:

Ursprünglicher Hintergrund:

Gewünschtes Ergebnis:

(die oberen 2 Pixel wurden durch Rot ersetzt) ​​

Danke für einen Hinweis darauf!

    
stefan.at.wpf 24.04.2013, 19:49
quelle

2 Antworten

14

Ich habe eine einfache Ebene mit Hintergrundfarben verwendet, um eine rote Markierung zu erzeugen (ähnlich der vorgeschlagenen Lösung von Stefan).

%Vor%

Für eine Standardregion wie eine Stackpanel müssen Sie nur die obige css (weniger -fx-text-fill ) anwenden, um das gewünschte Ergebnis zu erhalten.

Hier ist ein weiterer schwieriger Weg, um die Farbe mit einem Farbverlauf zu definieren:

%Vor%

In der Abbildung unten sind die Wertzellen hervorgehoben (indem die Klasse highlighted-cell css auf sie angewendet wird), wenn sie den Wert false haben.

Markieren Sie die Schaltlogik der Zellenstilklasse:

%Vor%

Es sieht gut aus, wenn die Stilklasse highlighted-cell auf eine Standardtabellenzelle angewendet wird (während einer updateItem Aufruf für eine benutzerdefinierte Zelle), hat aber einige Nachteile. Das Tabellenfarbschema ist sehr subtil und komplex. Es enthält Hervorhebungen für ungerade / gerade Werte, Hervorhebungen für ausgewählte Zeilen, Hervorhebungen für ausgewählte schwebende Zeilen, Hervorhebungen für fokussierte Zeilen und Zellen usw. Außerdem bietet es verschiedene Kombinationen aller oben genannten Möglichkeiten. Nur die Hintergrundfarbe direkt in der Highlight-Cell-Klasse zu setzen, ist eine Art roher Gewalt, um das zu erreichen, was Sie wollen, weil es all diese anderen Feinheiten nicht berücksichtigt und sie nur überschreibt, also eine Zelle, die damit markiert wurde Der Stil sieht immer gleich aus, unabhängig davon, welcher temporäre CSS-Pseudo-Klassen-Status auf ihn angewendet wurde.

Es ist wirklich in Ordnung, aber eine bessere Lösung würde die markierte Zelle je nach Pseudo-Klassen-Zustand anders färben. Das ist eine ziemlich schwierige Sache und du könntest viel Zeit damit verschwenden, mit verschiedenen Zuständen und CSS-Selektor-Kombinationen herumzuspielen, um zu versuchen, das schöne wechselnde Highlight zu bekommen. Insgesamt schien es für dieses Beispiel nicht so viel Aufwand für mich zu sein, obwohl es für dich sein könnte.

Test-Programm (Entschuldigung für Länge und Komplexität, es war einfach für mich, die Stilhervorhebungslogik in ein bestehendes Programm zu integrieren):

%Vor%     
jewelsea 24.04.2013 22:36
quelle
0

Sehen Sie, wie Sie CSSRef verstehen:

Ссылка

Sehen Sie sich

an

-fx-Hintergrundbild:

uri [, uri] *

Eine Reihe von Bild-URIs, die durch Kommas getrennt sind.

Sehen Sie sich

an

-fx-Hintergrundwiederholung

Wiederholungsstil [, Wiederholungsstil] *

wo repeat-style = wiederhole-x | wiederhole y | [wiederhole | Raum | Runde | Strecken | keine Wiederholung] {1,2}

Eine Reihe von Werten getrennt durch Kommas. Jedes Element im Wiederholungsstil der Reihe gilt für das entsprechende Bild in der Hintergrundbildserie.

Sehen Sie sich an: -fx-Hintergrundposition

bg-Position [, bg-Position] * wo = [     [[Größe | verlassen | Zentrum | richtig] [Größe | Nach oben | Zentrum | Unterseite ]? ]     | [Mitte | [links | richtige Größe? ] || [Mitte | [ Nach oben | Bodenmaß? ] ]

Eine Reihe von Werten getrennt durch Kommas. Jedes bg-Positionselement in der Reihe gilt für das entsprechende Bild in der Hintergrundbildserie.

Also, was können Sie sehen: Sie sollten 2 Bilder beschreiben, (2x2 Pixel jeweils - eins rot und eins - grau) Zwei bg-Positionen und zwei Wiederholungsstile für jeden von ihnen entsprechen.

Wie?

Beispiel:

%Vor%

Ich gebe keine Garantie für die Funktionsfähigkeit des Codes, aber die Idee scheint korrekt zu sein.

Vielleicht nur mit Farben anstelle von Bildern bei Verwendung von Einsätzen möglich. Beispiel aus original JavaFX CSS:

%Vor%

[6 Zeichen ...]

    
Alexander Kirov 24.04.2013 20:21
quelle