CODEWITHSUNDEEP
c#wpfxaml
Dark Knight
Dark Knight

Reputation: 3577

Button inside Usercontrol not firing properly in WPF

I have a Image buttton kind of usercontrol, which has two textblocks and an image inside button, but button is firing click only when I click on textblock or image part. just to do quick debug I have set button's cursor to Hand, strangely its showing Hand cursor only when mouse is over texblocks/Image but not on any part of the button. Here is my code

             Name="Tiles" Background="Green"
         d:DesignHeight="300" d:DesignWidth="300" Margin="10,10,10,10">
<UserControl.Resources>
    <BooleanToVisibilityConverter x:Key="booleanVisibleConverter" />
    <!-- This style is used for buttons, to remove the WPF default 'animated' mouse over effect -->
    <Style x:Key="ImgBtnStyle" TargetType="{x:Type Button}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate x:Name="ImgBtnStyle" TargetType="{x:Type Button}">
                    <Border Name="border" 
                        BorderThickness="1"
                        Padding="0" 
                        BorderBrush="DarkGray" 
                        CornerRadius="1" 
                        Background="{TemplateBinding Background}">
                        <ContentPresenter  />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="border" Property="BorderBrush" Value="White" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>

<Button Cursor="Hand" Style="{StaticResource ImgBtnStyle}" Command="{Binding TestClick, ElementName=Tiles}" CommandParameter="{Binding ElementName=Tiles, Path=TestName}" >
    <Grid >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="1*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="1*"/>
        </Grid.RowDefinitions>
        <TextBlock Text="{Binding ElementName=Tiles, Path=ResultValue}" Style="{StaticResource txtblck}" Grid.Column="1" Grid.Row="1"/>
        <TextBlock Text="{Binding ElementName=Tiles, Path=TestName}" Style="{StaticResource txtblck}" Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" VerticalAlignment="Bottom" TextAlignment="Left" Padding="5,0,0,5"/>
        <Image Source="/resources/Icons/tickBlack.png" Grid.Column="2" HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" 
               Visibility="{Binding Path= TestDone, ElementName=Tiles, Converter={StaticResource booleanVisibleConverter}}"/>
    </Grid>
</Button>

Upvotes: 1

Views: 408

Answers (1)

AnjumSKhan
AnjumSKhan

Reputation: 9827

Set Grid's Background to Transparent like below : 

<Button Cursor="Hand" Style="{StaticResource ImgBtnStyle}" Command="{Binding TestClick, ElementName=Tiles}" CommandParameter="{Binding ElementName=Tiles, Path=TestName}" >
        <Grid Background="Transparent">
            ...
 </Button>

I made above changes and it worked fine for me.

Upvotes: 1

Related Questions