Question

I have made a custom control in wpf however I am having an issue with the button that forms a part of the item control (the x in each item element in the attached picture is the button) basically the button is disabled, but I am not disabling it!

If I just place one of the inner items (MultiSelectionItem) into a grid by itself then the button works fine, so it must have something to do with my usage of the ItemsControl element in the Template for the outer control (MultiSelectionBox)

Image:

<Style TargetType="{x:Type local:MultipleSelectionBox}">
 <Setter Property="Template">
  <Setter.Value>
    <ControlTemplate TargetType="{x:Type local:MultipleSelectionBox}">
      <Border Background="{TemplateBinding Background}"
              BorderBrush="{TemplateBinding BorderBrush}"
              BorderThickness="{TemplateBinding BorderThickness}">
        <ItemsControl ItemsSource="{Binding multipleSelectionItems}">
          <ItemsControl.Template>
            <ControlTemplate>
              <WrapPanel IsItemsHost="True"/>
            </ControlTemplate>
          </ItemsControl.Template>
        </ItemsControl>
      </Border>
    </ControlTemplate>
  </Setter.Value>
 </Setter>
</Style>

 <Style TargetType="{x:Type local:MultipleSelectionItem}">
<Setter Property="Template">
  <Setter.Value>
    <ControlTemplate TargetType="{x:Type local:MultipleSelectionItem}">
      <Border BorderBrush="#FFC0CBD9" BorderThickness="1" Margin="0,0,2,2" CornerRadius="0">
        <Border.Style>
          <Style TargetType="Border">
            <Style.Triggers>
              <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background">
                  <Setter.Value>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                      <GradientStop Color="#FFDFE9F5" Offset="0" />
                      <GradientStop Color="#FFEEF3FC" Offset="1" />
                    </LinearGradientBrush>
                  </Setter.Value>
                </Setter>
              </Trigger>
            </Style.Triggers>
          </Style>
        </Border.Style>
        <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
          <Grid.ColumnDefinitions>
            <ColumnDefinition Width="20" />
            <ColumnDefinition Width="*" />
          </Grid.ColumnDefinitions>
          <Button Command="{x:Static local:MultipleSelectionItemCommands.RemoveCommand}" IsEnabled="True">
            <Button.Template>
              <ControlTemplate>
                <Image Source="/CustomFormResearch;component/Images/x_no_hover.jpg" Margin="2,0,0,0" Height="11" Width="11">
                  <Image.Style>
                    <Style TargetType="{x:Type Image}">
                      <Setter Property="Source" Value="/CustomFormResearch;component/Images/x_no_hover.jpg" />
                      <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                          <Setter Property="Source" Value="/CustomFormResearch;component/Images/x_with_hover.jpg" />
                        </Trigger>
                      </Style.Triggers>
                    </Style>
                  </Image.Style>
                </Image>
              </ControlTemplate>
            </Button.Template>
          </Button>
          <TextBlock Text="{Binding DisplayData}" VerticalAlignment="Stretch" Margin="5,0,5,0" Grid.Column="1" />
        </Grid>
      </Border>
    </ControlTemplate>
  </Setter.Value>
</Setter>
</Style>

Answer 1

My first guess is that since your button is bound to a Command, the CanExecute of the command should return false.

This is the principle and benefit of a Command: When the can execute returns false it automaticaly disable the associated button.

Check this links for more about commands and MVVM :

http://msdn.microsoft.com/en-us/magazine/dd419663.aspx

http://msdn.microsoft.com/fr-fr/magazine/cc785480.aspx#id0190094