Powered by MSDN

US - English
NEW! Silverlight 5 is available Learn More

Silverlight 5 Composition thread doesn't work with images RSS

4 replies

Last post Jun 01, 2011 12:33 PM by MisterGoodcat

(0)
  • sjmueller

    sjmueller

    Member

    38 Points

    16 Posts

    Silverlight 5 Composition thread doesn't work with images

    May 31, 2011 06:16 AM | LINK

    I wanted to see if I could improve my application's home grown busy indicator in Silverlight 5 by moving the animation to the Composition thread.  From what I understand, there are three basic steps to offload a 2d animation:


    1. set enableGpuAcceleration to true

    2. add CacheMode="BitmapCache" to the element you wish to animate on the Composition thread

    3. remove any unsupported properties (such as DropshadowEffects or OpacityMask


    I did this with two very basic elements for the first test:


    <Rectangle x:Name="Test1" CacheMode="BitmapCache" Width="20" Height="40" Fill="Aqua">
    	<Rectangle.RenderTransform>
    		<RotateTransform />
    	</Rectangle.RenderTransform>
    </Rectangle>
    <Image x:Name="Test2" CacheMode="BitmapCache" Source="/Namespace;component/assets/images/spinner.png" Stretch="None" RenderTransformOrigin="0.5,0.5">
    	<Image.RenderTransform>
    		<RotateTransform/>
    	</Image.RenderTransform>
    </Image>


    I then added an event trigger onload with a BeginStoryboard for both elements:

    <EventTrigger RoutedEvent="Grid.Loaded">
    	<BeginStoryboard>
    		<Storyboard RepeatBehavior="Forever">
    			<DoubleAnimation Duration="0:0:1.5" From="-180" To="180" Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="Test1"/>
    		</Storyboard>
    	</BeginStoryboard>
    	<BeginStoryboard>
    		<Storyboard RepeatBehavior="Forever">
    			<DoubleAnimation Duration="0:0:1.5" From="-180" To="180" Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="Test2"/>
    		</Storyboard>
    	</BeginStoryboard>
    </EventTrigger>


    Finally, I inserted a Thread.Sleep in some code that runs on the UI thread.  While the UI thread is sleeping, the Rectangle element keeps spinning while the Image element stops for the entire duration of the sleep.

    Is GPU acceleration on the composition thread broken for some elements?  What is a reliable way to determine if a UIElement is eligible and/or configured properly for rendering animations off the UI thread?  If trial and error is the only way, then I can't imagine harnessing the power of the composition thread on a complex control that hosts multiple UI elements; it would be a nightmare to determine which problem element is preventing gpu acceleration!

  • MisterGoodcat

    MisterGoodcat

    All-Star

    32099 Points

    4704 Posts

    Re: Silverlight 5 Composition thread doesn't work with images

    May 31, 2011 07:17 AM | LINK

    Hi. The trick here is to use some container, for example a Canvas, and attribute that container with the cache mode:

    <Canvas HorizontalAlignment="Left"
            VerticalAlignment="Top"
            CacheMode="BitmapCache"
            Width="200"
            Height="200">
    
        <Image Source="/image.jpg"
                HorizontalAlignment="Left"
                VerticalAlignment="Top"
                Width="200"
                Height="200">
        </Image>
    </Canvas>


    I don't know if this will be fixed for the image control in the final version.


  • sjmueller

    sjmueller

    Member

    38 Points

    16 Posts

    Re: Re: Silverlight 5 Composition thread doesn't work with images

    May 31, 2011 03:00 PM | LINK

    Peter,

    Thanks for the quick reply;  I'll try that to see if it works.  But what worries me most is that I originally tried setting the CacheMode on my custom busy indicator, which has several elements (ContentControl, ContentPresenter, Rectangles, Grids, etc).  It obviously didn't work, but how would I go about intelligently crafting the control to be eligible for animations on the composition thread if there are random undocumented elements that just don't work?

    I was very hopeful that Silverlight 5 would be a big jump in performance with both animations and element-rich visual trees, but I'm not seeing a pathway to achieve those performance gains with the beta.

  • sjmueller

    sjmueller

    Member

    38 Points

    16 Posts

    Re: Re: Re: Silverlight 5 Composition thread doesn't work with images

    Jun 01, 2011 05:59 AM | LINK

    I figured out the problem; I left my animation pointing to the wrong element.  I wrote a post about my findings on my blog:

    http://samuelmueller.com/2011/06/silverlight-5-animations-on-the-composition-thread/

  • MisterGoodcat

    MisterGoodcat

    All-Star

    32099 Points

    4704 Posts

    Re: Re: Re: Silverlight 5 Composition thread doesn't work with images

    Jun 01, 2011 12:33 PM | LINK

    Hi again. Thanks for the blog post, and it's also good to read an official statement that MS is aware of the bug with the image control.

    Yes, the animation target is crucial here. If you animate a child element the cache has to be recreated, as that animation cannot be performed on the bitmap. As soon as you animate the cached element itself there's no such problem and it will work.