Discussion :

[guatto]

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 :



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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 !