1 pièce(s) jointe(s)
Modifier l'apparence du ScrollPane
Bonjour/Bonsoir tout le monde,
je travail en ce moment sur le design de mon programme, et je me heurte à quelques difficultés avec le ScrollPane, j'ai voulu modifier l'apparence de chaque éléments contenu dans celui-ci (track, thumb, bouton-incrément/décrément) en m'inspirant de celui de "Sublime-text", et pour l'instant ça me réussi un peu, sauf que j'ai quelques désagréments dans l'affichage, comme indiqué dans la capture d'écran :
Pièce jointe 211105
Il y a 3 choses que je n'arrive pas à modifier ou à contrôler/cacher :
-les boutons (incrément/décrément).
-les bordures qui apparaissent en haut à gauche.
-le carré qui s'affiche pour séparer le "ScrollBar" vertical de l'horizontal.
Et voici le code que j'utilise pour modifier l'apparence :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
.scroll-bar {
-fx-background-color: transparent;
}
.scroll-bar:vertical .track {
-fx-border-color:transparent transparent transparent #1D1D1D;
-fx-background-color: linear-gradient(from 100% 0% to 0% 0%, #323232 0%, #212121 100%);
}
.scroll-bar:horizontal .track{
-fx-border-color:#1D1D1D transparent transparent transparent;
-fx-background-color: linear-gradient(from 100% 100% to 100% 0%, #323232 0%, #212121 100%);
}
.scroll-bar:horizontal .thumb {
-fx-background-color: linear-gradient(from 100% 100% to 100% 0%, #404040 0%, #585858 100%);
-fx-effect: dropshadow(one-pass-box,#000000,2.0,0.7,0.0,0.0);
-fx-background-insets: 3 3 3 3;
-fx-background-radius: 2em;
}
.scroll-bar:vertical .thumb {
-fx-background-color: linear-gradient(from 100% 0% to 0% 0%, #404040 0%, #585858 100%);
-fx-effect: dropshadow(one-pass-box,#000000,2.0,0.7,0.0,0.0);
-fx-background-insets: 3 3 3 3;
-fx-background-radius: 2em;
} |
Merci bien pour votre aide ! :P
