Superscript / subscript in hyperlink in WPF - wpf

I'm trying to make a Hyperlink that contains text with super- and/or subscripts. I've found two ways to do this, and both of them suck.
Solution #1: use Typography.Variants. This gives a terrific superscript... for some fonts.
<StackPanel>
<TextBlock FontFamily="Palatino Linotype" FontSize="30">
<Hyperlink>R<Run Typography.Variants="Superscript">2</Run></Hyperlink>
(Palatino Linotype)
</TextBlock>
<TextBlock FontFamily="Segoe UI" FontSize="30">
<Hyperlink>R<Run Typography.Variants="Superscript">2</Run></Hyperlink>
(Segoe UI)
</TextBlock>
</StackPanel>
(source: excastle.com)
Looks beautiful in Palatino Linotype; but for fonts that don't support variants, it's simply ignored, no emulation is done, and the text is full-size, at-baseline, 100% normal. I would prefer to allow my end-users to select the font they want to use, and still have super/subscripts work.
Solution #2: use BaselineAlignment. This raises or lowers the text appropriately, though unlike solution #1, I have to decrease the font size manually. Still, it's effective for all fonts. The problem is the Hyperlink's underline.
<TextBlock FontSize="30" FontFamily="Palatino Linotype">
<Hyperlink>
R<Run BaselineAlignment="Superscript" FontSize="12pt">2</Run>
</Hyperlink>
</TextBlock>
The underline is raised and lowered along with the text, which looks pretty wretched. I'd rather have a continuous, unbroken underline under the whole Hyperlink. (And before anyone suggests a Border, I'd also like the Hyperlink to be able to word-wrap, with all of the words underlined, including the first row.)
Is there any way to make superscript and subscript work in WPF, in any font, without looking laughably bad when underlined?

If the hyperlink isn't going to wrap to more than one line, then embedding another TextBlock can work:
<TextBlock FontSize="30" FontFamily="Palatino Linotype">
<Hyperlink>
<TextBlock>
R<Run BaselineAlignment="Superscript" FontSize="12pt">2</Run>
</TextBlock>
</Hyperlink>
</TextBlock>
This will give a solid hyperlink under the Hyperlink's child, which means an unbroken hyperlink:
However, if the embedded TextBlock needs to wrap to multiple lines, you'll only get one underline under the entire wrapped paragraph, rather than underlining each line of text:
(source: excastle.com)
If you can put a TextBlock only around a short bit of content that needs superscripts -- e.g., around just the R^2 in the above example -- and leave the rest of the text parented to the hyperlink, then you get underlining as normal. But sometimes that's not practical, so it's something to watch out for.

You can use the superscript unicode characters (e.g. http://www.fileformat.info/info/unicode/char/b2/index.htm)
Like this:
<TextBlock FontSize="30" FontFamily="Segoe UI">
<Hyperlink>
Apply R² Calculation
</Hyperlink>
</TextBlock>
Result:
Obviously this will not work unless what you are super scripting actually has a unicode superscript character.

Related

Copy pasting things in xaml auto-indents?

This is something that has bothered me for some time, and I'm not sure if it's some setting that can be turned off or not, but whenever I copy and paste something in xaml in VS 2010 it always auto-indents the line that I'm on and often the one after it for some reason. For example, say I have these lines of xaml code:
<TextBlock VerticalAlignment="Top" Foreground="Red" FontSize="11" Width="5"
Text="*" Visibility="{Binding Path=ShowInvalidFlag,UpdateSourceTrigger=PropertyChanged}" />
<TextBlock Width="Auto" Background="Transparent" Text="{Binding Path=QuestionValue}" />
and then I realize that the first TextBlock needs a Margin defined and I copy Margin="0,1,0,0" from another control within the same xaml document and paste it within the declaration of the above TextBlock it auto-indents and I end up with this:
<TextBlock VerticalAlignment="Top" Margin="0,1,0,0" Foreground="Red" FontSize="11" Width="5"
Text="*" Visibility="{Binding Path=ShowInvalidFlag,UpdateSourceTrigger=PropertyChanged}" />
<TextBlock Width="Auto" Background="Transparent" Text="{Binding Path=QuestionValue}" />
Why is it doing this? It doesn't even have to be copied from the same xaml file or even xaml code (I just tried copying random text from a text file and pasted it within the control and it still auto-indented). It's quite frustrating that every time I paste something in xaml I need to re-adjust my indentation.
Converted from comment:
If you search in the options in VS you should be able to find under Text Editor and Xaml an option for Indenting. By default it's set to "smart" which isn't always as smart as you might want it to be. Play around with that and see if it's more comfortable for you. Copy / pasting seems to be particularly prone to tripping it up.
In addition, you can also always so to "Edit" -> "Advanced" and then either "Format Document" or "Format Selection" to force Visual Studio to take another pass at formatting which may either fix, or make worse, your problem.
I think the problem is that it tries to optimize between speed and correctness. When you paste something it may not consider the entire context of where you are pasting and instead only look at the immediate parent and / or siblings which is a problem when you are pasting in a whole bunch of stuff.

Inline Run objects not completely highlighted when a hyphen is present

I've got this really weird problem where I'm doing highlighting on certain parts of text on a TextBlock object containing multiple Run objects.
<TextBlock Name="InlineTextBlock" Background="White">
<Run Foreground="White"
Background="Blue"
FontSize="75"
FontFamily="Helvetica">17-Oct-13</Run>
<Run Foreground="White"
Background="Blue"
FontSize="75"
FontFamily="Helvetica">17/Oct/13</Run>
</TextBlock>
It's pretty straightforward code to read, and from reading, you would expect both 17-Oct-13 and 17/Oct/13 to be completely highlighted with a Blue Background and White Foreground.
The odd thing is, the hyphen character has 1 pixel on the left and the right where the Background color is not being applied.
There are no issues with highlighting for the second Run object with 17/Oct/13.
Would appreciate any help to figure out this odd problem.
EDIT:
Running this on my computer displays the following (you'll have to look really closely to see it):
Also, I noticed this only occurs on certain fonts like Helvetica, Arial, Consolas (to name a few). Verdana seems to display fine.
Unfortunately, running your code on my computer does not suffer from this problem:
I'm guessing that you have something else causing your problem.
For your information, I'm running Visual Studio 2010 on Windows 7 and .NET 4.0.
UPDATE >>>
Thanks for the update... I can now confirm that I see your mysterious vertical white lines around the hyphens using the Helvetica font. I can't imagine what is causing it, but assuming that you can't set the main TextBlock.Background to Blue, you can still fix this issue by using an inner TextBlock with its Background set to Blue:
<TextBlock Name="InlineTextBlock" Background="White">
<TextBlock Background="Blue">
<Run Foreground="White"
Background="Blue"
FontSize="50"
FontFamily="Helvetica">17-Oct-13</Run>
<Run Foreground="White"
Background="Blue"
FontSize="50"
FontFamily="Helvetica">17/Oct/13</Run>
</TextBlock>
</TextBlock>

WPF TextWrapping on white spaces

I am using a TextBlock in WPF, on which I want to use TextWrapping, What I have done in XAML is as follows.
<TextBlock TextWrapping="Wrap" Grid.Column="0" Grid.ColumnSpan="4" Grid.Row="0" Margin="5,5,5,5">
<TextBlock.Text>
This is just a test. This is just a test.
</TextBlock.Text>
</TextBlock>
When I run this code it shows output like this
This is just a test. Th
is is just a test.
But I only want wrapping on white spaces like
This is just a test.
This is just a test.
I am unable to find why WPF is showing this behavior, I have tried WrapWithOverflow and IsHyphenationEnabled=true with no success. Please help me out?
Bizz is right, this shouldn't be the behavior of Text Wrapping, Just a wild guess, are you copy/pasting text from some where to Visual studio? there might be an issue with white spaces in that case, and WPF will wrap your text in wrong way.

Richtextbox: Embedd image and surround with text

I would like to embed an image in an Richtextbox in way that the image is sourrounded by text (should look like a newspaper article which contains some images).
That's what I have until now:
<RichTextBox>
<Paragraph>
<InlineUIContainer>
<Image Source="{Binding Image}" Width="200" Height="100" />
</InlineUIContainer>
<Run Text="{Binding Text}" />
</Paragraph>
</RichTextBox>
This code embedds the image in a way so that the first line of the run starts at the bottom right edge of the image.
But I would like to embedd it such a way:
http://i.stack.imgur.com/NVUNz.jpg
How can this be implemented for WP7.1?
Thanks.
I know this can be done, i believe you would be looking at either Margin or Padding around the image.....As the whole thing will look like an object because that's what it is.
so you want to put Padding or Margin around the image to push the text away from the object giving the appearance of space between the object. Also try Pushing the text to the right and the image to the left.
I hope this will help a little. :)
I don't think it can be done until FlowDocument will be available in Silverlight. Or somebody invents a similar control.

Silverlight TextBlock Text Attribute vs Content

When would I use the Text attribute of the <TextBlock> and when should I put my text in the content of the <TextBlock>?
<TextBlock Text="Example Text" />
vs.
<TextBlock>Example Text</TextBlock>
The former can be bound, whilst the latter is particularly useful when combining Runs:
<TextBlock Text="{Binding SomeProperty}"/>
<TextBlock>
<Run>You have </Run>
<Run Text="{Binding Count}"/>
<Run>items.</Run>
</TextBlock>
The use of the Text property has become common as a result of previous versions of the Xaml parser but the placing the text as content is more natural especially if you have a background in HTML.
The fact the many TextBlocks either have simple short chunks of literal text in or are bound. Would tip the balance IMO to using the Text property. In addition any globalisation that may come along latter may end with those literals being replaced by bindings as well.

Resources