Make a continuously spinning cube with WPF, XAML, and C#

continuously spinning 3D cube

This example is similar to the previous one Rotate a 3D cube using XAML and C# except it displays a continuously spinning 3D cube.

The basic structure of the program’s 3D objects is similar to that of the previous example. The main differences are that the new Model3DGroup object has a name so the XAML code can refer to it and that the Model3DGroup now has a transformation. The following code shows the definition of the Model3DGroup object.

<Model3DGroup x:Name="CubeModel">
            <RotateTransform3D />

The Window object uses the following code to define a Storyboard named RotateStoryboard.

    <Storyboard x:Key="RotateStoryboard">
         BeginTime="00:00:00" RepeatBehavior="Forever"
            <SplineRotation3DKeyFrame KeyTime="00:00:02">
                    <AxisAngleRotation3D Angle="180" Axis="0,1,0"/>
            <SplineRotation3DKeyFrame KeyTime="00:00:04">
                    <AxisAngleRotation3D Angle="359" Axis="0,1,0"/>

The Storyboard contains a Rotation3DAnimationUsingKeyFrames object to modify a rotation. The target of the animation (the object that is animated) is CubeModel. The property that is animated is that object’s (Model3D.Transform).(Transform3DGroup.Children)[0].(RotateTransform3D.Rotation) property. This mess (which was pretty hard to figure out) means go to the model’s Transform property, find its third Transform3DGroup child, and modify the resulting object’s RotateTransform3D.Rotation property.

The two SplineRotation3DKeyFrame objects inside the Rotation3DAnimationUsingKeyFrames give the values that the property should have at various times while the Storyboard is executing. In this example, the rotation should be 180 degrees rotated around the Y axis 2 seconds after the Storyboard starts and, 259 rotated degrees around the Y axis 4 seconds after the animation starts. Notice that the Storyboard object’s RepeatBehavior is Forever so it repeats after it finishes.

Having defined the resource dictionary containing the Storyboard, the Window also defines a trigger to start the Storyboard when the window is loaded.

    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
        <BeginStoryboard Storyboard="{StaticResource RotateModel}"/>

This trigger starts when the framework element loads. It starts the Storyboard, and that animates the cube’s rotation (forever).

Download Example   Follow me on Twitter   RSS feed   Donate

This entry was posted in animation, graphics, wpf, XAML and tagged , , , , , , , , , , , , , , . Bookmark the permalink.

3 Responses to Make a continuously spinning cube with WPF, XAML, and C#

  1. Pantelitsa says:

    I found your project very helpful but what if I want to rotate a model that is already opened from a path like:

    void XplorerMainWindow_Loaded(object sender, RoutedEventArgs e)
        var model = XbimModel.CreateTemporaryModel();
        ModelProvider.ObjectInstance = model;
        string ifcfile = "BIMLogo.ifc";
        string ifcLongFile = @"C:\Users\Litsa\Desktop\Files\Xbim\XbimWindowsUI-master1\XbimXplorer\" + ifcfile;

    and what c# code should I use so the I will call the XAML in my .cs file?

  2. RodStephens says:

    Sorry but I’m not familiar with this kind of model, but my guess is that you can probably apply a transformation to the model after you load it. (If you can’t, that would greatly reduce the usefulness of the model.) If that’s true, then you should be able to animate the transformation much as this example does. Ir at least you should be able to change the transformation yourself in a timer’s Tick event handler.

    and what c# code should I use so the I will call the XAML in my .cs file?

    I’m not sure what you mean by this. Do you mean you want to load a XAML file at run time? If so, see this blog post:

    Dynamically Loading XAML

    • Pantelitsa says:

      Hey, Thank you so much for your reply I’ll try to do what you said. And About the question what C# code should I use to call the XAML, I figured that out how, and yes it is like the example you sent me.

      Thank you again 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.