Hi I wish to zoom to image to specific point with animation, and it does not work.
XAML:
<Window x:Class="AnimationTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="720" Width="1280">
<Grid>
<Image Height="681" HorizontalAlignment="Left" Name="image1" Stretch="None" VerticalAlignment="Top" Width="1258" Source="/AnimationTest;component/Images/world.jpg" />
<Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="1171,12,0,0" Name="button1" VerticalAlignment="Top" Width="75" Click="button1_Click" />
</Grid>
</Window>
CS:
namespace AnimationTest
{
public partial class MainWindow: Window
{
public MainWindow()
{
InitializeComponent();
}
private void button1_Click(object sender, RoutedEventArgs e)
{
DoubleAnimation da = new DoubleAnimation();
da.From = 0;
da.To = 1000;
da.Duration = new Duration(TimeSpan.FromSeconds(1));
image1.BeginAnimation(ScaleTransform.CenterXProperty, da);
}
}
}
i have created simple sample for your requirement.use RenderTransformOrigin to scale to your image from centerpoint(0.5,0.5)
XAML
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Slider x:Name="zoomSlider" Minimum="0" Maximum="10" Value="1" />
<Image Source="Jellyfish.jpg" Grid.Row="1">
<Image.RenderTransform>
<ScaleTransform ScaleX="{Binding ElementName=zoomSlider,Path=Value}" ScaleY="{Binding ElementName=zoomSlider,Path=Value }"/>
</Image.RenderTransform>
</Image>
</Grid>
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.