如何允许用户在Windows Phone 8上的图片上移动\调整图像控件的大小

时间:2014-05-05 03:32:51

标签: xaml windows-phone-8 nokia-imaging-sdk lumia-imaging-sdk

以下是我使用Windows 8手机应用程序所面临的挑战

流程:用户使用Windows 8手机拍摄照片。逻辑使用PhotoCamera类,它适用于我的目的。一旦流可用,我将流传输到结果页面,其中从流构造BitmapImage。然后将此位图图像用作Image对象的源,该对象在xaml文件中定义。我们的想法是将拍摄的照片显示给用户进行确认,此流程正常。以下是结果页面的作用。

protected override void OnNavigatedTo(NavigationEventArgs e)
    {

        base.OnNavigatedTo(e);
        MemoryStream stream = (MemoryStream)App.ObjectNavigationData;
        stream.Seek(0, SeekOrigin.Begin);
        var bitmapImage = new BitmapImage(); 
        bitmapImage.SetSource(stream);
        imgCaptureResult.Source = bitmapImage;
        imgCaptureResult.Visibility = System.Windows.Visibility.Visible;
    }

我想要做的是显示一个矩形,用户可以在其中定义裁剪区域,我可以通过在图像对象本身上定义一个矩形对象(或多个线条)来完成。只要叠加对象(裁剪区域)是静态的,这就可以正常工作。请参阅下面的xaml。 (请注意,这里的画布是viewFinder(相机提要),而不是结果页面。在结果页面中,我将使用图像对象而不是画布,但是概念有效,我可以将线条覆盖在另一个UI元素上,只要线条是静态的)

<Canvas x:Name="viewfinderCanvas"
            Grid.Column="0"
            Width="640" 
            Height="480" 
            HorizontalAlignment="Left" >
        <!--Camera viewfinder -->
        <Canvas.Background>
            <VideoBrush x:Name="viewfinderBrush" />
        </Canvas.Background>
        <Line   X1="20" Y1="20"
                X2="100" Y2="20"
                Stroke="Red"
                StrokeThickness="4"/>
        <Line   X1="20" Y1="20"
                X2="20" Y2="100"
                Stroke="Red"
                StrokeThickness="4"/>
        <Line   X1="540" Y1="20"
                X2="620" Y2="20"
                Stroke="Red"
                StrokeThickness="4"/>
        <Line   X1="620" Y1="20"
                X2="620" Y2="100"
                Stroke="Red"
                StrokeThickness="4"/>
        <Line   X1="540" Y1="460"
                X2="620" Y2="460"
                Stroke="Red"
                StrokeThickness="4"/>
        <Line   X1="620" Y1="460"
                X2="620" Y2="380"
                Stroke="Red"
                StrokeThickness="4"/>
        <Line   X1="20" Y1="460"
                X2="100" Y2="460"
                Stroke="Red"
                StrokeThickness="4"/>
        <Line   X1="20" Y1="460"
                X2="20" Y2="380"
                Stroke="Red"
                StrokeThickness="4"/>
    </Canvas>

但我希望用户能够通过手势重新调整此矩形的大小,以便他可以真正自定义裁剪区域。将整个矩形向上\向下移动,或向下移动\向下\向下移动等等。换句话说,我需要一个类似于您在Paint.Net中看到的“选择”矩形的控件,以便用户可以选择裁剪区域。我无法想办法做到这一点。我查看了手机API以及诺基亚成像SDK,但没有任何东西点亮了我的脑袋。任何建议表示赞赏。感谢

1 个答案:

答案 0 :(得分:2)

您还可以采用一种方法,用户可以单独选择垂直边界和水平边界,而不是平移它(如果平移不是直接进行而且无法轻易控制)。让用户选择带有垂直滑块的垂直限制,然后以相同的方式让他进行水平选择。然后你可以用适当的颜色垂直和水平地遮挡他选择的区域,以显示平移效果。 只有当你没有达到你想要的目标时,这一点。