Controllo immagine WPF con evento Click

Question

Desidero utilizzare uno <Image> nella mia applicazione WPF che risponde ai clic del mouse. Solo gli eventi "Mouse Up" e "Moue Down" sono disponibili immediatamente. Trovo questo piuttosto particolare. C'è un modo per estendere il controllo o un modo di usare un altro controllo per dare lo stesso effetto?

Answer 1

Per espandere la risposta di Shawn Mclean, una delle grandi capacità di WPF è la capacità di sfruttare il comportamento di un controllo cambiando completamente l'aspetto di tale controllo. Se si desidera creare un'immagine con un comportamento simile a un pulsante (completo di eventi di clic, associazione di comandi, assegnazione di pulsanti predefinita, ecc.) È possibile posizionare un'immagine in un pulsante di controllo e ripetere il comando per rimuovere il pulsante "chrome". Questo ti darà la bella API di un pulsante con l'aspetto che desideri. È possibile riutilizzare questo stile e questo approccio ridurrà la necessità di creare gestori di eventi nel codice sottostante se si dispone di comandi per eseguire il binding ai nuovi pulsanti dell'immagine.

Creare un tale stile è abbastanza semplice. Basta creare una nuova risorsa di stile con una chiave con nome in una risorsa e assegnare questa risorsa alla proprietà Style dei pulsanti. Ecco un esempio ho buttato insieme:

<Window 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
x:Class="ButtonStyleTestApp.MainWindow" 
x:Name="Window" 
Title="MainWindow" 
Width="640" Height="480"> 

<Window.Resources> 
    <Style x:Key="NoChromeButton" TargetType="{x:Type Button}"> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="1"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid x:Name="Chrome" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </Grid> 
        <ControlTemplate.Triggers>       
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Foreground" Value="#ADADAD"/> 
          <Setter Property="Opacity" TargetName="Chrome" Value="0.5"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources> 

<Grid x:Name="LayoutRoot" Background="#FF44494D"> 
    <Button Style="{DynamicResource NoChromeButton}" Click="ButtonClicked" > 
     <Image Source="Desert.png" Stretch="None"/> 
    </Button> 
</Grid> 
</Window> 

Answer 2

Utilizzare MouseUp. Non è possibile selezionare o mettere a fuoco il controllo Immagine in ogni modo, quindi questo è l'unico modo per fare clic.

Un'altra opzione è semplicemente mettere l'immagine in un pulsante e rimuovere tutti gli stili modificando il modello di controllo in modo che sembri solo un'immagine. In questo modo, puoi concentrarti su di esso usando la tastiera.

Answer 3

È possibile utilizzare un set di 4 gestori e 2 variabili booleane:

booleani:

1. IsClicked
2. IsEntered

gestori:

1. OnMouseDown- set IsClicked true;
2. OnMouseEnter- sets IsEntered true;
3. OnMouseLeave - set IsEntered false;
4. OnMouseUp - if (IsClicked & & IsEntered) {/ TODO your logic /} e quindi imposta IsClicked false;

Questa costruzione implementa la funzionalità del classico clic.

Answer 4

3. OnMouseLeave - anche impostato is isClicked su false; Altrimenti puoi fare clic con il mouse e rilasciare il mouse. Quindi fare clic con il mouse e rilasciare il mouse per fare comunque un clic.