Search code examples
c#wpflibvlclibvlcsharp

LibVlcCsharp WPF. Show content over VideoView


I was using Meta.Vlc wrapper in a WPF application and I'm doing the migration to LibVLCSharp official library.

With Meta.Vlc I was able to show controls over videoview and with VideoView control of LibVLCSharp it seems that is always on top and doesn't show anything over videoView. For example, following xaml was working well with Meta.Vlc and with LibVLCSharp.WPF doesn't works.

<Grid x:Name="LayoutParent">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="50" />
   </Grid.RowDefinitions>

   <wpf:VideoView
        Grid.Row="0"
        Grid.RowSpan="2"
        x:Name="Player"
        Visibility="Visible">
        <interactivity:Interaction.Behaviors>
            <behaviors:PlayerBehavior />
        </interactivity:Interaction.Behaviors>
    </wpf:VideoView>


   <Canvas x:Name="DrawAreaCamera"
            Grid.Row="0"
            Grid.RowSpan="2"
            Margin="5"
            Visibility="Visible">
        <interactivity:Interaction.Behaviors>
            <behaviors:CameraDrawingBehavior />
        </interactivity:Interaction.Behaviors>
    </Canvas>

    <Border Grid.Row="2"
            Visibility="Visible"
            Background="#2B2B55"
            Padding="5"
            Opacity="0.5" />
    <TextBlock Grid.Row="2"
               VerticalAlignment="Center"
               HorizontalAlignment="Center"
               Visibility="Visible"
               Text="Example"
               FontSize="26"
               Foreground="White" />
</Grid>

Solution

  • I have been reading and asking LibVlcSharp community. The key is that LibVlcSharp.WPF control is behind the scenes a WindowsForms Window. This is known as 'Airspace issue' in documentation.

    If it's required to put content inside the player you have to put the content inside the control.

    Instead of doing like this

    <Grid>
        <vlc:VideoView x:Name="VideoView" />
        <Button Click="Play_Clicked">PLAY</Button>
    </Grid>
    

    It's neccesary to do in this way.

    <Grid>
        <vlc:VideoView x:Name="VideoView">
            <Button Click="Play_Clicked">PLAY</Button>
        </vlc:VideoView>
    </Grid>
    

    LibVlcSharp Official Documentation