How can I make an image inside button to make it bigger when I click it using Width
and Height
.
My Button XAML code is this:
<Button x:Name="Input2" Grid.Row="0" MouseEnter="Input2_MouseEnter" MouseLeave="Input2_MouseLeave" Click="Input2_Click" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}">
<Button.Template>
<ControlTemplate>
<Border HorizontalAlignment="Center" VerticalAlignment="Center" >
<Image Source= "C:\input.png"
Width="40"
Height="40"/>
</Border>
</ControlTemplate>
</Button.Template>
</Button>
Input2.Height
- Change the size of the button, not the image inside it.
My C# code:
private void Input2_Click(object sender, RoutedEventArgs e)
{
// What to do here?
}
Instead of attaching a Click event handler, better use a Trigger on the Button's IsPressed
property:
<Button>
<Button.Template>
<ControlTemplate TargetType="Button">
<Border>
<Image x:Name="image" Width="40" Height="40" Source="C:\input.png"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="image" Property="Width" Value="50"/>
<Setter TargetName="image" Property="Height" Value="50"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
</Button>
The simplest solution will be to add x:Name="input2Image" to the Image element, and enlarge the image using that name, like that:
<Button x:Name="Input2" Grid.Row="0" MouseEnter="Input2_MouseEnter" MouseLeave="Input2_MouseLeave" Click="Input2_Click" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}">
<Button.Template>
<ControlTemplate>
<Border HorizontalAlignment="Center" VerticalAlignment="Center" >
<Image x:Name="Input2Image" Source= "C:\input.png"
Width="40"
Height="40"/>
</Border>
</ControlTemplate>
</Button.Template>
And:
private void Input2_Click(object sender, RoutedEventArgs e)
{
this.Input2Image.Height = 80;
this.Input2Image.Width = 80;
}
This should work, but you might consider start using Bindings and the MVVM pattern, to maximize the power of WPF.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.