在WPF中创建可点击的图像

Question

我想要创建一个用户控件，用来显示图片并在被点击时触发一个命令。 随后，我希望将一组这样的控件绑定到一组产品。

- mico

Answer 1

尝试这个非常直接的方法

<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
        }

- GibboK

---

这是我见过的最直接的方法，而不必覆盖按钮的所有视觉样式。 - jrandomuser

我选择了这种方法，但可重用性被抛到了窗外，因为你实际上是在硬编码图像名称。但是，它符合我的需求。 - Lynn Crumbling

@jrandomuser，请看我的回答。 - Khalil Khalaf

好的，但没有悬停图像？它在这里不像一个真正的按钮。 - Phil

Answer 2

好的，经过一些调整后，一个简单的按钮能够完成任务。以下是它的代码：

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

- mico

---

这不是一个可点击的图像，而是一个内部带有图像的按钮。我对这被标记为接受答案感到困惑。这个 应该是被接受的答案。 - Alex

Answer 3

有几种方法可以做到这一点，但一个简单的解决方案是使用按钮（也许将边框和背景样式去掉），并将图像作为按钮的内容。

您可以稍后使用ListBox或类似控件，并覆盖DataTemplate以使用按钮和每个产品的图像。

- code-zoop

---

这实际上是我采取的第一条路线，但我想知道是否有更清晰的解决方案。 - mico

Answer 4

   <Image Name="imageFoo" Source="/AppFoo;component/Foo.png" Width="32" Cursor="Hand" MouseUp="imageFoo_MouseUp"/>

    private void imageFoo_MouseUp(object sender, MouseButtonEventArgs e)
    {
        //Do something
    }

- Hong

---

抱歉，Mico，我没有完全理解你的要求。我还是留下我的答案，以防有人需要快速获得可点击的图像。 - Hong

Answer 5

我不知道你们怎么想，但是PreviewMouseDown和TouchUp与我的绑定完全正常：

<Image x:Name="bla" Source="{Binding blabla}" ... TouchDown="bla_TouchDown" PreviewMouseDown="bla_PreviewMouseDown">

我正在使用VS 2015

- Khalil Khalaf