TextBlock Animation Opacity Bug

10-28-2009 6:30 PM |

Xaml is below. Animating the opacity on a container containing two TextBlocks. We just animate the opacity from 0 to 1 over 2 seconds. Both TextBlocks have their individual opacity set to 0.15. I would expect that when the parents opacity is animated from 0 to 1 the effective opacity of the TextBlocks would seem to interpolate from 0 to 0.15. The first TextBlock does just that and at the end of the animation looks like it has the proper opacity of 0.15. The second TextBlock seems to have an effective opacity of 1.0 when the animation completes. The only difference is that I have added a solid color opacity mask to the first TextBlock. If I use images in place of the TextBlocks it works as expected. This is confirmed both in Blend 3 and VisualStudio.

Bug?

<UserControl 
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	mc:Ignorable="d"
	x:Class="TestPage" 
	d:DesignWidth="640" d:DesignHeight="480">
	<UserControl.Resources>
		<Storyboard x:Name="Storyboard1">
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" 
                                 Storyboard.TargetName="StackPanel1"
                                 Storyboard.TargetProperty="(UIElement.Opacity)">
				<EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
				<EasingDoubleKeyFrame KeyTime="00:00:02" Value="1"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
	</UserControl.Resources>
	
	<Grid x:Name="LayoutRoot">
		<StackPanel x:Name="StackPanel1" HorizontalAlignment="Center" VerticalAlignment="Center">
			<TextBlock x:Name="textBlock1" Text="Text Block One" 
                                                                          FontSize="32" 
                                                                          Foreground="White"  
                                                                          Opacity="0.15" 
                                                                          OpacityMask="White"/>
			<TextBlock x:Name="textBlock2" 
                                                                          Text="Text Block Two" 
                                                                          FontSize="32"
                                                                          Foreground="White" 
                                                                          Opacity="0.15"/>
		</StackPanel>
	</Grid>
</UserControl>

Re: TextBlock Animation Opacity Bug

10-30-2009 12:04 AM |

I ran your sample and saw it as you described. Also...

http://www.silverlightshow.net/items/Silverlight-Bug-Transforms-and-OpacityMask.aspx