How do I make an asterisk line up with surrounding text in WPF?
I'm trying to make an asterisk line up vertically with surrounding text/graphics rather than above it.
I thought applying a negative BaselineOffset would be the solution, but it seems to have no effect.
Here's the documentation for the TextBlock.BaselineOffset property:
Property Value Type: System.Double
The amount by which each line of text is offset from the baseline, in device independent pixels. Double.NaN indicates that an optimal baseline offset is automatically calculated from the current font characteristics. The default is Double.NaN.
Remarks
The baseline is the imaginary horizontal line with which the base of each character in a > line of开发者_如何学运维 text is aligned.
Sample markup:
<TextBlock
Name="ReadUnreadIndicator"
Grid.Column="0"
VerticalAlignment="Center"
FontWeight="Bold"
FontSize="24"
BaselineOffset="-10"
Text="*" />
No matter what I put for BaselineOffset, the asterisk always appears "superscript".
Questions:
Why isn't BaselineOffset working for me? Am I using it wrong or is it a bug in the framework?
How can I move the asterisk downward without using margin (which would create space above the TextBlock that I don't want)?
As far as I know the TextBlock.BaselineOffset
only affects a TextBlock
inside another TextBlock
:
<TextBlock>Some text <TextBlock BaseLineOffset="10" Text="*"/></TextBlock>
Adjusting BaseLineOffset
allows you to move the asterisk vertically in relation to "Some Text". Note that the default BaseLineOffset
indicated by Double.NaN
is different from 0 and you probably need a positive offset to avoid moving the asterisk too far down.
But as you have indicated in your comment using the BaseLineOffset
isn't a good solution. The problem seems to be that the asterisk glyph isn't placed to your liking. I would suggest that you switch to your own glyph drawn in WPF with the proper placement and looks and than place that next to the text using something like a StackPanel
to line them up.
Here's what I ended up going with:
<TextBlock
Name="ReadUnreadIndicator"
Grid.Column="0"
Margin="0,5,0,-5"
FontSize="24"
FontWeight="Bold"
Text="*" />
Thanks to @Martin & @Gimalay for the help.
This seems to align the asterisk properly:
<TextBlock
Grid.Column="0">
<TextBlock
Name="ReadUnreadIndicator"
BaselineOffset="30"
FontFamily="Courier New"
FontSize="24"
FontWeight="Bold"
Text="٭" />
</TextBlock>
The Text
is actually an "Arabic Five Pointed Star" (U+066D) rather than an asterisk, but it looks very similar.
I have no idea why the BaselineOffset
needs to be "30" to work properly. It clearly isn't moving the text up by 30 pixels--it moves it up maybe 2 or 3 pixels.
精彩评论