2010-04-27 5 views
16

이미지를 표시하고 클릭하면 명령을 호출 할 수있는 사용자 정의 컨트롤을 만들고 싶습니다. 나중에 이러한 컨트롤 목록을 제품 목록에 바인딩하려고합니다.WPF에서 클릭 가능한 이미지 만들기

답변

44

내 바인딩과 함께

내가 너희들 모르는
<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 
     } 
+2

이것은 단추의 모든 시각적 스타일을 재정의하지 않고도 내가 본 가장 직선적 인 접근 방식입니다. – jrandomuser

+1

이 방법을 사용했지만 이미지 이름을 효과적으로 하드 코딩 했으므로 재사용 가능성이 사라졌습니다. 그러나, 그것은 나의 필요에 맞습니다. –

+0

@jrandomuser 내 대답을 참조하십시오. –

4

이렇게하는 데는 여러 가지 방법이 있지만 한 가지 간단한 해결책은 단추를 사용하여 (테두리와 배경의 스타일을 지정) 이미지를 단추의 내용으로 사용하는 것입니다.

나중에 ListBox 또는 유사하게 사용할 수 있으며 DataTemplate을 재정 의하여 각 제품의 단추 및 이미지를 사용할 수 있습니다.

+0

이것은 사실 제가 취한 첫 번째 경로입니다.하지만 더 깨끗한 해결책이 있는지 궁금합니다. – mico

+0

코드에 대한 내 대답보기 – mico

8

글쎄, 조금 더 손을 떼면 간단한 버튼이 작동합니다. 여기있다 :

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

이것은 클릭 할 수있는 이미지가 아니며 이미지가있는 버튼입니다. 나는 이것이 받아 들여진 대답으로 표시되어 당황 스럽다. [This] (http://stackoverflow.com/a/21597209/161250) 허용 된 대답이어야합니다. – Alex

3
<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 
    } 
+0

XAML – mico

+3

에 정의 된 ICommand를 호출하지 않습니다. 사용자의 요구 사항을 완전히 이해하지 못해서 미안합니다. 누군가가 클릭 가능한 이미지를 빠르게 얻을 필요가있을 때를 대비하여 거기에 내 대답을 남겨 둡시다. – Hong

1

하지만 PreviewMouseDownTouchUp가 완전히 잘 작동이 매우 정직하고 접근을 시도

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

VS 2015