Comment puis-je style le composant ProgressBar en JavaFX

J'ai marqué que cette réponse wiki de la communauté.

Si vous avez des idées pour JavaFX ProgressBar style à l'extérieur de l'original initial style des requêtes, merci d'éditer ce post pour ajouter vos idées style (ou de les mettre en lien).

définir la couleur de la barre de progression elle-même

Répondu:

• JavaFX ProgressBar: comment modifier la barre de couleur?

La réponse démontre

1. Style dynamique de la barre de progression, de sorte que la barre de couleur change en fonction des progrès réalisés.
2. Statique style de la barre de progression, qui place la barre de la couleur à jamais à une couleur définie par l'.

JavaFX 7 (mer caspienne) sur un PC Windows:

JavaFX 8 (modène) sur un Mac:

Parfois, les gens comme salon de coiffure style de pôle dégradés, comme le bootstrap style rayures:

• Barre De Progression Animée Javafx

définir la couleur d'arrière-plan de la barre de progression (pas le même que le réglage de la couleur d'arrière-plan)

Préciser la feuille de style css pour la barre de progression de la "piste":

.progress-bar > .track {
  -fx-text-box-border: forestgreen;
  -fx-control-inner-background: palegreen;
}

ajouter un texte personnalisé nœud sur le dessus de la barre de progression (pour voir les différents états)

Répondu:

• Dessiner une Chaîne sur une ProgressBar, comme JProgressBar?

comment modifier la hauteur d'une barre de progression:

Répondu:

• Comment obtenir étroite barre de progres dans JavaFX?

Exemple de CSS:

.progress-bar .bar { 
    -fx-padding: 1px; 
    -fx-background-insets: 0; 
}

José Pereda donne une belle solution complète pour les barres de progression dans sa réponse à:

• Comment obtenir une petite Barre de progression en JavaFX

Je suis à la recherche pour les noms de classe css et css commandes

L'endroit à regarder est dans le défaut de JavaFX feuille de style.

• modène.css pour Java 8.
• de la mer caspienne.css pour Java 7.

La ProgressBar les définitions de style pour la mer caspienne (Java 7):

.progress-bar {
-fx-skin: "com.sun.javafx.scene.control.skin.ProgressBarSkin";
-fx-background-color:
-fx-box-border,
linear-gradient(to bottom, derive(-fx-color,30%) 5%, derive(-fx-color,-17%));
-fx-background-insets: 0, 1;
-fx-indeterminate-bar-length: 60;
-fx-indeterminate-bar-escape: true;
-fx-indeterminate-bar-flip: true;
-fx-indeterminate-bar-animation-time: 2;
}
.progress-bar .bar {
-fx-background-color:
-fx-box-border,
linear-gradient(to bottom, derive(-fx-accent,95%), derive(-fx-accent,10%)),
linear-gradient(to bottom, derive(-fx-accent,38%), -fx-accent);
-fx-background-insets: 0, 1, 2;
-fx-padding: 0.416667em; /* 5 */
}
.progress-bar:indeterminate .bar {
-fx-background-color: linear-gradient(to left, transparent, -fx-accent);
}
.progress-bar .track {
-fx-background-color:
-fx-box-border,
linear-gradient(to bottom, derive(-fx-color,-15%), derive(-fx-color,2.2%) 20%, derive(-fx-color,60%));
-fx-background-insets:  0, 1;
}
.progress-bar:disabled {
-fx-opacity: -fx-disabled-opacity;
}

La barre de progression définitions de style de modène (Java 8) sont:

.progress-bar {
-fx-indeterminate-bar-length: 60;
-fx-indeterminate-bar-escape: true;
-fx-indeterminate-bar-flip: true;
-fx-indeterminate-bar-animation-time: 2;
}
.progress-bar > .bar {
-fx-background-color: linear-gradient(to bottom, derive(-fx-accent, -7%), derive(-fx-accent, 0%), derive(-fx-accent, -3%), derive(-fx-accent, -9%) );
-fx-background-insets: 3 3 4 3;
-fx-background-radius: 2;
-fx-padding: 0.75em;
}
.progress-bar:indeterminate > .bar {
-fx-background-color: linear-gradient(to left, transparent, -fx-accent);
}
.progress-bar > .track {
-fx-background-color: 
-fx-shadow-highlight-color,
linear-gradient(to bottom, derive(-fx-text-box-border, -10%), -fx-text-box-border),
linear-gradient(to bottom, 
derive(-fx-control-inner-background, -7%),
derive(-fx-control-inner-background, 0%),
derive(-fx-control-inner-background, -3%),
derive(-fx-control-inner-background, -9%)
);
-fx-background-insets: 0, 0 0 1 0, 1 1 2 1;
-fx-background-radius: 4, 3, 2; /* 10, 9, 8 */
}

La JavaFX CSS guide de référence contient des informations générales sur l'utilisation de CSS dans JavaFX (qui diffère quelque peu de l'utilisation de CSS dans le HTML).

OriginalL'auteur