Reputation: 23
I'm am trying to animate a box width to extend in both left and right direction. Of course it's only extending in the right direction, how would I have it extend in both. Most WPF codes are in C# so I can't really find an answer from Google.
Imports System.Windows.Media.Animation
Class MainWindow
Private Sub EnlargeBtn_Click(sender As Object, e As RoutedEventArgs) Handles EnlargeBtn.Click
Dim NewWidth = 300
Dim widthAnimation As New DoubleAnimation(NewWidth, TimeSpan.FromMilliseconds(1000))
Box.BeginAnimation(WidthProperty, widthAnimation)
End Sub
End Class
Upvotes: 1
Views: 118
Reputation: 23
Figured it out, had to set the HorizontalAlignment
to Center
and move the left and right margins by half the width
Imports System.Windows.Media.Animation
Class MainWindow
Private Sub EnlargeBtn_Click(sender As Object, e As RoutedEventArgs) Handles EnlargeBtn.Click
Dim NewWidth = 300
Dim widthAnimation As New DoubleAnimation(NewWidth, TimeSpan.FromSeconds(1))
Dim marginAnimation As New ThicknessAnimation(New Thickness(Box.Margin.Left - NewWidth / 2, Box.Margin.Top, Box.Margin.Right - NewWidth / 2, 0), TimeSpan.FromSeconds(1))
Box.BeginAnimation(WidthProperty, widthAnimation)
Box.BeginAnimation(MarginProperty, marginAnimation)
End Sub
End Class
Upvotes: 0
Reputation: 137148
You need to animate the left position as well as the width.
If you can change the left position you'll need to change the width by twice the amount you're changing the left property by to get the box to grow uniformly in both directions.
If you can't change the left or X property of a Rectangle
(because it doesn't appear to have one you can access - MSDN) then the only solution might be to put it inside another container (a Grid or Border) and set it's HorizontalAlignment
to Center
.
Upvotes: 2