WP7：LayoutTransform 一个 ListBoxItem答案

【问题标题】：WP7: LayoutTransform a ListBoxItemWP7：LayoutTransform 一个 ListBoxItem
【发布时间】：2012-01-19 04:19:03
【问题描述】：

这是我的 XAML：

<ListBox x:Name="MyListBox" FontSize="40"
            SelectionChanged="MyListBox_SelectionChanged">
</ListBox>

在此代码隐藏（如下）中，我试图为删除操作设置动画。选择该项目后，我将其删除。我使用 ScaleTransform 对其进行视觉动画处理。在 WPF 中我会使用 LayoutTransform，但由于我在 WP/SL 中只有 RenderTransform，所以我使用的是 RenderTransform——因此周围的布局不会响应大小的变化。该记录仍被正确删除，但视觉效果减弱。

有没有办法在 WP 中做到这一点？有没有办法调整 ListBoxItem 的大小以便周围的内容响应？

ObservableCollection<string> m_Data;

public MainPage()
{
    InitializeComponent();
    m_Data = new ObservableCollection<string>   
        { "One", "Two", "Three", "Four" };
    MyListBox.ItemsSource = m_Data;
}

private void MyListBox_SelectionChanged(object sender,
    SelectionChangedEventArgs e)
{
    // fetch ListBoxItem
    if (e.AddedItems.Count == 0)
        return;
    var _Data = e.AddedItems[0] as string;
    var _Item = MyListBox.ItemContainerGenerator
        .ContainerFromItem(_Data) as ListBoxItem;

    // setup to resize using scale transform
    var _Scale = new ScaleTransform
    {
        CenterX = _Item.RenderSize.Width / 2,
        CenterY = _Item.RenderSize.Height / 2,
        ScaleX = .99,
        ScaleY = .99
    };
    _Item.RenderTransform = _Scale;

    // setup storyboard
    var _Story = new Storyboard();
    _Story.Completed += (s, e1) =>
    {
        // remove data from collection
        m_Data.Remove(_Data);
    };

    // animate scale X
    var _AnimationX = new DoubleAnimation
    {
        To = .01,
        Duration = TimeSpan.FromSeconds(2),
    };
    _Story.Children.Add(_AnimationX);
    Storyboard.SetTarget(_AnimationX, _Scale);
    Storyboard.SetTargetProperty(_AnimationX,
        new PropertyPath(ScaleTransform.ScaleXProperty));

    // animate scale Y
    var _AnimationY = new DoubleAnimation
    {
        To = .01,
        Duration = TimeSpan.FromSeconds(2),
    };
    _Story.Children.Add(_AnimationY);
    Storyboard.SetTarget(_AnimationY, _Scale);
    Storyboard.SetTargetProperty(_AnimationY,
        new PropertyPath(ScaleTransform.ScaleYProperty));

    _Story.Begin();
}

【问题讨论】：

标签： xaml animation windows-phone layouttransform

【解决方案1】：

您也可以使用LayoutTransform on Windows Phone，所以我会使用它。 .

【讨论】：

不，抱歉。您没有看到问题是 ListBox 中的 ItemsControlItem 不参与 LayoutTransform。我希望。
我认为问题在于内容没有围绕变小的列表项调整大小。 LayoutTransform 通常会处理这个问题，这就是我建议它的原因。