Пользовательская кнопка обратной связи - обратный глиф и круг отсутствуют

Question

После редактирования копии кнопки «Назад» я заметил, что обратный глиф и круг не появляются (вместо этого появляется прямоугольник). Как изменить форму на круг и показать обратный глиф? Пожалуйста, не обращайтесь к StandardStyles.xaml.

 <Style x:Key="ButtonStyleNavy" TargetType="Button"> 
     <Setter Property="Background" Value="{ThemeResource ButtonBackgroundThemeBrush}"/> 
     <Setter Property="Foreground" Value="#000099"/> 
     <Setter Property="BorderBrush" Value="#000099"/> 
     <Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}"/> 
     <Setter Property="Padding" Value="12,4,12,4"/> 
     <Setter Property="HorizontalAlignment" Value="Left"/> 
     <Setter Property="VerticalAlignment" Value="Center"/> 
     <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/> 
     <Setter Property="FontWeight" Value="SemiBold"/> 
     <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button"> 
        <Grid> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"/> 
           <VisualState x:Name="PointerOver"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonPointerOverBackgroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonPointerOverForegroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Pressed"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="#000099"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="White"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledBackgroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledBorderThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledForegroundThemeBrush}"/> 
             </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> 
         <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="3"> 
          <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
         </Border> 
         <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> 

Answer 1

Попробуйте это ... Может быть, это может сработать.

<ResourceDictionary.ThemeDictionaries> 
    <ResourceDictionary x:Key="Default"> 
     <x:String x:Key="BackButtonGlyph">&#xE071;</x:String> 
     <x:String x:Key="BackButtonSnappedGlyph">&#xE0BA;</x:String> 
    </ResourceDictionary> 

    <ResourceDictionary x:Key="HighContrast"> 
     <x:String x:Key="BackButtonGlyph">&#xE071;</x:String> 
     <x:String x:Key="BackButtonSnappedGlyph">&#xE0C4;</x:String> 
    </ResourceDictionary> 
</ResourceDictionary.ThemeDictionaries>  



<Style x:Key="BackButtonStyle" TargetType="Button"> 
    <Setter Property="MinWidth" Value="0"/> 
    <Setter Property="Width" Value="48"/> 
    <Setter Property="Height" Value="48"/> 
    <Setter Property="Margin" Value="36,0,36,36"/> 
    <Setter Property="VerticalAlignment" Value="Bottom"/> 
    <Setter Property="FontFamily" Value="Segoe UI Symbol"/> 
    <Setter Property="FontWeight" Value="Normal"/> 
    <Setter Property="FontSize" Value="56"/> 
    <Setter Property="AutomationProperties.AutomationId" Value="BackButton"/> 
    <Setter Property="AutomationProperties.Name" Value="Back"/> 
    <Setter Property="AutomationProperties.ItemType" Value="Navigation Button"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <Grid x:Name="RootGrid"> 
        <Grid Margin="-1,-16,0,0"> 
         <TextBlock x:Name="BackgroundGlyph" Text="&#xE0A8;" Foreground="{StaticResource BackButtonBackgroundThemeBrush}"/> 
         <TextBlock x:Name="NormalGlyph" Text="{StaticResource BackButtonGlyph}" Foreground="{StaticResource BackButtonForegroundThemeBrush}"/> 
         <TextBlock x:Name="ArrowGlyph" Text="&#xE0A6;" Foreground="{StaticResource BackButtonPressedForegroundThemeBrush}" Opacity="0"/> 
        </Grid> 
        <Rectangle 
         x:Name="FocusVisualWhite" 
         IsHitTestVisible="False" 
         Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" 
         StrokeEndLineCap="Square" 
         StrokeDashArray="1,1" 
         Opacity="0" 
         StrokeDashOffset="1.5"/> 
        <Rectangle 
         x:Name="FocusVisualBlack" 
         IsHitTestVisible="False" 
         Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" 
         StrokeEndLineCap="Square" 
         StrokeDashArray="1,1" 
         Opacity="0" 
         StrokeDashOffset="0.5"/> 

        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal" /> 
          <VisualState x:Name="PointerOver"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BackButtonPointerOverBackgroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="NormalGlyph" Storyboard.TargetProperty="Foreground"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BackButtonPointerOverForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BackButtonForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <DoubleAnimation 
             Storyboard.TargetName="ArrowGlyph" 
             Storyboard.TargetProperty="Opacity" 
             To="1" 
             Duration="0"/> 
            <DoubleAnimation 
             Storyboard.TargetName="NormalGlyph" 
             Storyboard.TargetProperty="Opacity" 
             To="0" 
             Duration="0"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="Visibility"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="FocusStates"> 
          <VisualState x:Name="Focused"> 
           <Storyboard> 
            <DoubleAnimation 
             Storyboard.TargetName="FocusVisualWhite" 
             Storyboard.TargetProperty="Opacity" 
             To="1" 
             Duration="0"/> 
            <DoubleAnimation 
             Storyboard.TargetName="FocusVisualBlack" 
             Storyboard.TargetProperty="Opacity" 
             To="1" 
             Duration="0"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Unfocused" /> 
          <VisualState x:Name="PointerFocused" /> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 2

Используя форму «Эллипс» вы можете создать круглую кнопку назад и перейдите по этой ссылке также Buttons styled to look like app bar buttons

<Page.Resources> 
    <Style x:Key="ButtonStyleNavy" TargetType="Button"> 
     <Setter Property="Background" Value="Red"/> 
     <Setter Property="Foreground" Value="#000099"/> 
     <Setter Property="BorderBrush" Value="#000099"/> 
     <Setter Property="BorderThickness" Value="2"/> 
     <Setter Property="Padding" Value="12,4,12,4"/> 
     <Setter Property="HorizontalAlignment" Value="Left"/> 
     <Setter Property="VerticalAlignment" Value="Center"/> 
     <Setter Property="FontFamily" Value="Segoe Ui Light"/> 
     <Setter Property="FontWeight" Value="SemiBold"/> 
     <Setter Property="FontSize" Value="15"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button"> 
        <Grid> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"/> 
           <VisualState x:Name="PointerOver"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonPointerOverBackgroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonPointerOverForegroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Pressed"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="#000099"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="White"/> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledBackgroundThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="Border"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledBorderThemeBrush}"/> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonDisabledForegroundThemeBrush}"/> 
             </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> 
         <Ellipse Height="40" Width="40" x:Name="Border" Stroke="{TemplateBinding BorderBrush}" Margin="3" StrokeThickness="{TemplateBinding BorderThickness}" Fill="{TemplateBinding Background}"/> 

         <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 

         <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> 
</Page.Resources> 

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Button Foreground="White" FontFamily="Segoe Ui Symbol" Content="&#xE112;" Style="{StaticResource ButtonStyleNavy}" Background="Red" BorderBrush="Yellow" BorderThickness="2"></Button> 
</Grid>