Blend Image refresh with transitionControl

2 posts, 0 answers
  1. Ariel
    Ariel avatar
    2 posts
    Member since:
    Jul 2012

    Posted 19 Jul 2012 Link to this post

    Hi, I have a panel with many Images from webcams, each Image is refreshing each 30 seconts. I'm looking for a way to make the flicker soften when I refresh these images, containing these images into a transitioncontrol. But when I refresh an image this still flickering.

    Each Image is into a TileViewItem like this:

                <telerik:RadTileViewItem Header="Av. Rivadavia y Av. Pueyrredón" Width="{StaticResource TileViewItemWidth}" Height="{StaticResource TileViewItemHeight}">
                    <telerik:RadFluidContentControl ContentChangeMode="Manual">
                            <telerik:RadTransitionControl  Duration="00:00:03">
                                    <telerik:MotionBlurredZoomTransition />
                                        <Image Source=";SegundosActualizacion=30&amp;MostrarNoImagen=1" x:Name="imgCam1s" Stretch="Fill" HorizontalAlignment="Left" VerticalAlignment="Top" />                                
                        <telerik:RadFluidContentControl.Content >
                            <Image Source=";SegundosActualizacion=30&amp;MostrarNoImagen=1" x:Name="imgCam1c" Stretch="Fill" HorizontalAlignment="Left" VerticalAlignment="Top" />
                            <Image Source=";SegundosActualizacion=30&amp;MostrarNoImagen=1" x:Name="imgCam1l" Stretch="Fill" HorizontalAlignment="Left" VerticalAlignment="Top"/>

    I call the refresh changing the Image source adding a ?rnd=XXX parameter to the url.

    Maybe I don't understanding how this component works.
  2. Rosen Vladimirov
    Rosen Vladimirov avatar
    644 posts

    Posted 20 Jul 2012 Link to this post


    We have created a sample project to illustrate one possible solution to your problem. The RadTransitionControl is only applying transitions when the Content is changed, that`s why you have to bind the content and to change the images which you are using (for more information visit our online help: )
    Before setting the new image as a TransitionControl Content you`ll have to be sure that it has been downloaded. If you set it before it is downloaded the transition will still be triggered and you will see an animation from the old image to a blank screen. Then when the new image loads it will appear immediately without transition. So we are using the following:
    bitmapImage.CreateOptions = BitmapCreateOptions.None;
    to make the image load as soon as possible
    (more information here ) and we are setting the TransitionControl Content after the image is downloaded successfully (using ImageOpened event)

    Please check the attached project and hopefully it`ll help you to resolve the issue. Inform us in case of any concerns.

    Rosen Vladimirov
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top