CODEWITHSUNDEEP
wpfxamlresourcedictionaryrendertransform
user3096803
user3096803

Reputation:

How does one stop elements from overlapping during and after a scaletransform animation in WPF?

I have a ListBox that has items with a RenderTransform based on a Style.Triggers attribute with storyboard animation including a scaletransform of x 1.5 and y 1.5. The result is hideous, and I am looking for a way to get the items to stop overlapping as they do in the image below.

The horrible animation effect on the regions that the ListBoxItems occupy.

Upvotes: 1

Views: 560

Answers (2)

Borislav Ivanov
Borislav Ivanov

Reputation: 5379

The RenderTransform is applied after the layout is done - meaning that the sizes and positions of the UI elements are already computed. Applying the transform at this point won't move the surrounding elements.

Instead, you could set the transform to the LayoutTransform property - then the transform will be applied during the layout pass.

Upvotes: 2

user3096803
user3096803

Reputation:

I solved the issue. I was using RenderTransform.ScaleX and RenderTransform.ScaleY. I changed these to LayoutTransform.ScaleX and LayoutTransform.ScaleY. This happened because LayoutTransform is applied before the layout takes place and RenderTransform occurs after the layout takes place.

Upvotes: 0

Related Questions