Discussion :

[m-mas]

Bonjour,

je débute en WPF, j'essai de faire une petite application avec un menu de module à gauche identique à celui de Outllook et à droite mon espace de travail selon le module choisi. Grâce à internet et quelques tutos sur les styles j'ai pu reproduire le menu Outllok, par contre je bloque sur quelques chose qui semble simple, comment ajouter l'évènement click à un tabitem ?

pour reproduire le menu outllok j'ai utilisé un TabControl ensuite j'ai modifié le style, et maintenant je veux quand je clique un module je charge un contrôle utilisateur correspondant à ce module dans l'espace de travail.

Pour simplifier, je donne le code avec un seul tabItem et sans donner le fichier application.xaml qui contient le style :

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
 
<Grid DockPanel.Dock="Left">
                <!--Définition des colonnes-->
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="200" MaxWidth="200" />
                    <ColumnDefinition Width="3" />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
 
                <GridSplitter Grid.Column="1" Background="Red" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" />
               <!-- Tab Contrôles des Modules-->
                <TabControl Grid.Column="0" VerticalAlignment="Stretch" Width="360" Height="Auto" MaxWidth="200"
                            Style="{DynamicResource OutlookTabControlStyle}" 
                            BorderBrush="#FF6593CF" HorizontalAlignment="Left" BorderThickness="1,1,1,0">
                    <!--Paramètrage FDT-->
                    <TabItem x:Name="ParametrageFDT" Height="30" ButtonBase.Click="M_Param_Click" 
                             Style="{DynamicResource OutlookTabItemStyle}" 
                             Background="{DynamicResource OutlookButtonBackground}" 
                             Foreground="{DynamicResource OutlookButtonForeground}">
                        <TabItem.Header>
                               <StackPanel Orientation="Horizontal">
                                    <Image Name="img" Height="auto" Width="auto" Source="/WPF_Onward_Designer;component/Images/param.png" />
                                    <TextBlock Text="Paramètrage" Margin="4,0,0,0" VerticalAlignment="Center" />
                                </StackPanel>
                        </TabItem.Header>
                        <Grid/>
                    </TabItem>
...

et puis avec visual studio je lui dis de générer l'évènement et ça me donne :

Code vb.net :

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

1
2
3
4
 
Private Sub M_Param_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
        Me.LabDivers.Content = "Paramètrage"
    End Sub

Merci pour votre aide !

[m-mas]

j'ai trouvé une solution que je n'aime pas beaucoup est de tout mettre dans mon espace de travail et de jouer sur la visibilité de mes contrôles utilisateur en fonction du module sélectionné en utilisant l'évènement "RequestBringIntoView"

[koyot3]

Salut,

Pour ton problème je passerais par un datatemplate et un container qui chargera automatiquement le contenu...

En gros tu définis tes usercontrols (un pour l'item courrier, un pour l'agenda et tout les autres nécessaire pour faire ton Outlook "maison")
Tu les références comme datatemplate dans les ressources de ta page

Code xml :

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

1
2
3
4
5
6
7
<Window.Resources>
	<DataTemplate x:Key="uc1">
		<local:UserControl1/>
	</DataTemplate>
	<DataTemplate x:Key="uc2">
		<local:UserControl2/>
	</DataTemplate>

Et tu utilise un ContentControl pour les afficher en fonction de la valeur de l'index sélectionné sur ton tabControl :

Code xml :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<ContentControl>
<ContentControl.Style>
	<Style TargetType="ContentControl">
		<Style.Triggers>
			<DataTrigger Binding="{Binding SelectedIndex, ElementName=tabcontrol}" Value="0">
				<Setter Property="ContentTemplate" Value="{StaticResource uc1}"/>
			</DataTrigger>
			<DataTrigger Binding="{Binding SelectedIndex, ElementName=tabcontrol}" Value="1">
				<Setter Property="ContentTemplate" Value="{StaticResource uc2}"/>
			</DataTrigger>
		</Style.Triggers>
	</Style>
</ContentControl.Style>
</ContentControl>

Et normalement tu n'as pas besoin de gérer l'évènement click sur tes tab...

Bonne soirée

[m-mas]

Merci Koyot3, je vais essayer ceci et vous dire