在播放器框架元素WP8.1中自定义播放/暂停按钮

Question

我在播放器框架（XAML WINRT，Windows Phone 8.1应用程序）上有一个小的自定义问题，我试图删除围绕播放/暂停的圆圈和全屏按钮：

，我想为他们看起来更像是这样的：

我有机会获得播放/暂停按钮的默认XAML：

但是Blend是不是让我来创建元素的副本，这样我可以自定义：

你知不知道我能做些什么来解决这个？还是有另一种解决方案来消除播放/暂停周围的圈子？

编辑：

要获得第二图像I Photoshop中的全屏按钮，以显示我想有什么。

我已经能够找到一个工作，找到AppBarButton的样式“TransportBarButtonStyle”，混合& Visual Studio不想给我。

你可以找到它的CodePlex上现场为玩家构架： https://playerframework.codeplex.com/SourceControl/latest#Universal.Xaml.Core/Themes/Classic.xaml，你需要寻找：

<Style x:Key="TransportBarButtonStyle" TargetType="AppBarButton"> 

Answer 1

看着CodePlex上后，https://playerframework.codeplex.com/SourceControl/latest#Universal.Xaml.Core/Themes/Classic.xaml

我创建了一个新样式目标AppBarButton没有围绕其边界的任何圈子：

<Style x:Key="CircleLessTransportBarButtonStyle" TargetType="AppBarButton"> 
    <Setter Property="Foreground" Value="{ThemeResource AppBarItemForegroundThemeBrush}"/> 
    <Setter Property="VerticalAlignment" Value="Center"/> 
    <Setter Property="HorizontalAlignment" Value="Center"/> 
    <Setter Property="Padding" Value="0"/> 
    <Setter Property="IsCompact" Value="True"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="AppBarButton"> 
       <Grid x:Name="RootGrid" Background="Transparent"> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="ApplicationViewStates"> 
          <VisualState x:Name="FullSize"/> 
          <VisualState x:Name="Compact"/> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"/> 
          <VisualState x:Name="PointerOver"> 
           <Storyboard> 
            <!--<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="BackgroundEllipse"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarItemPointerOverBackgroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames>--> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="Content"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarItemPointerOverForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <!--<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="OutlineEllipse"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarItemForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="BackgroundEllipse"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarItemForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames>--> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="Content"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarItemPressedForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <!--<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="OutlineEllipse"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarItemDisabledForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames>--> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="Content"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarItemDisabledForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="FocusStates"> 
          <VisualState x:Name="Focused"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualWhite"/> 
            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualBlack"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Unfocused"/> 
          <VisualState x:Name="PointerFocused"/> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Viewbox Margin="{TemplateBinding Padding}"> 
         <Grid Height="40" Width="40"> 
          <!--<Ellipse x:Name="BackgroundEllipse" Fill="{ThemeResource AppBarItemBackgroundThemeBrush}" UseLayoutRounding="False"/> 
          <Ellipse x:Name="OutlineEllipse" Stroke="{ThemeResource AppBarItemForegroundThemeBrush}" StrokeThickness="2" UseLayoutRounding="False"/>--> 
          <ContentPresenter x:Name="Content" AutomationProperties.AccessibilityView="Raw" 
               Content="{TemplateBinding Icon}" 
               Foreground="{TemplateBinding Foreground}" 
               HorizontalAlignment="Center" VerticalAlignment="Center"/> 
         </Grid> 
        </Viewbox> 
        <Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{ThemeResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashArray="1,1"/> 
        <Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{ThemeResource FocusVisualBlackStrokeThemeBrush}" StrokeDashArray="1,1"/> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

我希望这个他帮你！