Partial Text color update - wpf

Question

Here is what i've
<StackPanel>
<TextBlock> abc </TextBlock>
<Textblock> def </Textblock>
<Textblock> ghi </Textblock>
</Stackpanel>
Now on GUI i show all three textblock's text in single line like : abcdefghi . I want to update the partial text color (irrespective of which textblock the textbelong.
Say i want to change the color of 40% of total text to red and other as white. (also the percentage amount is too variable) It will update by Binding. So no hardcoding for text % and any specific textblock.
Done by -.How to make text color appear differently using 2 textblock for a single text

Answer 1

You can do this with one TextBlock, a LinearGradient and a few attached properties, as long as you don't mind letters being partially colored.
EDIT: I decided to write a post showing the solution with attached properties, but in the meanwhile you could use simple XAML and bindings like so:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition />
</Grid.RowDefinitions>
<TextBlock FontSize="34" FontWeight="Bold"
Text="{Binding Value, ElementName=slider, StringFormat={}{0:p0} of this text is coloured}">
<TextBlock.Foreground>
<LinearGradientBrush EndPoint="1 0">
<GradientStop Color="BurlyWood" />
<GradientStop Color="BurlyWood" Offset="{Binding Value, ElementName=slider}" />
<GradientStop Color="Beige" Offset="{Binding Value, ElementName=slider}" />
<GradientStop Color="Beige" Offset="1" />
</LinearGradientBrush>
</TextBlock.Foreground>
</TextBlock>
<Slider x:Name="slider" Grid.Row="1" Minimum="0" Maximum="1" Value="0.4" />
</Grid>
And if you're interested by the solution using attached properties, you can visit Partially Coloured TextBlock on my blog.