在WP8中使用捏缩放的图片幻灯片

时间:2014-05-03 09:53:36

标签: c# xaml windows-phone-8

我正在尝试使用照片集线器中的经典图片视图或任何移动设备上的任何标准图片应用程序进行应用。到目前为止,我开始使用Kinnara的工具包fork和CompositeTransform中的FlipView进行pinchzooming,但我不明白如何将图片与屏幕中心对齐(VerticalAlignment = Center似乎不能作为属性DataTemplate中的图像)我并不了解在查看邻居图片时如何使缩放的图片在背景中不可见。另外,也许我错过了一些标准模式?

UPD:一些代码

<toolkit:FlipView x:Name="FlipView"
                  d:DataContext="{d:DesignInstance viewModels:PostsViewModel}"
                  ItemsSource="{Binding Pictures}">
    <toolkit:FlipView.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Vertical">
                <ProgressBar Value="{Binding DownloadProgress}"
                             Maximum="100"
                             Minimum="1"
                             IsEnabled="{Binding IsLoading}" />
                <Image x:Name="PostImage"
                       Source="{Binding Sample}"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center"
                       Stretch="UniformToFill"
                       ManipulationDelta="Image_OnManipulationDelta">
                    <Image.RenderTransform>
                        <CompositeTransform />
                    </Image.RenderTransform>
                </Image>

            </StackPanel>
        </DataTemplate>
    </toolkit:FlipView.ItemTemplate>
</toolkit:FlipView>

UPD2:Pinchzooming代码

    private void Image_OnManipulationDelta(object sender, ManipulationDeltaEventArgs e)
    {
        if (e.PinchManipulation != null)
        {
            var transform = (CompositeTransform)((Image) sender).RenderTransform;

            // Scale Manipulation
            transform.ScaleX = e.PinchManipulation.CumulativeScale;
            transform.ScaleY = e.PinchManipulation.CumulativeScale;

            // Translate manipulation
            var originalCenter = e.PinchManipulation.Original.Center;
            var newCenter = e.PinchManipulation.Current.Center;
            transform.TranslateX = newCenter.X - originalCenter.X;
            transform.TranslateY = newCenter.Y - originalCenter.Y;
            // end 
            e.Handled = true;
        }
    }

1 个答案:

答案 0 :(得分:0)

如果你想要更多的操作系统外观(如图片库中的图像显示方式),请查看名为Windows Phone Media Viewer(https://www.nuget.org/packages/PhoneMediaViewer/)的nuget。

甚至还有一个示例应用,它在MSDN上用完(http://code.msdn.microsoft.com/wpapps/Basic-Lens-sample-359fda1b