[英]How can a ListViewBase animation be improved?
我正在創建一個基於合成的動畫,我希望在加載每個ListViewItem時按比例放大它們。 我有以下示例代碼:
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
MyList.ContainerContentChanging += (sender, args) =>
{
if (!args.InRecycleQueue)
{
args.ItemContainer.Loaded += (item, e) =>
{
var lvi = item as ListViewItem;
var panel = FindDescendant<ItemsStackPanel>(MyList);
var visual = ElementCompositionPreview.GetElementVisual(lvi);
var index = MyList.IndexFromContainer(lvi);
if (index >= panel.FirstVisibleIndex && index <= panel.LastVisibleIndex)
{
var width = (float)lvi.RenderSize.Width;
var height = (float)lvi.RenderSize.Height;
visual.CenterPoint = new Vector3(width / 2, height / 2, 0f);
var zoom = visual.Compositor.CreateVector3KeyFrameAnimation();
zoom.Duration = TimeSpan.FromSeconds(2);
zoom.DelayTime = TimeSpan.FromMilliseconds(index * 100);
zoom.InsertKeyFrame(0.0f, new Vector3(0.75f, 0.75f, 0f));
zoom.InsertKeyFrame(1.0f, new Vector3(1.0f, 1.0f, 0f));
visual.StartAnimation("Scale", zoom);
}
};
}
};
}
private void Button_Click(object sender, RoutedEventArgs e)
{
var col = new List<int>();
for (var x = 0; x < 200; x++)
{
var z = new Random();
col.Add(z.Next(0, 1000));
}
MyList.ItemsSource = null;
MyList.ItemsSource = col;
}
private T FindDescendant<T>(DependencyObject element) where T : DependencyObject
{
T retValue = null;
var childrenCount = VisualTreeHelper.GetChildrenCount(element);
for (var i = 0; i < childrenCount; i++)
{
var child = VisualTreeHelper.GetChild(element, i);
var type = child as T;
if (type != null)
{
retValue = type;
break;
}
retValue = FindDescendant<T>(child);
if (retValue != null)
{
break;
}
}
return retValue;
}
}
我的問題是事件的時間安排。 單擊該按鈕時,將立即加載新聞項集,並在非常快速的暫停后播放動畫。是否還有其他事件或我可以更改的內容,以便在動畫開始之前不可見這些項?
這是示例源代碼的鏈接 。
看起來listview在嘗試播放羽化動畫之前嘗試播放EntranceThemeTransition。 如果要構建自己的動畫,則可以嘗試刪除現有的ListView.ItemContainerTransitions集合。
感謝@ user10930282,他是對的。 解決此問題的方法是刪除ListView的默認ItemContainerTransitions:
<ListView x:Name="MyList">
.
.
.
<ListView.ItemContainerTransitions>
<TransitionCollection>
<!-- Empty collection to not have any transitions interrupt the composition Item animations -->
</TransitionCollection>
</ListView.ItemContainerTransitions>
.
.
.
</ListView>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.