Question

I am playing a video using MediaElement.
I have add under the MediaElement a MediaElement.Clip -> EllipseGeometry to display only part of the video.
I would like to make 4 buttons, each button will change the Center positioning of the ellipsegeometry.
Current code is this:

<Grid>
    <Canvas Height="279" HorizontalAlignment="Left" Margin="26,20,0,0" Name="canvas1" VerticalAlignment="Top" Width="453">
        <Button Canvas.Left="22" Canvas.Top="200" Height="30" Width="30" HorizontalAlignment="Center" VerticalAlignment="Center" Panel.ZIndex="1">
            <Button.Template>
                <ControlTemplate TargetType="Button">
                    <StackPanel>
                        <ContentPresenter Content="{TemplateBinding Content}" />
                    </StackPanel>
                </ControlTemplate>
            </Button.Template>
            <Image Source="Images\play.png"/>
        </Button>
        <MediaElement Canvas.Left="22" Canvas.Top="80" Height="193" Name="mediaElement1" Width="244" Panel.ZIndex="0" Source="C:\Users\ilans\Documents\Visual Studio 2010\Projects\Wildlife.wmv">
            <MediaElement.Clip>
                <EllipseGeometry Center="50,80" RadiusX="20" RadiusY="20" />
            </MediaElement.Clip>
        </MediaElement>
        <Button Canvas.Left="356" Canvas.Top="40" Content="Button" Height="23" Name="button1" Width="75" Click="button1_Click" />
    </Canvas>
</Grid>

How can I add new button that manipulates the MediaElement.Clip and EllipseGeometry position ?

Answer 1

    private void button1_Click(object sender, RoutedEventArgs e)
    {
        Point ellipsePoint = new Point(80, 80);
        mediaElement1.Clip = new EllipseGeometry(ellipsePoint, 30, 30);
    }