WPF Path Command

Question

So I have successfully implemented a button click with a custom background. Here is the xaml:

<Button 
    HorizontalAlignment="Left" 
    Grid.Row="0" 
    Grid.Column="0" 
    Command="{Binding PreferencesClickedCmd}"
    >
    <Path 
        Data="..." 
        Stretch="Uniform" 
        Fill="#FF070707" 
        Width="16" 
        Height="16" 
        Margin="0,0,0,0" 
        RenderTransformOrigin="0.5,0.5"
        >
        <Path.RenderTransform>
            <TransformGroup>
                <TransformGroup.Children>
                    <RotateTransform Angle="0" />
                    <ScaleTransform ScaleX="1" ScaleY="1" />
                </TransformGroup.Children>
            </TransformGroup>
        </Path.RenderTransform>
    </Path>
</Button>

Now, is there a way to implement a click command with MVVM on Path object itself. What I am looking for to have only an icon portion to be clickable (with no help of button object). With button, the entire generated background rectangle can be clicked in order to trigger an event for the Path.

Answer 1

As per Brandley suggestion, here is how I managed to implement it with minimal coding changes. I set the button size to match icon size, set the background to transparent and border width to 0:

<Button HorizontalAlignment="Left" Grid.Row="0" Grid.Column="0" Margin="5,0,0,0" Width="30" Height="30" BorderThickness="0"  Background="Transparent" Command="{Binding PreferencesClickedCmd}">
            <Path Data="..." Stretch="Uniform" Fill="#FF070707" Width="16" Height="16" Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5">
                <Path.RenderTransform>
                    <TransformGroup>
                        <TransformGroup.Children>
                            <RotateTransform Angle="0" />
                            <ScaleTransform ScaleX="1" ScaleY="1" />
                        </TransformGroup.Children>
                    </TransformGroup>
                </Path.RenderTransform>
            </Path>
        </Button>

Answer 2

If you want only the filled Path area to be clickable, this will work (just swap in your own Path, transform, etc. stuff):

<Button
    Command="{Binding PreferencesClickedCmd}"
    >
    <Button.Content>
        <Path Data="M 8,0 L 0,16 L 16,0 Z" Fill="SlateBlue" />
    </Button.Content>
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <ContentPresenter />
        </ControlTemplate>
    </Button.Template>
</Button>

The entire visual presentation of the button is replaced by just the content alone, and the parts of the button that aren't filled by the path are not clickable because they're transparent.

If you want the whole thing to be clickable, just give the template a background that's not quite transparent:

<ControlTemplate TargetType="Button">
    <Grid Background="#01ffffff">
        <ContentPresenter />
    </Grid>
</ControlTemplate>

This is the MVVM Way of Doing Things: Button provides a Click event, and Command property, and some visual stuff; if all you want is the Click event and the Command Property, don't roll your own click event; use those parts of the Button while discarding the visual stuff.