我有一个设计师的样式指南,看起来像一个超链接的按钮,我试图尽可能接近WPF样式。
但是我无法改变文字和下划线之间的距离。 我想添加图像进行比较,但不幸的是我到目前为止还没有获得足够的分数。
有没有办法改变文字和下划线之间的距离?
这是我到目前为止的XAML代码:
<Style x:Key="LinkButton" TargetType="ButtonBase">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ButtonBase">
<StackPanel Orientation="Horizontal">
<TextBlock Text="> "/>
<TextBlock TextDecorations="Underline">
<ContentPresenter/>
</TextBlock>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="{StaticResource LxGrayBrush}"/>
<Setter Property="FontSize" Value="12"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Foreground" Value="{StaticResource LxGreenBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
答案 0 :(得分:3)
使用element syntax向TextDecoration
添加TextBlock.TextDecorations
的实例,然后您可以调整Location
或PenOffset
。
<TextBlock>
<TextBlock.TextDecorations>
<TextDecoration Pen="..." Location="..."/>
</TextBlock.TextDecorations>
</TextBlock>
(您可能还需要设置Pen
via元素语法)
答案 1 :(得分:1)
<TextBlock >
Here is my text to be displayed
<TextBlock.TextDecorations>
<TextDecoration PenOffset="3" PenOffsetUnit="Pixel"/>
</TextBlock.TextDecorations>
</TextBlock>
调整PenOffset会增加/减少文本和线条之间的距离。
答案 2 :(得分:0)
您可以在它们之间添加Separator或设置Margin来完成此操作。
分离器:
<StackPanel Orientation="Horizontal">
<TextBlock Text="> "/>
<Separator Width="5" Visibility="Hidden" />
<TextBlock TextDecorations="Underline">
<ContentPresenter/>
</TextBlock>
</StackPanel>
页边距:
<StackPanel Orientation="Horizontal">
<TextBlock Text="> " Margin="0,0,5,0" />
<TextBlock TextDecorations="Underline">
<ContentPresenter/>
</TextBlock>
</StackPanel>
答案 3 :(得分:0)
为了让一行比“下划线”更接近文本,有“基线”。它的灵活性远不如 H.B.解决方案,但也更简单。
<TextBlock TextDecorations="Baseline" />