Custom Shape for Clip in Windows Phone 8

Question

I'm trying to make a clip mask with a custom shape in Windows Phone 8.

I have the path data for the shape, so I can set

<Grid x:Name="gridMain" Clip="M2,54.597 L100.15,101.27 .....
</Grid>

and the grid is correctly clipped to the custom path.

What I needed to do next is apply a transform, so it can be moved about or scaled etc..

I would normally do this in code as follows

// slide transform
TranslateTransform translateTransform = new TranslateTransform();
gridMain.Clip.Transform = translateTransform;

And then perform the movement using a storyboard.

But, the problem is that gridMain.Clip.Transform is not a RenderTransform, so the animation does not run. No errors, just no animation.

If my custom shape was a builtin geometry like EllipseGeometry then I could setup a transform in XAML and animated it in code using clipRT

    <Grid x:Name="gridMain" Grid.Row="1" >
        <Grid.Clip>
            <GeometryGroup x:Name="clipGroup">

                <EllipseGeometry RadiusX="100" RadiusY="100"/>

                <GeometryGroup.Transform>
                    <CompositeTransform x:Name="clipRT" />
                </GeometryGroup.Transform>
            </GeometryGroup>
        </Grid.Clip>
    </Grid>

I know there is a PathGeometry, but is does not take my Path data M2,54.597 L100.15,101.27 ..... as Path Markup. It needs to have stuff setup which is no good for my custom shape.

So, to conclude. How do I setup a custom shape (from path data) to act a clipping mask and also be able to perform translate/scale etc.. transforms on it from code???

Note : I'm clipping an Image, and know I can define Path the set it's fill to the image, but that's no good here, because if I move the path around the image will follow.

Custom Shape for Clip in Windows Phone 8

0 Answers0