Another Mix08 sample

I’ve posted the first sample I showed in my Mix08 session. The gratuitous use if video and animations is designed to show how well Silverlight 1.0 features (media and animations) work with the Silverlight 2 control model.  In this sample, I show a rotating TextBox using separate VideoBrushes for both the foreground text and the background.  Here’s what it looks like:

Mix08 Part1 Sample

This is a fully declarative sample.  The XAML for this sample is shown below:

<UserControl x:Class=”Mix08.Page” xmlns=”″ xmlns:x=

    MinWidth=”800″ MinHeight=”600″>

  <Grid x:Name=”LayoutRoot”>

    <!– Set Background –>


      <LinearGradientBrush StartPoint=”0.547587,0.322135″ EndPoint=”0.547587,0.992095″>


          <GradientStop Color=”#FFDCEAF8″ Offset=”0″/>

          <GradientStop Color=”#00FFFFFF” Offset=”1″/>





    <!– Center a StackPanel –>

    <StackPanel Margin=”4″ HorizontalAlignment=”Center” Orientation=”Horizontal”>


      <!– Add a multi-line textbox (set AcceptsReturn to true) –>

      <TextBox x:Name=”tb” FontSize=”60″ Width=”600″ Height=”400″ AcceptsReturn=”True”>


         <!– Rotate the text box.  Have the rotation start when the page loads (via Canvas.Loaded trigger) –>


          <EventTrigger RoutedEvent=”Canvas.Loaded”>



                <Storyboard x:Name=”spin” BeginTime=”0″ RepeatBehavior=”Forever”>

                  <DoubleAnimation Storyboard.TargetName=”rot” Storyboard.TargetProperty=”Angle” To=”360″ Duration=”0:0:30″/>








         <!– Add a rotation transform (this is animated above using the “spin” storyboard –> 


          <RotateTransform x:Name=”rot” Angle=”0″ CenterX=”300″ CenterY=”200″/>



         <!– Set the background to the a video brush (Dolphins.wmv).  Note this is a very large video (~40MB) –>  


          <VideoBrush SourceName=”me” Stretch=”UniformToFill”/>



         <!– Set the foreground to another video –>   


          <VideoBrush SourceName=”me2″ Stretch=”UniformToFill”/>




      <!– Make a video button by setting the Button content to a MediaElement –>    

      <Button FontSize=”60″ Width=”100″ Height=”90″>

        <MediaElement x:Name=”me2″ IsMuted=”True” Source=””/>




    <!– Add a hidden media element – this is used by the TextBox background brush –>    

    <MediaElement x:Name=”me” Width=”0″ Opacity=”0″ Source=””/>




Comments (5)

  1. Garry Trinder says:

    Love the new UserControl methods bro, awesome!

  2. kierepka says:

    Nice, but Polish national characters can’t be inserted into text box! I must send this as a bug in SL 2.0 Beta

  3. Don&#39;t even think this is all there is… this is just the surface 10%, I think it&#39;ll take me

Skip to main content