Un seul ToggleButton actif à la fois

Version imprimable

05/06/2009, 12h06
Arnard

Un seul ToggleButton actif à la fois

Bonjour,

j'ai une série de ToggleButton, et je souhaite qu'un seul à la fois puisse être marqué comme actif.

Ya la solution barbare : on parcourt tous les TB, on passe IsChecked à false, et on laisse le programme suivre son cours mais :
- c'est pas vraiment élégant
- cela devient compliqué à gérer lors du 2e clic pour désélectionner le bouton.

Y a-t-il un moyen de grouper le comportement de ces boutons ?

Merci
05/06/2009, 13h16
Thomas Lebrun

Tu prend une ListBox donc tu modifies le Template des éléments (ItemTemplate) pour les faire s'afficher sous forme de ToggleButton. Pour savoir celui qui est actif, tu fais un Binding sur la propriété IsChecked de ton bouton et la propriété IsSelected de ta ListBox ;)

Bon, apparemment je ne suis pas encore douée avec les binding.

Je tente de faire ta suggestion de cette manière :

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
<ListBox x:Name="listButtonPlayer" SelectionChanged="listButtonPlayer_SelectionChanged">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel IsItemsHost="True" Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBoxItem IsSelected="{Binding Source=Button_Player_PlayBack, Path=IsChecked, Mode=TwoWay}">
                <ListBoxItem.Template>
                    <ControlTemplate>
                        <ToggleButton x:Name="Button_Player_PlayBack" Margin="5,10,5,10" Click="ToggleButton_Player_Click" ToolTip="Lecture arrière" Unchecked="Button_Player_Unchecked">
                            <Image Source="{StaticResource IMG_Player_PlayBack}" />
                        </ToggleButton>
                    </ControlTemplate>
                </ListBoxItem.Template>
            </ListBoxItem>
            <ListBoxItem IsSelected="{Binding Source=Button_Player_Play, Path=IsChecked, Mode=TwoWay}">
            <ListBoxItem.Template>
                <ControlTemplate>
                    <ToggleButton x:Name="Button_Player_Play" Margin="5,10,5,10" Click="ToggleButton_Player_Click" ToolTip="Lecture" Unchecked="Button_Player_Unchecked">
                        <Image Source="{StaticResource IMG_Player_Play}" />
                    </ToggleButton>
                </ControlTemplate>
            </ListBoxItem.Template>
        </ListBoxItem>
        </ListBox>

Bien sûr, c'est comme si le binding était inopérant, je peux sélectionner les deux boutons...

Salut,

Pour binder la propriété IsChecked du ToggleButton à la propriété IsSelected du ListBoxItem :

Code:

1
2
3
4
5
6
          <ListBoxItem IsSelected="True" >
            <ToggleButton IsChecked="{Binding RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}}, Path=IsSelected}" />
          </ListBoxItem>
          <ListBoxItem>
            <ToggleButton IsChecked="{Binding RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}}, Path=IsSelected}" />
          </ListBoxItem>

Tu peux améliorer en utilisant un template sur les items de la listBox comme Thomas l'a dit ;).

05/06/2009, 15h45
Arnard

Tout de suite ça marche mieux ^^

Mais pourquoi mon code ne fonctionne pas, alors que j'ai précisé le mode TwoWay ?
05/06/2009, 19h26
Thomas Lebrun

Citation:

Envoyé par Arnard

Mais pourquoi mon code ne fonctionne pas, alors que j'ai précisé le mode TwoWay ?

Parce que ton controle ne peut pas se lier à un contrôle qui fait parti de son Visual Tree (Control Template)

ok, on peut mapper vers les ascendants mais pas vers les descendants.

Bon ça marche comme je veux, reste à affiner la couleur de fond de l'item sélectionné. Je dois manipuler la propriété Background de l'item sélectionné ? Ou ya une autre ruse ? xD

Edit

Bon, je tente de jouer avec le style avec le code suivant, mais ce n'est pas fonctionnel :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <Style x:Key="StyleItemBackground" TargetType="{x:Type ListBoxItem}"> <Style.Triggers> <DataTrigger Value="True" Binding="{Binding Path=IsSelected,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ListBoxItem}}}"> <DataTrigger.Setters> <Setter Property="Background"> <Setter.Value> <SolidColorBrush Color="Aqua" /> </Setter.Value> </Setter> </DataTrigger.Setters> </DataTrigger> </Style.Triggers> </Style>
Et après je fais un

Code:

<ListBoxItem Style="{StaticResource StyleItemBackground}">

08/06/2009, 11h29
Thrud
Tu peux aussi juste redéfinir la couleur de l'item selectionné dans la listbox
Code:

1 2 3 4 5 6 <ListBox.Resources> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Aqua" /> </ListBox.Resources>
Edit: Arf, trop rapide Thomas...
08/06/2009, 11h38
Arnard

J'étais parti de là avec un résultat probant : http://msdn.microsoft.com/fr-fr/library/ms750821.aspx

Mais j'avoue que votre est très séduisante, je me rappellerai des SystemColors pour la prochaine fois.

Merci à tous :)