开发者

Closing TabItem by clicking middle button

I have a problem. In my WP开发者_StackOverflowF application, if i press a tabItem with middle mouse button, this tabItem should close. Just like in FireFox. But I try to do this using MVVM, and i need to use commands. Also my tabItems are created dynamically. Help me plz! Thank you!


Create a DataTemplate for your tab items like this:

<DataTemplate x:Key="ClosableTabTemplate">
  <Border>
    <Grid>
      <Grid.InputBindings>
         <MouseBinding Command="ApplicationCommands.Close" Gesture="MiddleClick" />
      </Grid.InputBindings>
      <!-- the actual contents of your tab item -->
    </Grid>
  </Border>
</DataTemplate>

In your application window, add a the close command

<Window.CommandBindings>
    <CommandBinding Command="ApplicationCommands.Close" Executed="CloseCommandExecuted" CanExecute="CloseCommandCanExecute" />
</Window.CommandBindings>

and finally assign the data template as item template to your tab control.


You could add a MouseBinding to some InputBindings perhaps?


Closing a TabItem (Not Selected) - TabControl

<TabControl x:Name="TabControlUser" ItemsSource="{Binding Tabs}" Grid.RowSpan="3">
                <TabControl.Resources>
                    <Style TargetType="TabItem">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="TabItem">
                                    <Border Name="Border" BorderThickness="1,1,1,0" BorderBrush="Gainsboro" CornerRadius="4,4,0,0" Margin="2,0">
                                        <ContentPresenter x:Name="ContentSite"
                                    VerticalAlignment="Center"
                                    HorizontalAlignment="Center"
                                    ContentSource="Header"
                                    Margin="10,2"/>
                                    </Border>
                                    <ControlTemplate.Triggers>
                                        <Trigger Property="IsSelected" Value="True">
                                            <Setter TargetName="Border" Property="Background" Value="LightSkyBlue" />
                                        </Trigger>
                                        <Trigger Property="IsSelected" Value="False">
                                            <Setter TargetName="Border" Property="Background" Value="GhostWhite" />
                                        </Trigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </TabControl.Resources>
                <TabControl.ItemTemplate>
                    <!-- this is the header template-->
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding Header}" FontWeight="ExtraBold" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                            <Image Source="/Images/RedClose.png" Width="22" Height="22" MouseDown="Image_MouseDown" HorizontalAlignment="Right" Margin="10 0 0 0"/>
                        </StackPanel>
                    </DataTemplate>
                </TabControl.ItemTemplate>
                <TabControl.ContentTemplate>
                    <!-- this is the body of the TabItem template-->
                    <DataTemplate>
                        <UserControl Content="{Binding UserControl, UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
                    </DataTemplate>
                </TabControl.ContentTemplate>
            </TabControl>

C# Code - Image MouseDown Click Event

try
        {
            int matches = 0;
            DependencyObject dependency = (DependencyObject)e.OriginalSource;
            // Traverse the visual tree looking for TabItem
            while ((dependency != null) && !(dependency is TabItem))
                dependency = VisualTreeHelper.GetParent(dependency);
            if (dependency == null)
            {
                // Didn't find TabItem
                return;
            }
            TabItem selectedTabItem = dependency as TabItem;
            var selectedTabContent = selectedTabItem.Content as MainWindowViewModel.TabItem;
            foreach (var item in MainWindowViewModel.Tabs)
            {
                if (item.Header == selectedTabContent.Header)
                {
                    matches = MainWindowViewModel.Tabs.IndexOf(item);
                }
            }
            MainWindowViewModel.Tabs.RemoveAt(matches);
        }
        catch (Exception ex)
        {
            System.Windows.Application.Current.Dispatcher.Invoke((System.Action)(() => new View.MessageBox(ex.Message).ShowDialog()));
        }

This event finds with the exact Mouse clicked position (as TabItem)and this will remove MainWindowViewModel.Tabs.RemoveAt(matches); the TabItem(even if it is not selected).

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜