Creating a clickable image in WPF

Question

I want to make a user control that shows an image and can invoke a command when clicked. Later I want to bind a list of these controls to a list of products.

Answer 1

Try this very straight forward approach

<Grid>
        <Button Height="50" Width="50">
            <Button.Template>
                <ControlTemplate>
                    <Image Source="yourimage.png"/>
                </ControlTemplate>
            </Button.Template>
        </Button>

    </Grid>

private void Button_Click(object sender, RoutedEventArgs e)
        {
           // do smt
        }

Answer 2

Well, after a little more fiddling, a simple button does the job. Here it is:

<Button Command="{Binding Path=DisplayProductCommand}" >
   <Image Source="..\Images\my-beautiful-product.jpg"/>
</Button>

Answer 3

There are several ways to do this, but one simple solution would be to use a button (maybe style away the border and background), and use the image as the content of the button.

You can later use a ListBox or similar, and override the DataTemplate to use the button and an image for each product.