Multiple Colors In TextBlock - xaml

Is it possible to add dynamic colors to a TextBlock ..i.e. have one character in one color and the next in another color.
<TextBlock Text="{Binding no}" TextWrapping="Wrap" Margin="10,0,0,0" Style="{StaticResource PhoneTextSubtleStyle}" FontSize="40" Foreground="#A400C4FF" >
// Can we add something here to specify what colours for what chars
</TextBlock>
Basically I input a dynamic 4 character sequence from no. I've bound it to this TextBlock inside a ListBox. Is it possible to have the characters in different colors.
If so is it possible to add these colors dynamically for eg. If I click a button certain characters change color?
Thank You. Any Help is appreciated.

Actually, you can, which can come in handy when you're doing a StringFormat on a data bound Textblock or a number of other places.
If you did want to try it though, like here's an SL example for a form label that puts a red asterisk next to the text Required Fields, but then can also add more stuff to it as shown in the example. Should work for Silverlight, WPF, UWP, etc...
<TextBlock>
<Run Text="*" Foreground="#FFE10101"/><Run Text="Required Line" />
<Run Text="Red" Foreground="Red"/>
<Run Text="Blue" Foreground="Blue"/>
<Run Text="{Binding SomeString, StringFormat='Hell ya you can make \{0\} a different color!'}" Foreground="Orange"/>
</TextBlock>

I'm developing for Mango with the WP7 SDK. You can use a <Run>. It seems a little buggy on WP7 , you have to add a spaces on the Run.Text property to get the spacing correct:
<TextBlock>Hello<Run Foreground="Bisque" Text=" Holla "></Run>and hello again!</TextBlock>;

to set foreground color dynamically to a textblock
use: txtblockname.Foreground= new SolidColorBrush(Colors.Yellow);

The TextBlock does not support multiple Foreground colors.
You could recreate this behaviour by using multiple textblocks (one for each letter) and placing them within a wrappanel. You could then change the color of individual characters/letters as you wish.
Beware of the probable performance impact this may have. The margins around individual letters will need to be adjusted to recreate standard behaviour though. Be especially careful around punctuation.

Related

Xamarin Line Breaking does not seem to honor Horizontal Options or Row Height AUTO

I have the following Xaml inside a Grid:
<Label Grid.Row="4" Grid.Column="0" Text="Special characters" HorizontalOptions="End" VerticalOptions="CenterAndExpand" LineBreakMode="WordWrap"/>
The Row Height is AUTO. When the column is wide enough for the text all works as expected. But if the column becomes so narrow that the text does not fit on one line, Xamarin seems to honor neither the HorizontalOptions="End" nor the Row Height of AUTO. I get something like the following (I am using | to represent the width of the column) but with the bottom half of the word "characters" cut off.
|Special |
|Characters |
If I force the break with a hard line break ( & # 10 ;) then it solves the row height issue -- all of the word "characters" appears -- but the justification is better but still wrong:
| Special |
| Characters|
I have tried various combinations of End and EndAndExpand and Center and CenterAndExpand.
Anyone have a solution or a clue?
Thanks,
Use HorizontalTextAlignment=“End”

Silver Light : How to set unit as constant in a textbox

I want to display some value in a TextBox in Silverlight, but I need to set a unit value that remains constant.
Example:
100 gpm
I need to change the value (100), but the unit (gpm) should always stay static.
Here is my current Binding.
<TextBox Text="{Binding Path=Current.SystemDemand,Mode=TwoWay}" />
If you are using Binding on the TextBox You can set the Format of the Binding.
Here is how you set the format in Xaml
<TextBox x:Name="myTextBox" Text="{Binding Path=Current.SystemDemand, Mode=TwoWay, StringFormat='\{0} gpm'}" />
What the question author's approach and the accepted answer have in common is that they mix up the (editable) value and the (non-editable) unit.
Why not place an ordinary TextBlock containing the unit near the end of your TextBox?
You can even use a Grid to have the unit appear "inside" the TextBox.
<Grid>
<TextBox Text="{Binding...StringToNumberConverter...etc}" Padding="0,0,24,0"/>
<TextBlock Text="gpm" HorizontalAlignment="Right" IsHitTestVisible="false"/>
</Grid>

Show '...' when text is longer that the area in textblock

Some days back i saw an example of what i need now but couldn't remind what was the way.
I want to show the text description in TextBlock and if the text is more that the size of text block, show the ...
Use below code to achieve this,
<TextBlock Text="{StaticResource someText}"
TextWrapping="Wrap" TextTrimming="CharacterEllipsis"
Margin="10"/>
And possible values of TextTrimming are as below,
None – no ellipsis, text is clipped (the default)
CharacterEllipsis – display as many characters as possible, followed
by an ellipsis
WordEllipsis – display as many words as possible, followed by an
ellipsis
I know link only answer are frowned upon but
TextBlock.TextTrimming Property
<TextBlock
Name="myTextBlock"
Margin="20" Background="LightGoldenrodYellow"
TextTrimming="WordEllipsis" TextWrapping="NoWrap"
FontSize="14">
One<LineBreak/>
two two<LineBreak/>
Three Three Three<LineBreak/>
four four four four<LineBreak/>
Five Five Five Five Five<LineBreak/>
six six six six six six<LineBreak/>
Seven Seven Seven Seven Seven Seven Seven
</TextBlock>

Align control on the right in grid

I have a grid with 3 columns:
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
I want to have the last column align on the right, near to edge of screen.
Currently, the third column occurs soon after the second. I don't want to pass width in pixels, rather automatic calculation.
I have tried to use on the element in third column property HorizontalAlignment="Right", but unfortunately it's not working.
If your Grid is inside of a Stackpanel , no matter what you do it'll only resize iteself to the width of Stackpanel.
If your last column definitions is Auto , you can't align it to the right of the screen.Change 2nd definition to Auto and the last one to *.
Since your last column has Auto width, setting HorizontalAlignement of the content to Right should not be necessary. My guess would be either
your Grid doesn't have a HorizontalAlignement value of Stretch (which should be default), or
whatever contains the Grid (a StackPanel maybe?) is not giving it the full width.
I could be sure if I could check the rest of the XAML. Check these two things first. If these don't help, please post the rest of your XAML.
If you have the same type of controls inside the grid, you can assign a style for all of them in <Grid.Resources>, with setting the HorizontalAlignment property only if the Grid.Column property's value is 2 (with triggers).
But it is even easier for looping through all the children, and checking the column property of each and then setting the alignment, like
foreach (Control ctrl in yourGrid.Children) {
if(Grid.GetColumn(ctrl) == 2) ctrl.HorizontalAlignment = HorizontalAlignment.Right;
}

Writing XML Exactly as XML Literals are Written

I'm transforming some XML from DrawingML to XAML. Unfortunately, the XAML one is not working as expected with white spaces, but I have found a work around. Here's the problem:
Problem Statment
I want to write the following in a TextBlock:
Hi John, what did Sushi A say to
Sushi B?
So I would write:
<TextBlock>
<Run>Hey</Run>
<Run FontWeight="Bold">John</Run>
<Run>,</Run>
<Run FontStyle="Italic">what did Sushi A say to Sushi B?</Run>
</TextBlock>
This doesn't produce the desired results. Instead, it produces:
Hi John , what did Sushi A say to
Sushi B?
Notice the space now between "John" and ","? Weird, eh? This is because XAML appends a space between runs. I don't know why it does this. I really do need the formatting exactly as above, so the option of changing formatting, like making the comma bold too is not an option.
Partial Solution
The weirder thing is that there is a way around this - i.e. to lose the extra space that XAML adds - you have to put your runs on the same line. I have no idea why, but that's the case. So the following actually works just fine:
<TextBlock>
<Run>Hey</Run>
<Run FontWeight="Bold">John</Run><Run>,</Run>
<Run FontStyle="Italic">what did Sushi A say to Sushi B?</Run>
</TextBlock>
Notice runs #2 and #3 (of 4 runs) are now on the same line.
Question
The issue I'm having is that I haven't found a way to write the above using XML Literals. If I try this:
Dim tb = <TextBlock>
<Run>Hey</Run>
<Run FontWeight="Bold">John</Run><Run>,</Run>
<Run FontStyle="Italic">what did Sushi A say to Sushi B?</Run>
</TextBlock>
it is always created as the below, with the 4 runs on seperate lines:
<TextBlock>
<Run>Hey</Run>
<Run FontWeight="Bold">John</Run>
<Run>,</Run>
<Run FontStyle="Italic">what did Sushi A say to Sushi B?</Run>
</TextBlock>
Does anyone know how XML can be written exactly as written in XML Literals?
Bonus
If you answer the question correctly, I'll tell you the punchline of the joke :)
I don't suppose using a span will help you (as it will keep non-formatted text out of XML elements so it might not get auto-formatted).
i.e.
<TextBlock>
<Span>
Hey
<Bold>John</Bold>,
<Italic>what did Sushi A say to Sushi B?</Italic>
</Span>
</TextBlock>
Obviously this only fixes the specific case not the general, I would probably suggest not using XML literals :)
Any chance the unicode backspace character would solve your problem?
http://www.fileformat.info/info/unicode/char/0008/index.htm
Update
One other idea. Have you looked into the XDocument.Save(TextWriter textWriter, SaveOptions saveOptions) method? The documentation says that if you use SaveOptions.DisableFormatting, it will preserve spacing.