ScrollBar Template fonctionne a moitié

**Monkey56** · 28/07/2011, 17h52

Bonjour.

Pour mon soft j'ai créer un liste complète de nombreux template sauf que l'un d'entre eux me pose problème.

Le template pour le control ScrollBar fonctionne qu'à moitié:
- Les RepeatButton fonctionnent très bien
- Le thumb lui ne fonctionne pas du tout. Je le presse mais il ne bouge pas.

voici tout mon code:

Code xaml :

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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
    <Style TargetType="{x:Type ScrollBar}">
        <Style.Resources>
            <Storyboard x:Key="OverOn">
                <DoubleAnimation Duration="00:00:00.2000000" Storyboard.TargetProperty="Opacity" To="1" />
            </Storyboard>
            <Storyboard x:Key="OverOff">
                <DoubleAnimation Duration="00:00:00.2000000" Storyboard.TargetProperty="Opacity" To="0.5" />
            </Storyboard>
        </Style.Resources>
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="Opacity" Value="0.5" />
        <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_Background}" />
        <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_BorderBrush}" />
        <Setter Property="BorderThickness" Value="{DynamicResource ScrollBar_Default_BorderThickness}" />
        <Style.Triggers>
            <Trigger Property="Orientation" Value="Horizontal">
                <Setter Property="Width" Value="Auto" />
                <Setter Property="Height" Value="18" />
                <Setter Property="Template" Value="{DynamicResource ScrollBar_Horizontal_Template}" />
            </Trigger>
            <Trigger Property="Orientation" Value="Vertical">
                <Setter Property="Width" Value="18" />
                <Setter Property="Height" Value="Auto" />
                <Setter Property="Template" Value="{DynamicResource ScrollBar_Vertical_Template}" />
            </Trigger>
            <Trigger Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource OverOn}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard Storyboard="{StaticResource OverOff}" />
                </Trigger.ExitActions>
            </Trigger>
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_Background_Disabled}" />
                <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_BorderBrush_Disabled}" />
            </Trigger>
        </Style.Triggers>
    </Style>
 
    <Style x:Key="ScrollBar_RepeatButton_Line_Template" TargetType="{x:Type RepeatButton}">
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="Focusable" Value="false"/>
        <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_RepeatButton_Background}" />
        <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_RepeatButton_BorderBrush}" />
        <Setter Property="BorderThickness" Value="{DynamicResource ScrollBar_Default_RepeatButton_BorderThickness}" />
        <Setter Property="Margin" Value="{DynamicResource ScrollBar_Default_RepeatButton_Margin}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Border Margin="{TemplateBinding Margin}"
                            CornerRadius="{DynamicResource ScrollBar_Default_RepeatButton_CornerRadius}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                        <Path HorizontalAlignment="Center"
                              VerticalAlignment="Center"
                              Fill="{DynamicResource ScrollBar_Default_RepeatButton_Arrow_Background}"
                              Stroke="{DynamicResource ScrollBar_Default_RepeatButton_Arrow_BordderBrush}"
                              Data="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_RepeatButton_Background_Disabled}" />
                <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_RepeatButton_BorderBrush_Disabled}" />
            </Trigger>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_RepeatButton_Background_Over}" />
                <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_RepeatButton_BorderBrush_Over}" />
            </Trigger>
        </Style.Triggers>
    </Style>
 
    <Style x:Key="ScrollBar_RepeatButton_Page_Template" TargetType="{x:Type RepeatButton}">
        <Setter Property="SnapsToDevicePixels" Value="True" />
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="IsTabStop" Value="false" />
        <Setter Property="Focusable" Value="false" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Border Background="Transparent" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
 
    <Style x:Key="ScrollBar_Thumb_Template" TargetType="{x:Type Thumb}">
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="OverridesDefaultStyle" Value="true"/>
        <Setter Property="IsTabStop" Value="false"/>
        <Setter Property="Focusable" Value="false"/>
        <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_Thumb_Background}" />
        <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_Thumb_BorderBrush}" />
        <Setter Property="BorderThickness" Value="{DynamicResource ScrollBar_Default_Thumb_BorderThickness}" />
        <Setter Property="Margin" Value="{DynamicResource ScrollBar_Default_Thumb_Margin}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Border Margin="{DynamicResource ScrollBar_Default_Thumb_Margin}"
                            CornerRadius="{DynamicResource ScrollBar_Default_Thumb_CornerRadius}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_Thumb_Background_Disabled}" />
                <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_Thumb_BorderBrush_Disabled}" />
            </Trigger>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="{DynamicResource ScrollBar_Default_Thumb_Background_Over}" />
                <Setter Property="BorderBrush" Value="{DynamicResource ScrollBar_Default_Thumb_BorderBrush_Over}" />
            </Trigger>
        </Style.Triggers>
    </Style>
 
    <ControlTemplate x:Key="ScrollBar_Horizontal_Template" TargetType="{x:Type ScrollBar}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="18" />
                <ColumnDefinition Width="0.00001*" />
                <ColumnDefinition Width="18" />
            </Grid.ColumnDefinitions>
            <Border Grid.ColumnSpan="3"
                    CornerRadius="{DynamicResource ScrollBar_Default_CornerRadius}"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}" />
            <RepeatButton Grid.Column="0"
                          Width="18"
                          Style="{DynamicResource ScrollBar_RepeatButton_Line_Template}"
                          Command="ScrollBar.LineLeftCommand"
                          Content="M 4 0 L 4 8 L 0 4 Z" />
            <Track Grid.Column="1" IsDirectionReversed="False">
                <Track.DecreaseRepeatButton>
                    <RepeatButton Style="{DynamicResource ScrollBar_RepeatButton_Page_Template}"
                                  Command="ScrollBar.PageLeftCommand" />
                </Track.DecreaseRepeatButton>
                <Track.Thumb>
                    <Thumb Style="{DynamicResource ScrollBar_Thumb_Template}" />
                </Track.Thumb>
                    <Track.IncreaseRepeatButton>
                    <RepeatButton Style="{DynamicResource ScrollBar_RepeatButton_Page_Template}"
                                  Command="ScrollBar.PageRightCommand" />
                    </Track.IncreaseRepeatButton>
            </Track>
            <RepeatButton Grid.Column="2"
                          Width="18"
                          Style="{DynamicResource ScrollBar_RepeatButton_Line_Template}"
                          Command="ScrollBar.LineRightCommand"
                          Content="M 0 0 L 4 4 L 0 8 Z" />
        </Grid>
    </ControlTemplate>
 
    <ControlTemplate x:Key="ScrollBar_Vertical_Template" TargetType="{x:Type ScrollBar}">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="18" />
                <RowDefinition Height="0.00001*" />
                <RowDefinition Height="18" />
            </Grid.RowDefinitions>
            <Border Grid.RowSpan="3"
                    CornerRadius="{DynamicResource ScrollBar_Default_CornerRadius}"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}" />
            <RepeatButton Grid.Row="0"
                          Height="18"
                          Style="{DynamicResource ScrollBar_RepeatButton_Line_Template}"
                          Command="ScrollBar.LineUpCommand"
                          Content="M 0 4 L 8 4 L 4 0 Z" />
            <Track Grid.Row="1" IsDirectionReversed="True">
                <Track.IncreaseRepeatButton>
                    <RepeatButton Style="{DynamicResource ScrollBar_RepeatButton_Page_Template}"
                                  Command="ScrollBar.PageUpCommand" />
                </Track.IncreaseRepeatButton>
                <Track.Thumb>
                    <Thumb Style="{DynamicResource ScrollBar_Thumb_Template}" />
                </Track.Thumb>
                <Track.DecreaseRepeatButton>
                    <RepeatButton Style="{DynamicResource ScrollBar_RepeatButton_Page_Template}"
                                  Command="ScrollBar.PageDownCommand" />
                </Track.DecreaseRepeatButton>
            </Track>
            <RepeatButton Grid.Row="2"
                          Height="18"
                          Style="{DynamicResource ScrollBar_RepeatButton_Line_Template}"
                          Command="ScrollBar.LineDownCommand"
                          Content="M 0 0 L 4 4 L 8 0 Z" />
        </Grid>
    </ControlTemplate>

**jmix90** · 04/08/2011, 15h53

Hello,

Je met une scrollbar avec ton style dans un projet demo... elle n’apparaît tout simplement pas

**Monkey56** · 04/08/2011, 16h01

Normal car tu n'as aucunes couleurs pour toutes les DynamicResource, du coup tout est Transparent par défaut

voici mon code pour les couleurs:

Code XAML :

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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
    <!-- ############### -->
    <!-- ############### -->
    <!-- ## ScrollBar ## -->
    <!-- ############### -->
    <!-- ############### -->
 
    <!-- ************* -->
    <!-- ** Brushes ** -->
    <!-- ************* -->
    <!-- Background -->
    <SolidColorBrush x:Key="ScrollBar_Default_Background" Color="Transparent" />
    <SolidColorBrush x:Key="ScrollBar_Default_Background_Disabled" Color="Transparent" />
    <!-- BorderBrush -->
    <SolidColorBrush x:Key="ScrollBar_Default_BorderBrush" Color="Gainsboro" />
    <SolidColorBrush x:Key="ScrollBar_Default_BorderBrush_Disabled" Color="Gainsboro" />
    <!-- Thumb | Background -->
    <SolidColorBrush x:Key="ScrollBar_Default_Thumb_Background" Color="Gray" />
    <SolidColorBrush x:Key="ScrollBar_Default_Thumb_Background_Disabled" Color="Gray" />
    <SolidColorBrush x:Key="ScrollBar_Default_Thumb_Background_Over" Color="Gainsboro" />
    <!-- Thumb | BorderBrush -->
    <SolidColorBrush x:Key="ScrollBar_Default_Thumb_BorderBrush" Color="Gray" />
    <SolidColorBrush x:Key="ScrollBar_Default_Thumb_BorderBrush_Disabled" Color="Gray" />
    <SolidColorBrush x:Key="ScrollBar_Default_Thumb_BorderBrush_Over" Color="Gainsboro" />
    <!-- RepeatButton | Background -->
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_Background" Color="Gray" />
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_Background_Disabled" Color="Gray" />
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_Background_Over" Color="Gainsboro" />
    <!-- RepeatButton | BorderBrush -->
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_BorderBrush" Color="Gainsboro" />
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_BorderBrush_Disabled" Color="Gainsboro" />
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_BorderBrush_Over" Color="Gainsboro" />
    <!-- RepeatButton | Arrow | Background -->
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_Arrow_Background" Color="White" />
    <!-- RepeatButton | Arrow | BordderBrush -->
    <SolidColorBrush x:Key="ScrollBar_Default_RepeatButton_Arrow_BordderBrush" Color="White" />
 
    <!-- *********** -->
    <!-- ** Shape ** -->
    <!-- *********** -->
    <!-- CornerRadius -->
    <CornerRadius x:Key="ScrollBar_Default_CornerRadius" TopLeft="2" TopRight="2" BottomRight="2" BottomLeft="2" />
    <!-- BorderThickness -->
    <Thickness x:Key="ScrollBar_Default_BorderThickness" Left="1" Right="1" Top="1" Bottom="1" />
    <!-- Margin -->
    <Thickness x:Key="ScrollBar_Default_Margin" Left="0" Top="0" Right="0" Bottom="0" />
    <!-- Thumb | CornerRadius -->
    <CornerRadius x:Key="ScrollBar_Default_Thumb_CornerRadius" TopLeft="2" TopRight="2" BottomRight="2" BottomLeft="2" />
    <!-- Thumb | BorderThickness -->
    <Thickness x:Key="ScrollBar_Default_Thumb_BorderThickness" Left="1" Right="1" Top="1" Bottom="1" />
    <!-- Thumb | Margin -->
    <Thickness x:Key="ScrollBar_Default_Thumb_Margin" Left="2" Top="2" Right="2" Bottom="2" />
    <!-- RepeatButton | CornerRadius -->
    <CornerRadius x:Key="ScrollBar_Default_RepeatButton_CornerRadius" TopLeft="2" TopRight="2" BottomRight="2" BottomLeft="2" />
    <!-- RepeatButton | BorderThickness -->
    <Thickness x:Key="ScrollBar_Default_RepeatButton_BorderThickness" Left="1" Right="1" Top="1" Bottom="1" />
    <!-- RepeatButton | Margin -->
    <Thickness x:Key="ScrollBar_Default_RepeatButton_Margin" Left="0" Top="0" Right="0" Bottom="0" />