Click here to Skip to main content
11,704,509 members (43,095 online)

Andrey A. Eroshenko asked:

Open original thread
Hello, all

i'm using WPF and MVVM pattern and I try to create closeable tabitem control. But my binded method CloseCommand on the button in template of the tabitem doesn't work. And works on any button in the window. I dont understand, why? Below code of the test project.

Thanks.

ViewModel
namespace CloseableTabControl.ViewModel
{
    public class CloseableTabControlVM
    {
        private RelayCommand _closeCommand;
        public ICommand CloseCommand
        {
            get {
                if (_closeCommand == null )
                _closeCommand = new RelayCommand(param => this.closeButton_Execute());
 
                return _closeCommand;
            }
        }
        
        private ObservableCollection<IPageBase> _pages;
 
        public ObservableCollection<IPageBase> Pages
        {
            get { return _pages; }
            set { _pages = value; }
        }
 

        public CloseableTabControlVM()
        {
            _pages = new ObservableCollection<IPageBase>();
            _pages.Add(new TabItem1VM());
            _pages.Add(new TabItem2VM());
            _pages.Add(new TabItem1VM());
        }
 
        private bool closeButton_canExecute() { return true; }
 
        private void closeButton_Execute() 
        {
            MessageBox.Show("Click me!");
        }
    }
}

Commands
namespace CloseableTabControl.Command
{
    public class RelayCommand : ICommand
    {
 
        #region Fields
        private readonly Predicate<object> _canExecute;
        private readonly Action<object> _execute;
        #endregion

        #region Constructor
        public RelayCommand(Action<object> execute):this(null, execute) { }
 
        public RelayCommand(Predicate<object> canExecute, Action<object> execute)
        {
            if (execute == null) throw new ArgumentNullException("execute");
            _execute = execute;
            _canExecute = canExecute;
        }
        #endregion

        [DebuggerStepThrough]
        public bool CanExecute(object param)
        {
            return _canExecute == null ? true : _canExecute(param); 
        }
 
        public void Execute(object param)
        {
            _execute(param);
        }
 
        public event EventHandler CanExecuteChanged
        {
            add { CommandManager.RequerySuggested += value; }
            remove { CommandManager.RequerySuggested -= value; }
        }
    }
}

MainWindow Code
namespace CloseableTabControl
{
    public partial class MainWindow : Window
    {
        private CloseableTabControlVM _closeTab;
        public CloseableTabControlVM CloseTab
        {
            get { return _closeTab; }
            set { _closeTab = value; }
        }
 
        public MainWindow()
        {
            _closeTab = new CloseableTabControlVM();
            InitializeComponent();
        }
    }
}

And MainVindow XAML
<Window x:Class="CloseableTabControl.MainWindow"
        x:Name="MainWindowInstance"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:v="clr-namespace:CloseableTabControl.View"
        xmlns:vm="clr-namespace:CloseableTabControl.ViewModel"
        DataContext="{Binding CloseTab,ElementName=MainWindowInstance}"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <DataTemplate DataType="{x:Type vm:TabItem1VM}">
            <v:TabItem1/>
        </DataTemplate>
        <DataTemplate DataType="{x:Type vm:TabItem2VM}">
            <v:TabItem2/>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <TabControl 
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Margin="10,10,10,10"
            Width="500"
            Height="300"
            ItemsSource="{Binding Pages}">
            <TabControl.ItemContainerStyle>
                <Style TargetType="TabItem">
                    <Setter Property="HeaderTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="{Binding Header}"/>
                                    <Button Content="x" Margin="0" Command="{Binding CloseCommand}" Width="16" Height="16"/>
                                </StackPanel>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </TabControl.ItemContainerStyle>
        </TabControl>
    </Grid>
</Window>
Tags: C#, WPF, MVVM

Preview



When answering a question please:
  1. Read the question carefully.
  2. Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
  3. If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Let's work to help developers, not make them feel stupid.
Please note that all posts will be submitted under the The Code Project Open License (CPOL).



Advertise | Privacy | Mobile
Web03 | 2.8.150819.1 | Last Updated 26 Mar 2009
Copyright © CodeProject, 1999-2015
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100