Come faccio a rendere i collegamenti ipertestuali in RichTextBlock non completamente non allineati?

Question

Voglio essere in grado di mostrare un collegamento ipertestuale in un elemento RichTextBlock, ma voglio anche che abbia un aspetto corretto. Il più vicino che ho potuto arrivare a questo è:

Il XAML per questo si incolla di seguito - in sostanza, io uso InlineUIElement e ho modificato la risorsa per rimuovere tutto il CRUD attorno al pulsante. Mi sto perdendo qualcosa? L'unico vero modo per risolvere questo è quello di creare il mio hyperlink?

Ecco il codice XAML per i ricchi blocco di testo:

<RichTextBlock VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="14"> 
    <Paragraph>I just want this 
     <InlineUIContainer> 
      <HyperlinkButton Style="{StaticResource HyperlinkButtonStyle1}">Hyperlink</HyperlinkButton> 
     </InlineUIContainer> 
     to not look like crap 
    </Paragraph> 
</RichTextBlock> 

Ed ecco il codice XAML per la risorsa Nuked:

<Style x:Key="HyperlinkButtonStyle1" TargetType="HyperlinkButton"> 
    <Setter Property="Foreground" Value="{StaticResource HyperlinkForegroundThemeBrush}"/> 
    <Setter Property="Background" Value="{StaticResource HyperlinkButtonBackgroundThemeBrush}"/> 
    <!--<Setter Property="BorderBrush" Value="{StaticResource HyperlinkButtonBorderThemeBrush}"/>--> 
    <Setter Property="BorderThickness" Value="0"/> 
    <Setter Property="Padding" Value="0"/> 
    <Setter Property="HorizontalAlignment" Value="Left"/> 
    <Setter Property="VerticalAlignment" Value="Bottom"/> 
    <Setter Property="FontFamily" Value="Global User Interface"/> 
    <Setter Property="FontSize" Value="14"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="HyperlinkButton"> 
       <Grid> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"/> 
          <VisualState x:Name="PointerOver"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource HyperlinkPointerOverForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource HyperlinkPressedForegroundThemeBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource HyperlinkDisabledThemeBrush}"/> 
            </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}" VerticalAlignment="Bottom"> 
         <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="0" VerticalAlignment="Bottom"/> 
        </Border> 
        <Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashArray="1,1"/> 
        <Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" StrokeDashArray="1,1"/> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 1

avete provato a guardare il TextButtonStyle in StandardStyles.xaml incluso con il modelli VS standard? Non dovresti creare il tuo collegamento ipertestuale. In metropolitana è possibile sostituire completamente il modello di un controllo, quindi non è necessario riprodurre la funzionalità quando esiste già un controllo con la funzionalità desiderata.

Edit: Ho preso il modello TextButtonStyle e cambiato il margine di Margin="3,-20,3,0" e poi aggiunse FontSize="14".

ora sembra che questo:

Il motivo era così lontano è che il modello TextBlock sul TextBlock nel modello TextButtonStyle si presenta così:

<Style x:Key="PageSubheaderTextStyle" TargetType="TextBlock" BasedOn="{StaticResource SubheaderTextStyle}"> 
    <Setter Property="TextWrapping" Value="NoWrap"/> 
    <Setter Property="VerticalAlignment" Value="Bottom"/> 
    <Setter Property="Margin" Value="0,0,0,40"/> 
</Style> 

Avviso il margine. Quindi per risolverlo abbiamo dovuto creare un margine negativo sul genitore (come ho fatto io) o semplicemente cambiare il margine sullo PageSubheaderTextStyle.