代码之家  ›  专栏  ›  技术社区  ›  wildcolor

wpf画布和视频控制全屏

  •  1
  • wildcolor  · 技术社区  · 9 年前

    在我的WPF程序中,我想画一个形状。然后在我按下按钮后,程序以全屏模式播放视频。我似乎无法在画布上全屏播放视频。

    我的XAML如下所示

    <Canvas>
        <Ellipse Name="face1" Panel.ZIndex="2" Fill="Green" Width="400" Height="400" />
        <MediaElement Panel.ZIndex="1000" Name="videoControl1" Stretch="Fill" 
                      Source="C:\Users\videos\carcrash.mp4" 
                      LoadedBehavior="Manual" MediaEnded="videoControl1_MediaEnded">            
        </MediaElement>
    </Canvas>
    

    如你所见,我把视频放在我的形状前面。当按下按钮时,我开始播放视频。因此,视频将位于形状的前面。问题是视频很小。如何使其全屏显示?

    1 回复  |  直到 9 年前
        1
  •  1
  •   goobering    9 年前

    根据Dennis Cheng的评论 here :

    画布是一个“无布局”面板,因此子对象不会按父对象的大小调整大小。尝试 如果希望子对象填充或手动绑定到父对象的大小,请使用网格 如果必须使用画布:

    <Canvas x:Name="MyCanvas"
        Width="300"
        Height="300">
        <Ellipse Name="face1"
                Width="400" 
                Height="400"
                Panel.ZIndex="2"
                Fill="Green" />
        <MediaElement Name="videoControl1"
                    Width="{Binding RelativeSource={RelativeSource Self},
                                    Path=Parent.ActualWidth}"
                    Height="{Binding RelativeSource={RelativeSource Self},
                                    Path=Parent.ActualHeight}"
                    Panel.ZIndex="1000"
                    Source="C:\Users\videos\carcrash.mp4" />
    </Canvas>
    

    这会将视频的宽度缩放到包含“画布”的宽度,但它仍与原始尺寸成比例。

    如果你使用网格,你可以实现你想要的缩放:

    <Grid Width="500" Height="500">
        <Ellipse Name="face1"
                Width="400"
                Height="400"
                Panel.ZIndex="2"
                Fill="Green" />
        <MediaElement Name="videoControl1"
                    Grid.Row="0"
                    Panel.ZIndex="1000"
                    Source="D:\Downloads\The.Strain.S01E13.HDTV.x264-LOL.mp4"
                    Stretch="Fill" />
    </Grid>