Discussion :

[Ishizaki]

Rebonjour tout le monde, j'ai une petite erreur sur Silverlight, sur ma Page.xaml :

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
 
<UserControl x:Class="Test.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:controls="clr-namespace:Test.Controls;assembly=Test.Controls"
    Width="1000" Height="1000" xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows">
 
    <Grid x:Name="LayoutRoot" Background="White" Margin="0">
        <controls:TestBoxContainer x:Name="TestBoxContainer1">
 
 
        </controls:TestBoxContainer>        
 
    </Grid>
</UserControl>

L'erreur se situe sur </controls:TestBoxContainer>, erreur de parsing XAML...

Je ne vois pas du tout d'où ça sort, je me suis renseigné et apparemment ce n'est pas une erreur isolée sur Silverlight. Mais je n'ai pas trouvé de réponse...

Merci de votre aide ^^.

[Thomas Lebrun]

Essaye d'enlever ca:

Code :

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

xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"

Sinon, ca marche sans ca:

Code :

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

1
2
3
4
5
 
<controls:TestBoxContainer x:Name="TestBoxContainer1">
 
 
        </controls:TestBoxContainer>

?

[Ishizaki]

Ca marche quand j'enlève mon contrôle...

[DroP]

Montre nous le code de ton control

[Ishizaki]

Voilà le code de mon generic.xaml :

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
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
 
<ResourceDictionary 
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:custom="clr-namespace:Test.Controls"
  xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"  >
    <Style TargetType="custom:BoxContainer">
        <Setter Property="Width" Value="440" />
        <Setter Property="Height" Value="300" />
        <Setter Property="Background" Value="White" />
        <Setter Property="Opacity" Value="0.2"></Setter>
        <Setter Property="Stroke" Value="Blue"></Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="custom:BoxContainer">
                    <Grid x:Name="RootBoxContainer">
 
                        <!--Rectangle Conteneur-->
                        <Rectangle x:Name="RectangleBoxContainer" RadiusX="16" RadiusY="16" Fill="{TemplateBinding Background}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}" 
                        Stroke="{TemplateBinding Stroke}" Opacity="{TemplateBinding Opacity}" />
 
 
                        <!--ContentPresenter-->
                        <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center">
 
                        </ContentPresenter>
 
 
 
 
                        <!--Groupes d'Etats visuels (communs, checkbox...)-->
                        <vsm:VisualStateManager.VisualStateGroups>
 
                            <!--Groupe Commun (comme pour les boutons)-->
                            <vsm:VisualStateGroup x:Name="CommonStates">
                                <vsm:VisualState x:Name="Normal"></vsm:VisualState>
                                <!--Survol de la souris-->
                                <vsm:VisualState x:Name="MouseOver">
                                    <Storyboard Storyboard.TargetName="RectangleBoxContainer">
                                        <ColorAnimation From="{TemplateBinding Background}" To="Transparent" FillBehavior="HoldEnd"></ColorAnimation>
 
                                    </Storyboard>
                                </vsm:VisualState>
 
                                <!--Souris en dehors-->
                                <vsm:VisualState x:Name="MouseOut">
                                    <Storyboard Storyboard.TargetName="RectangleBoxContainer">
                                        <ColorAnimation From="Transparent" To="{TemplateBinding Background}"></ColorAnimation>
                                    </Storyboard>
 
                                </vsm:VisualState>
 
                                <!--Transitions entre les animations-->
                                <vsm:VisualStateGroup.Transitions>
                                    <vsm:VisualTransition GeneratedDuration="0:0:.6"></vsm:VisualTransition>                                    
                                </vsm:VisualStateGroup.Transitions>
                            </vsm:VisualStateGroup>
 
 
                        </vsm:VisualStateManager.VisualStateGroups>
 
                    </Grid>
                </ControlTemplate>
 
            </Setter.Value>
 
        </Setter>
 
    </Style> 
</ResourceDictionary>

Et le code de mon contrôle (pour les explications dans mes commentaires, je sais pas si c'est très exact, mais c'est ce que j'ai compris) :

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
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
 
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
 
namespace Test.Controls
{
    /// <summary>
    /// Conteneur (de n'importe quel item) qui switche son opacité si il y a un rollover d'opéré dessus
    /// </summary>
 
 
    /*Ces attributs vont servir à définir les différents éléments et états constituant le contrôle. Ainsi, il est possible de communiquer avec Blend de cette façon. C'est une
    sorte de contrat passé entre le visuel et le logique*/
 
    /*Un TemplatePart va permettre de recueillir une partie du contrôle (par exemple ici, c'est un Rectangle)
    Il est du type FrameworkElement car celui-ci englobe la plupart des contrôles*/
    [TemplatePart(Name="RectangleBoxContainer", Type=typeof(FrameworkElement))]
 
    //Les Template vont permettre de définir les différents états du ControlTemplate
 
    [TemplateVisualState(Name = "MouseOver", GroupName = "CommonStates")]
    [TemplateVisualState(Name = "MouseOut", GroupName = "CommonStates")]
 
    public class BoxContainer:ContentControl
    {
 
        /// <summary>
        /// Constructeur
        /// </summary>
        public TestBoxContainer()
        {
            this.DefaultStyleKey = typeof(TestBoxContainer);
        }
 
 
        # region Variables privées
 
        private FrameworkElement _rectanglePart;
        private bool isMouseOver = false;
 
        #endregion
 
 
        /// <summary>
        /// Application du Template du contrôle
        /// </summary>
        public override void OnApplyTemplate()
        {
            //On va récupérer le conteneur principal du ControlTemplate
            this.RectanglePart = (FrameworkElement)this.GetTemplateChild("RectangleBoxContainer");
 
            base.OnApplyTemplate();
        }
 
        /// <summary>
        /// Rectangle conteneur
        /// </summary>
        public FrameworkElement RectanglePart
        {
            get
            {
                return this._rectanglePart;
            }
            set
            {
                //Tout d'abord on va récupérer l'ancien ControlTemplate (s'il y en a un) et on va se désabonner de tous les évènements
                FrameworkElement oldRectanglePart = this._rectanglePart;
 
                if (oldRectanglePart != null)
                {
                    oldRectanglePart.MouseEnter -= new MouseEventHandler(_rectanglePart_MouseEnter);
                    oldRectanglePart.MouseLeave -= new MouseEventHandler(_rectanglePart_MouseLeave);
                }
 
                //On va récupérer en suite le nouveau et on va s'abonner aux évènements
                this._rectanglePart = value;
 
                if (this._rectanglePart != null)
                {
                    this._rectanglePart.MouseEnter += new MouseEventHandler(_rectanglePart_MouseEnter);
                    this._rectanglePart.MouseLeave += new MouseEventHandler(_rectanglePart_MouseLeave);
                }
 
            }
        }
 
        /// <summary>
        /// Evènement quand la souris quitte la zone
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        void _rectanglePart_MouseLeave(object sender, MouseEventArgs e)
        {
            this.isMouseOver = false;
            this.SwitchStates(true);
        }
 
        /// <summary>
        /// Evènement de survol
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        void _rectanglePart_MouseEnter(object sender, MouseEventArgs e)
        {
            //On va ainsi pouvoir transformer l'évènement logique de Silverlight en visuel (pour Blend par exemple)
            this.isMouseOver = true;
 
            //Le paramètre de cette méthode, canUseTransitions, va déterminer si l'on peut switcher en utilisant des transitions
            this.SwitchStates(true);
 
        }
 
 
        /// <summary>
        /// On va changer l'état de notre Contrôle
        /// </summary>
        /// <param name="canSwitch"></param>
        private void SwitchStates(bool canUseTransitions)
        {
            //Si on est en survol, on va pouvoir utiliser l'état "OnMouseOver" sinon, ce sera l'état "OnMouseOut"
            if (this.isMouseOver == true)
            {
                VisualStateManager.GoToState(this, "MouseOver", canUseTransitions);
            }
            else
            {
                VisualStateManager.GoToState(this, "MouseOut", canUseTransitions);
            }
 
        }
 
 
 
    }
}

[DroP]

Alors :

1°) c'est normal que dans ton page.xaml tu indiques

<controls:TestBoxContainer />

alors que ton control ne nomme BoxContainer ?

2°) Lorsque je test ton projet, j'ai une erreur avec la propriété Stroke (il me dit que la valeur ne correspond pas au type attendu), si je l'enlève ca marche

3°) Sauf les animations qui ne marche pas car tu les as mal définies

<!--Groupes d'Etats visuels (communs, checkbox...)-->
<vsm:VisualStateManager.VisualStateGroups>

<!--Groupe Commun (comme pour les boutons)-->
<vsm:VisualStateGroup x:Name="CommonStates">
<vsm:VisualState x:Name="Normal"></vsm:VisualState>
<!--Survol de la souris-->
<vsm:VisualState x:Name="MouseOver">
<Storyboard Storyboard.TargetName="RectangleBoxContainer">
<ColorAnimation From="{TemplateBinding Background}" To="Transparent" FillBehavior="HoldEnd"></ColorAnimation>

</Storyboard>
</vsm:VisualState>

<!--Souris en dehors-->
<vsm:VisualState x:Name="MouseOut">
<Storyboard Storyboard.TargetName="RectangleBoxContainer">
<ColorAnimation From="Transparent" To="{TemplateBinding Background}"></ColorAnimation>
</Storyboard>

</vsm:VisualState>

<!--Transitions entre les animations-->
<vsm:VisualStateGroup.Transitions>
<vsm:VisualTransition GeneratedDuration="0:0:.6"></vsm:VisualTransition>
</vsm:VisualStateGroup.Transitions>
</vsm:VisualStateGroup>


</vsm:VisualStateManager.VisualStateGroups>

faut le remplacer par :

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
 <!--Groupes d'Etats visuels (communs, checkbox...)-->
                        <vsm:VisualStateManager.VisualStateGroups>
                            
                            <!--Groupe Commun (comme pour les boutons)-->
                            <vsm:VisualStateGroup x:Name="CommonStates">
                                <vsm:VisualState x:Name="Normal"></vsm:VisualState>
                                <!--Survol de la souris-->
                                <vsm:VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="RectangleBoxContainer"  
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
 From="{TemplateBinding Background}" To="Transparent" FillBehavior="HoldEnd"></ColorAnimation>
                                        
                                    </Storyboard>
                                </vsm:VisualState>
                                
                                <!--Souris en dehors-->
                                <vsm:VisualState x:Name="MouseOut">
                                    <Storyboard >
                                        <ColorAnimation Storyboard.TargetName="RectangleBoxContainer"  Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
From="Transparent" To="{TemplateBinding Background}"></ColorAnimation>
                                    </Storyboard>
                                    
                                </vsm:VisualState>
                                
                                <!--Transitions entre les animations-->
                                <vsm:VisualStateGroup.Transitions>
                                    <vsm:VisualTransition GeneratedDuration="0:0:.6"></vsm:VisualTransition>                                    
                                </vsm:VisualStateGroup.Transitions>
                            </vsm:VisualStateGroup>
                            
                            
                        </vsm:VisualStateManager.VisualStateGroups>

Sinon ton animation ne savait pas quelle propriété modifié, et , le controle qui subit l'animation ne se déclare pas dans la balise StoryBoard, car dans un storyboard, plusieurs controls peuvent être animé simultanément.

J'espère que tout cela pourra t'aider (chez moi ca marche une fois modifié)

Cdt,