Utiliser un OuterGlowEffect à partir d'un Trigger

Version imprimable

:salut:

Encore avec mon histoire de WPF. Je désire changer la taille du OuterGlowEffect qui entoure un Border au passage de la souris. Donc, je pond le xaml suivant :

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
43
 
<Border VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Name="ButtonContentDrawing" CornerRadius="2,2,2,2">
                    <Border.Background>
                        <DrawingBrush Stretch="Fill">
                            <DrawingBrush.Drawing>
                                <DrawingGroup>
                                    <GeometryDrawing>
                                        <GeometryDrawing.Geometry>
                                            <GeometryGroup FillRule="Nonzero">
                                                <RectangleGeometry Rect="30,0,20,80"/>
                                                <RectangleGeometry Rect="0,30,80,20"/>
                                                <GeometryGroup.Transform>
                                                    <RotateTransform Angle="45" CenterX="40" CenterY="40"/>
                                                </GeometryGroup.Transform>
                                            </GeometryGroup>
                                        </GeometryDrawing.Geometry>
                                        <GeometryDrawing.Brush>
                                            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                                <GradientStop Color="White" Offset="0"/>
                                                <GradientStop Color="Silver" Offset="1"/>
                                            </LinearGradientBrush>
                                        </GeometryDrawing.Brush>
                                    </GeometryDrawing>
                                    <DrawingGroup.BitmapEffect>
                                        <OuterGlowBitmapEffect x:Name="ButtonOuterGlow"></OuterGlowBitmapEffect>
                                    </DrawingGroup.BitmapEffect>
                                </DrawingGroup>
                            </DrawingBrush.Drawing>
                        </DrawingBrush>
                    </Border.Background>
 
                    <Border.Style>
                        <Style>
                            <Style.Triggers>
                                <Trigger Property="IsMouseOver">
                                    <Setter TargetName="ButtonOuterGlow" Property="GlowSize">
                                        <Setter.Value>2</Setter.Value>
                                    </Setter>
                                </Trigger>
                            </Style.Triggers>
                        </Style>
                    </Border.Style>
                </Border>

bzzz, mauvaise réponse :

Code:

1
2
 
<Setter TargetName="ButtonOuterGlow" Property="GlowSize">

VS me dit que "ButtonOuterGlow" est introuvable, pourtant :

Code:

1
2
3
<DrawingGroup.BitmapEffect>
                                        <OuterGlowBitmapEffect x:Name="ButtonOuterGlow"></OuterGlowBitmapEffect>
                                    </DrawingGroup.BitmapEffect>

Alors fichtre, comment suis-je censé faire ?!

06/06/2008, 10h08
Jérem22

Je crois que tu ne peux pas utiliser TargetName quand tu défini un style. Ca doit être pour ça que tu as une erreur.

Du coup par contre j'ai essayé des trucs mais je n'arrive pas à trouver un moyen d'accéder au BitmapEffect...

Je cherche encore un peu :D

En effet il na faut pas de TargetName :

Tu peux faire ainsi :

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
43
44
        <Border VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Name="ButtonContentDrawing" CornerRadius="2,2,2,2">
          <Border.Background>
            <DrawingBrush Stretch="Fill">
              <DrawingBrush.Drawing>
                <DrawingGroup>
                  <GeometryDrawing>
                    <GeometryDrawing.Geometry>
                      <GeometryGroup FillRule="Nonzero">
                        <RectangleGeometry Rect="30,0,20,80"/>
                        <RectangleGeometry Rect="0,30,80,20"/>
                        <GeometryGroup.Transform>
                          <RotateTransform Angle="45" CenterX="40" CenterY="40"/>
                        </GeometryGroup.Transform>
                      </GeometryGroup>
                    </GeometryDrawing.Geometry>
                    <GeometryDrawing.Brush>
                      <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                        <GradientStop Color="White" Offset="0"/>
                        <GradientStop Color="Silver" Offset="1"/>
                      </LinearGradientBrush>
                    </GeometryDrawing.Brush>
                  </GeometryDrawing>
                  <DrawingGroup.BitmapEffect>
                    <OuterGlowBitmapEffect x:Name="ButtonOuterGlow"></OuterGlowBitmapEffect>
                  </DrawingGroup.BitmapEffect>
                </DrawingGroup>
              </DrawingBrush.Drawing>
            </DrawingBrush>
          </Border.Background>
 
          <Border.Style>
            <Style TargetType="Border">
              <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                  <Setter Property="BitmapEffect" >
                    <Setter.Value>
                      <OuterGlowBitmapEffect GlowSize="2" />
                    </Setter.Value>
                  </Setter>
                </Trigger>
              </Style.Triggers>
            </Style>
          </Border.Style>
        </Border>

06/06/2008, 13h52
HighTouch

Je suis pas un expert mais les effets tel que OuterGlow sont lourd et mal gerer, c'est mieux gerer avec le Sp1 a ce que j'ai pu entendre. mais si tu veux en faire il existe un moyen c'est d'appliquer ces effets sous expression design. ( encore une fois )
06/06/2008, 14h24
binoo

Je profite que tu parles (encore :)) d'Expression Design pour te demander si il permet, en plus de dessiner, de gérer les évènements souris tel celui énoncé dans ce post. C'est à dire : est-il possible de définir le style lorsque je passe la souris sur l'objet dessiné (tout ça avec expression design :D) ?

nb: je ne l'ai pas dit mais je ne connais pas Expression Design.
06/06/2008, 20h29
smyley

Citation:

Envoyé par binoo

En effet il na faut pas de TargetName :

Tu peux faire ainsi :

za marze :king:

Mais par contre, à partir d'un trigger quelconque qui ne serait pas dans un Style (Border.Style) mais peut être dans Border.Triggers, il y a un moyen d'accéder directement à l'objet que j'ai nommé "ButtonOuterGlow" ?
10/06/2008, 10h30
HighTouch

Citation:

Envoyé par binoo

Je profite que tu parles (encore :)) d'Expression Design pour te demander si il permet, en plus de dessiner, de gérer les évènements souris tel celui énoncé dans ce post. C'est à dire : est-il possible de définir le style lorsque je passe la souris sur l'objet dessiné (tout ça avec expression design :D) ?

nb: je ne l'ai pas dit mais je ne connais pas Expression Design.

non faut pas abuser non plus :D monsieur Binoo mais une fois la forme creer et l'effet appliquer il suffit de copier coller ton xaml dans blend et de lui assigner un evenement ainsi qu'un style. ( je me repete mais il faut passer par design pour se simplifier la vie, enfin je dis ça mais je dis rien surtout pour ceux qui ont pas les moyens de ce payer la suite expression parce que moi personnellement tailler des figures en xaml je kiff pas trop ça ).

Et pour en revenir au sujet sans le sp1 je conseil pas les effets tel que outerGlow...

Ok merci pour l'info ;).
Je ne doute pas que ce soit plus simple après. En fait c'était juste pour savoir si Expression Design aurait pu aussi aider à résoudre la problématique du post. Mais ce n'est donc pas le cas.

Citation:

Envoyé par smyley

Mais par contre, à partir d'un trigger quelconque qui ne serait pas dans un Style (Border.Style) mais peut être dans Border.Triggers, il y a un moyen d'accéder directement à l'objet que j'ai nommé "ButtonOuterGlow" ?

Je ne crois pas en fait. Mais avec un EventTrigger et la création d'une animation, c'est possible. Soit qqc comme ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
          <Border.Triggers>
            <EventTrigger RoutedEvent="Border.MouseEnter" >
              <BeginStoryboard>
                <Storyboard>
                  <ColorAnimation
                      Storyboard.TargetName="ButtonOuterGlow"
                      Storyboard.TargetProperty="GlowColor"
                      To="LightBlue" Duration="0:0:0.2" FillBehavior="HoldEnd" />
                </Storyboard>
              </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="Border.MouseLeave" >
              <BeginStoryboard>
                <Storyboard>
                  <ColorAnimation
                      Storyboard.TargetName="ButtonOuterGlow"
                      Storyboard.TargetProperty="GlowColor"
                      To="Orange" Duration="0:0:0.2" FillBehavior="HoldEnd" />
                </Storyboard>
              </BeginStoryboard>
            </EventTrigger>
          </Border.Triggers>