自定义MediaTrasportControls不可见

时间:2019-09-02 09:13:47

标签: c# xaml uwp

我需要在MediaPlayerElement中实现自定义控件。我一直遵循"Create custom transport controls" Microsoft guide并尝试自己一步一步地完成所有工作,甚至尝试从示例应用程序中公然复制代码。但是,这些都不起作用。

我只看到MediaPlayerElement,没有任何控件。然后我试着去一点。我创建了一个新项目,并尝试自己复制示例应用程序。好吧,它也失败了。我不高兴我在某个地方犯了一个错误,但是我看不到那里。请仔细检查所有内容,甚至将默认样式复制到我的“自定义”样式中。但是,仍然没有面板。

控制类别:

namespace Kinopub.UI.Utilities
{
    public sealed class CustomMediaTransportControls : MediaTransportControls
    {
        public event EventHandler<EventArgs> Liked;

        public CustomMediaTransportControls()
        {
            this.DefaultStyleKey = typeof(CustomMediaTransportControls);
        }

        protected override void OnApplyTemplate()
        {
            // This is where you would get your custom button and create an event handler for its click method.
            Button likeButton = GetTemplateChild("LikeButton") as Button;
            likeButton.Click += LikeButton_Click;

            base.OnApplyTemplate();
        }

        private void LikeButton_Click(object sender, RoutedEventArgs e)
        {
            // Raise an event on the custom control when 'like' is clicked
            Liked?.Invoke(this, EventArgs.Empty);
        }
    }
}

控制资源字典:(full code)

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Kinopub.UI.Utilities">

    <!-- Default style for MediaTransportControls -->
    <Style TargetType="local:CustomMediaTransportControls">
        <Setter Property="IsTabStop" Value="False" />
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="FlowDirection" Value="LeftToRight" />
        <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
        <Setter Property="IsTextScaleFactorEnabled" Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:CustomMediaTransportControls">
                    <Grid x:Name="RootGrid" Background="Transparent">

                        ...
                            A whole lot of code, copied from generic.xml
                        ...

                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

MediaPlayer页面:

<Page
    x:Class="Kinopub.UI.Views.MediaPlayerPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Kinopub.UI.Views"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:vms="using:Kinopub.UI.ViewModels"
    xmlns:utils="using:Kinopub.UI.Utilities"
    mc:Ignorable="d"

    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Page.DataContext>
        <vms:MediaPlayerVM/>
    </Page.DataContext>
    <Grid>
        <MediaPlayerElement
            x:Name="PlayerElement"
            Source="{Binding VideoMediaSource}"
        HorizontalAlignment="Stretch"
        VerticalAlignment="Bottom"
        AreTransportControlsEnabled="True"
        >
            <MediaPlayerElement.TransportControls>
                <utils:CustomMediaTransportControls>
                </utils:CustomMediaTransportControls>
            </MediaPlayerElement.TransportControls>
        </MediaPlayerElement>
    </Grid>
</Page>

1 个答案:

答案 0 :(得分:1)

通过检查代码,需要注意两点。

  1. 将在Kinopub.UI.Utilities下创建的资源字典添加到App.xaml,例如:
<Application ...>
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="ms-appx:///Kinopub/UI/Utilities/resource_file_name.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>
  1. 像这样向您的AppBarButton添加一个名为 LikeButton ControlTemplate
<CommandBar x:Name="MediaControlsCommandBar" ...>
    ...
    <AppBarButton x:Name="LikeButton"
                  Icon="Like"
                  Style="{StaticResource AppBarButtonStyle}"
                  MediaTransportControlsHelper.DropoutOrder="3"
                  VerticalAlignment="Center"
                  />
    ...
</CommandBar>

最诚挚的问候。