2012-10-13 3 views
7

Ich möchte einen Hyperlink in einem RichTextBlock-Element anzeigen können, aber ich möchte auch, dass es richtig aussieht. Die nächstgelegene ich habe in der Lage zu bekommen, dies ist:Wie mache ich Hyperlinks in RichTextBlock nicht vollständig nicht ausgerichtet?

How I was able to get it to look

Die XAML für den unten eingefügt wird - im Wesentlichen, verwende ich InlineUIElement und ich bearbeiten die Ressource die crud alle um den Knopf zu entfernen. Fehle ich etwas? Ist der einzige wirkliche Weg, dies zu lösen, meinen eigenen Hyperlink zu rollen?

Hier ist das XAML für den Rich-Text-Block:

<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> 

Und hier ist das XAML für die nuked Ressource:

<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> 

Antwort

6

Haben Sie versucht, an der TextButtonStyle suchen in StandardStyles.xaml mit dem mitgelieferten Standard-VS-Vorlagen? Sie sollten nicht Ihren eigenen Hyperlink erstellen müssen. In der Metro können Sie die Vorlage eines Steuerelements vollständig ersetzen. Es ist also nicht erforderlich, Funktionen zu reproduzieren, wenn bereits ein Steuerelement mit der gewünschten Funktionalität vorhanden ist.

Edit: Ich nahm die TextButtonStyle Vorlage und änderte die Marge auf Margin="3,-20,3,0" und dann FontSize="14" hinzugefügt.

Jetzt sieht es wie folgt aus:

enter image description here

Der Grund ist es so weit weg war, ist, dass die TextBlock Vorlage auf dem TextBlock im TextButtonStyle Template wie folgt aussieht:

<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> 

Hinweis der Abstand. Um das Problem zu beheben, mussten wir entweder einen negativen Rand auf dem Eltern erstellen (wie ich) oder einfach den Rand auf PageSubheaderTextStyle ändern.

+0

Yeah - mit textButtonStyle gibt die gleiche genaue Wirkung ... –

+0

@ShaharPrish Siehe meine Bearbeitung. Sie müssen nur leicht die Vorlage zwicken, um den gewünschten Effekt zu erhalten – mydogisbox

+0

Danke. Das scheint besser zu funktionieren - sieht immer noch nicht gut aus, aber zumindest ist es ausgerichtet. Ich wünschte, es "funktioniert einfach". –

Verwandte Themen