C# uwp GridView selectedItem弹出窗口

我正在使用UWP社区工具包提供的AdaptiveGridView。我希望gridview的选定项在Z轴上弹出，这意味着选定项必须放大到特定的大小，但它不应干扰其他gridview项的大小，而应在画布的Z轴上缩放。使用UWP community toolkit缩放效果（但这也会影响其他项目的大小）也可以设置此效果的动画。如果在所选项目上不可能，那么在指针悬停时是否可能

方法1：更改选择时 XAML部件

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

样本输出

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

方法2：指针悬停 XAML部件

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

样本输出

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

方法3：使用投影 XAML部件

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

样本输出

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

---

（旧帖子）

方法1（不与其他项目重叠） XAML部件

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

样本输出

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

方法2（将与其他项目重叠） XAML部件

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

样本输出

<GridView Height="200" SelectionChanged="GridView_SelectionChanged">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }

    lastPopUpElement = (sender as GridView).ContainerFromIndex((sender as GridView).SelectedIndex) as FrameworkElement;

    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 1);
        lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <Grid Width="100" Height="100" PointerEntered="GridView_PointerEntered" PointerExited="GridView_PointerExited">
                <!-- Content -->
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

FrameworkElement lastPopUpElement = null;
private void GridView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(sender as FrameworkElement) as FrameworkElement) as FrameworkElement;
    Canvas.SetZIndex(lastPopUpElement, 1);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void GridView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<GridView Height="200">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:ItemSource">
            <controls:DropShadowPanel OffsetX="5" OffsetY="5" Color="Black" BlurRadius="5" ShadowOpacity="0" PointerEntered="myListView_PointerEntered" PointerExited="myListView_PointerExited">
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </controls:DropShadowPanel>
        </DataTemplate>
    </GridView.ItemTemplate>
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
</GridView>

private void myListView_PointerEntered(object sender, PointerRoutedEventArgs e)
{
    DropShadowPanel DropShadow = sender as DropShadowPanel;
    lastPopUpElement = VisualTreeHelper.GetParent(VisualTreeHelper.GetParent(DropShadow) as FrameworkElement) as FrameworkElement;
    DropShadow.ShadowOpacity = 0.5;
    Canvas.SetZIndex(lastPopUpElement, 10);
    lastPopUpElement.Scale(scaleX: 1.5f, scaleY: 1.5f, centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
}

private void myListView_PointerExited(object sender, PointerRoutedEventArgs e)
{
    if (lastPopUpElement != null)
    {
        DropShadowPanel DropShadow = sender as DropShadowPanel;
        DropShadow.ShadowOpacity = 0;
        Canvas.SetZIndex(lastPopUpElement, 0);
        lastPopUpElement.Scale(centerX: 50, centerY: 50, easingType: EasingType.Sine).Start();
    }
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="150" Height="150">
                    <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                        <!-- Content -->
                    </Grid>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

FrameworkElement oldSetectedItem = null;

private void myAdaptiveGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (oldSetectedItem != null)
        oldSetectedItem.Scale(1, 1, 50, 50, 500).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var outerGrid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(outerGrid, 0) as FrameworkElement;
    oldSetectedItem = grid;

    grid.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

<Grid Name="MainGrid" Height="200">
    <controls:AdaptiveGridView x:Name="myAdaptiveGridView" SelectionChanged="myAdaptiveGridView_SelectionChanged" VerticalAlignment="Center" HorizontalAlignment="Left">
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate>
                <Grid Width="100" Height="100" VerticalAlignment="Center" HorizontalAlignment="Center">
                    <!-- Content -->
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
    <Image x:Name="RenderedImage" Stretch="None" Visibility="Collapsed" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>

private async void myAdaptiveGridView_SelectionChangedAsync(object sender, SelectionChangedEventArgs e)
{
    RenderedImage.Scale(1, 1, 0, 0, 0).Start();

    var container = myAdaptiveGridView.ContainerFromIndex(myAdaptiveGridView.SelectedIndex) as FrameworkElement;
    var listViewItemPresenter = VisualTreeHelper.GetChild(container, 0) as FrameworkElement;
    var grid = VisualTreeHelper.GetChild(listViewItemPresenter, 0) as FrameworkElement;
    oldSetectedItem = grid;

    var TTV = grid.TransformToVisual(MainGrid);
    Point screenCoords = TTV.TransformPoint(new Point(0, 0));

    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(grid);
    RenderedImage.Source = renderTargetBitmap;
    RenderedImage.Margin = new Thickness(screenCoords.X, screenCoords.Y, 0, 0);
    RenderedImage.Width = grid.ActualWidth;
    RenderedImage.Height = grid.ActualHeight;
    RenderedImage.Visibility = Visibility.Visible;

    RenderedImage.Scale(1.5f, 1.5f, 50, 50, 500).Start();
}

---

您尝试了哪种比例法？通常，比例的改变不会影响布局，尺寸的改变会影响布局。我正试图解决这个问题。我使用

var container=AdaptiveGridViewControl.ContainerFromIndex（AdaptiveGridViewControl.SelectedIndex）作为框架元素获取所选项目的容器

，并尝试使用

container.Scale（2,2,0,0,500,0，EasingType.Default）增加比例

但它不会增加比例，而是在我更改宽度时增加比例（或高度）它会像预期的那样影响所选项目。为什么缩放不会影响布局？它最有可能不会更改缩放，因为每个gridview项目都在某个边界内。对不起，缩放我指的是大小更改，这会影响布局，正如@VijayNirmal测试的那样，缩放不会因为边界而对项目产生任何影响，我们需要一种方法来byp因为边界可能在Z轴上？@JustinXL那么改变宽度（或高度）如何影响所选项目？这是一个很好的答案，做得好@VijayNirmal我想我们也可以添加阴影效果，这将改善叠加效果，但你已经完成了核心任务，非常感谢：）顺便问一下，在第二种方法中，为什么你要将外网格的高度设置为150？我想它也能在100英尺的高度下工作，因为它应该是这样的overlay@JustinXL Thanks@touseef对您可以删除它。我将编辑我的答案。我已经在UWPCommunityToolkit中打开了一个创建弹出动画的窗口。