如何防止图像相互重叠?

时间:2015-04-21 07:33:17

标签: c# xaml windows-phone-8 windows-phone-toolkit

我正在Windows手机中做一个简单的应用程序。有两个透明框架,一个在顶部,另一个在Bootom上。现在我在Top框架中设置两个不同的图像,在第二个框架中设置另一个。现在我使用Pinch放大和缩小,但我的图像彼此重叠,我想防止它们重叠。我怎么能这样做请建议?这是My Pinch Zoom和Image拖动代码

 private void OnPinchDelta(object sender, PinchGestureEventArgs e)
    {
        if (InitialScale * e.DistanceRatio > 2 || (InitialScale != 1 && e.DistanceRatio == 1) || InitialScale * e.DistanceRatio < 1)
            return;
        if (e.DistanceRatio < 0.05)
        {
            ImageTransformation.CenterX = 0;
            ImageTransformation.CenterY = 0;
            ImageTransformation.TranslateX = 0;
            ImageTransformation.TranslateY = 0;
        }
        ImageTransformation.CenterX = Center.X;
        ImageTransformation.CenterY = Center.Y;

        if (this.Orientation == PageOrientation.Landscape)
        {
            ImageTransformation.ScaleX = InitialScale * (1 + (e.DistanceRatio - 1) * 1);
        }
        else
        {
            ImageTransformation.ScaleX = InitialScale * e.DistanceRatio;
        }
        ImageTransformation.ScaleY = ImageTransformation.ScaleX;
        ImageTransformation.Rotation = Angle + e.TotalAngleDelta;



    }

    private void GestureListener_PinchStarted(object sender, PinchStartedGestureEventArgs e)
    {
        InitialScale = ImageTransformation.ScaleX;

        Angle = ImageTransformation.Rotation; //to rotate image

        // Calculate the center for the zooming
        Point firstTouch = e.GetPosition(Myimage, 0);
        Point secondTouch = e.GetPosition(Myimage, 1);

        Center = new Point(firstTouch.X + (secondTouch.X - firstTouch.X) / 2.0, firstTouch.Y + (secondTouch.Y - firstTouch.Y) / 2.0);
    }

    private void Image_DragDelta(object sender, DragDeltaGestureEventArgs e)
    {
        double centerX = ImageTransformation.CenterX;
        double centerY = ImageTransformation.CenterY;
        double translateX = ImageTransformation.TranslateX;
        double translateY = ImageTransformation.TranslateY;
        double scale = ImageTransformation.ScaleX;
        double width = Myimage.ActualWidth;
        double height = Myimage.ActualHeight;

        // Verify limits to not allow the image to get out of area

        if (centerX - scale * centerX + translateX + e.HorizontalChange < 120 && centerX + scale * (width - centerX) + translateX + e.HorizontalChange > 120)
        {
            ImageTransformation.TranslateX += e.HorizontalChange;
        }

        if (centerY - scale * centerY + translateY + e.VerticalChange < 120 && centerY + scale * (height - centerY) + translateY + e.VerticalChange > 120)
        {
            ImageTransformation.TranslateY += e.VerticalChange;
        }
        return;
    }

这是我的XAML代码:

     <Grid x:Name="LayoutRoot" ManipulationDelta="OnManipulationDelta" Height="728" VerticalAlignment="Top">
    <Image x:Name="MyImage" HorizontalAlignment="Left" Height="814" VerticalAlignment="Top" Width="495"  Stretch="Fill"   />
    <Canvas x:Name="PenguinCanvas"
        RenderTransformOrigin="0.3,0.3" ManipulationDelta="PenguinCanvas_ManipulationDelta">
        <Canvas.RenderTransform>
            <ScaleTransform x:Name="PenguinTransform" />
        </Canvas.RenderTransform>
     <Image x:Name="Myimage" RenderTransformOrigin="0,0" Height="246" Width="342" HorizontalAlignment="Left" Stretch="Fill" Canvas.Top="-72" Canvas.Left="83" >
            <Image.RenderTransform>
                <CompositeTransform x:Name="ImageTransformation" ScaleX="1" ScaleY="1" />
            </Image.RenderTransform>
            <toolkit:GestureService.GestureListener>
                <toolkit:GestureListener PinchStarted="GestureListener_PinchStarted" PinchDelta="OnPinchDelta" DragDelta="Image_DragDelta" />
            </toolkit:GestureService.GestureListener>
        </Image>
        <Image x:Name="Myimage1" RenderTransformOrigin="0,0" Height="259" Width="322" ManipulationDelta="MainPage_ManipulationDelta1" HorizontalAlignment="Left" Stretch="Fill" Canvas.Left="83" Canvas.Top="307"  >
            <Image.RenderTransform>
                <CompositeTransform x:Name="ImageTransformation1" ScaleX="1" ScaleY="1" />
            </Image.RenderTransform>
            <toolkit:GestureService.GestureListener>
                <toolkit:GestureListener PinchStarted="GestureListener_PinchStarted1" PinchDelta="OnPinchDelta1" DragDelta="Image_DragDelta1" />
            </toolkit:GestureService.GestureListener>
        </Image>
    </Canvas>
    <Image x:Name="img" Source="/Assets/new collage/c10.png"  Stretch="Fill"/>
    <Image x:Name="img1" Source="/Assets/new collage/c10.png"  Stretch="Fill"/>

1 个答案:

答案 0 :(得分:0)

你正在寻找UIElement.ClipToBounds财产吗?

enter image description here