Discussion :

[Rodrigue]

Bonjour,

Je souhaiterais créer un composant de type "dropdown button" qui possèderait les caractéristiques suivantes:
- à l'état de repos, l'info affichée n'est qu'un texte
- lorsqu'on clique dessus une liste d'information à sélectionner possédant 2 colonnes est affichée. Un seul élément peut être sélectionné à la fois
- le "dropdown button", l'extérieur du bouton ne s'affiche que lorsqu'on passe la souris dans sa zone.

J'ai déjà développé d'autres composants mais jamais en "silverlight".
Je connais bien les différents évènements à gérer (mouseenter, mouseleave, etc.) Je me demande surtout comment faire le popup...

Pourriez-vous m'aider svp?

[Thomas Lebrun]

Tu peux déjà regarder ici, pour commencer: http://broux.developpez.com/articles...s-silverlight/

[Samuel Blanchard]

Bonjour,

Est-ce d'un SplitButton dont tu parles ?

http://blogs.msdn.com/b/delay/archiv...f-support.aspx

Si ce n'est pas le cas tu as quand même les sources qui montrent comment utiliser un MenuContext.

[Rodrigue]

Presque . Même si la lecture du code est assez intéressante, je n'arrive pas le compiler! En effet, le compilo me dit:

Le type ou le nom d'espace de noms 'ContextMenu' est introuvable (une directive using ou une référence d'assembly est-elle manquante*?) C:\Documents and Settings\xxx\Bureau\splitbutton\SplitButton\SplitButton.cs 32 17 SplitButton

le contextmenu est défini dans system.windows.forms
Je ne peux pas l'ajouter aux références de mon projet.

Peut-être est-ce parce que j'utilise visual 2010 web express ?

Merci!

Bonjour,

Est-ce d'un SplitButton dont tu parles ?

http://blogs.msdn.com/b/delay/archiv...f-support.aspx

Si ce n'est pas le cas tu as quand même les sources qui montrent comment utiliser un MenuContext.

[Rodrigue]

Faut-il que j'installe le Silverlight tookit?
http://silverlight.codeplex.com/

N'est-ce pas dédié aux smartphones?

[Rodrigue]

Je confirme ça fonctionne. Il fallait bel et bien installer le "silverlight toolkit april 2010" sur codeplex.
Si quelqu'un veut observer les contrôles et les thèmes (11) disponibles, il peut aller ici:
http://silverlight.net/content/sampl...n/default.html

Bon, je ne vous lâche pas! Je vais essayer d'implémenter mon contrôle

[Rodrigue]

Bon désolé pour cette suite d'auto-réponse (peut-être que ça en aidera d'autres...) mais en fait xaml c'est génial!

Donc, j'ai créé les fameux composants splitbutton et menubutton et en fait, il n'y a pas vraiment besoin de les modifier (enfin si mais j'y reviendrai à la fin). Il suffit juste d'associer à l'objet ButtonMenuItemsSource tout ce que l'on souhaite: image, itemmenu, textbox, treeview, etc. et ce même mélangé!!!
Voici un petit exemple:

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
<splitButton:MenuButton Canvas.Left="179" Canvas.Top="78" Content="Button" Height="52" Name="menuButton1" Width="103">
            <splitButton:MenuButton.ButtonMenuItemsSource>
                <Image Canvas.Left="86" Canvas.Top="220" Height="99" Name="image1" Stretch="Uniform" Width="136" Source="/SplitButtonSample;component/Images/9DE0039E.jpg" />
                <sdk:TreeView Canvas.Left="61" Canvas.Top="260" Height="117" Name="treeView1" Width="130">
                    <sdk:TreeViewItem Header="a">
                        <sdk:TreeViewItem Header="1" />
                        <sdk:TreeViewItem Header="2" />
                    </sdk:TreeViewItem>
                    <sdk:TreeViewItem Header="b">
                        <sdk:TreeViewItem Header="alpha" />
                    </sdk:TreeViewItem>
                    <sdk:TreeViewItem Header="c" />
                </sdk:TreeView>
                <Slider Canvas.Left="91" Canvas.Top="251" Height="26" Name="slider1" Width="185" />
            </splitButton:MenuButton.ButtonMenuItemsSource>
        </splitButton:MenuButton>
        <splitButton:SplitButton Canvas.Left="69" Canvas.Top="168" Content="Button" Height="27" Name="splitButton1" Width="130" />

J'affiche dans le contextmenu, une image, un treeview et un slider... Pour moi qui ait commencé à la dur, je peux vous dire que c'est vraiment facile !

Maintenant, oui je sais j'en demande trop, serait-il possible que lorsque ma souris n'est pas au-dessus du Button, le contour de celui-ci ne s'affiche pas? Il n'y aurait que le texte d'affiché...

Merci

[Samuel Blanchard]

Il faut redefinir le Template de ton SplitButton et lui rendre son bord invisible lors du passage de la souris. Vu que tu as les sources du SplitButton ça devrait pas être trop compliqué

[Skyounet]

Il faut redefinir le Template de ton SplitButton et lui rendre son bord invisible lors du passage de la souris. Vu que tu as les sources du SplitButton ça devrait pas être trop compliqué

Je rajouterai : En utilisant les VisualStates.

[Rodrigue]

Désolé, j'ai essayé de me servir des visualstates mais sans succès

J'ai déclaré au début du composant:

Code :

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

[TemplateVisualState(Name = "VSMouseLeave", GroupName = "ValueStates")]

Dans ma fonction OnMouseLeave, j'ai ajouté l'appel au VisualStateManager:

Code :

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

1
2
3
4
5
6
private void SplitElement_MouseLeave(object sender, MouseEventArgs e)
        {
            IsMouseOverSplitElement = false;
 
            VisualStateManager.GoToState((SplitButton)sender, "VSMouseLeave", true); 
        }

Je câle dans le xaml. Je ne sais pas vraiment ce que je dois déclarer :

Code :

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

1
2
3
4
5
<VisualState x:Name="VSMouseLeave">
                                    <Storyboard>
 
                                    </Storyboard>
                                </VisualState>

J'ai essayé de m'appuyer sur le code suivant: http://samples.msdn.microsoft.com/si...urcewindow.htm

[Rodrigue]

En fait j'ai rajouté au generic.xaml du composant, la section suivante:

Code :

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

1
2
3
4
5
6
7
<VisualStateGroup x:Name="ValueStates">
                                <VisualState x:Name="VSMouseLeave">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" Storyboard.TargetName="Background" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="#00FFFFFF"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>

dans le visualstatemanager mais il semblerait que ça n'ait aucun effet

[Skyounet]

Quel est le retour de la méthode GoToState (true ou false) ?