在WPF中在MediaElement上方呈现按钮

Question

我在XAML中有一个MediaElement对象，可以很好地加载我的视频。我想要的是将播放、暂停和停止按钮渲染在我的MediaElement对象正中央，就像在网页上嵌入YouTube视频时一样，在视频中心会出现大的播放按钮。在WPF中，我能否使用MediaElement实现这个效果？

- Icemanind

Answer 1

如果有其他人需要这样做，我已经弄清楚了。我只需创建一个画布并将MediaElement和Button都放在画布内。然后使用ZIndex更改ZOrdering，使按钮在顶部。最后，我将按钮居中放置在我的电影上方。以下是XAML：

<StackPanel Orientation="Horizontal" Background="LightGray" DockPanel.Dock="Bottom" Height="100">
        <Canvas Width="100">
            <Button Canvas.ZIndex="2" Canvas.Left="42" Canvas.Top="35">
                <Button.Template>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Polygon Points="0,0 0,26 17,13" Fill="#80000000" Stroke="White" />
                    </ControlTemplate>
                </Button.Template>
            </Button>
            <MediaElement Canvas.ZIndex="1" Canvas.Top="0" Canvas.Left="0" 
                          x:Name="mediaElement1" UnloadedBehavior="Manual" LoadedBehavior="Manual" ScrubbingEnabled="True" 
                          Loaded="mediaElement1_Loaded" Width="100" Height="100">
            </MediaElement>
        </Canvas>
    </StackPanel>

- Icemanind

Answer 2

或者您需要将mediaElement和Buttons放置在同一个网格中，并将Canvas.ZIndex设置为大于0的数字：

    <Grid>
        <Button  VerticalAlignment="Center" HorizontalAlignment="Center" Height="50" Width="100" Canvas.ZIndex="1">Button</Button>
        <MediaElement Source="/Assets/ladybug.wmv">
         </MediaElement>
    </Grid>

（实际上您不需要Canvas [适用于UWP]）：

- Alamakanambra