WPF implements 3D flip animation and wpf3d flip Animation

WPF implements 3D flip animation and wpf3d flip Animation
1. Front-end code implementation

1.1 for principles, see code injection

<Grid MouseDown = "Grid_MouseDown"> <Viewport3D> <Viewport3D. Camera> <! -- Position attribute specifies the camera Position in 3D space, the LookDirection attribute is the camera direction --> <PerspectiveCamera Position = "0 0 500" LookDirection = "0 0-1"/> </Viewport3D. camera> <Viewport3D. children> <ContainerUIElement3D> <Viewport2DVisual3D> <Viewport2DVisual3D. geometry> <! -- Positions attribute indicates the vertex set of the Drawing Object, TriangleIndices attribute indicates the front and back of the object (WPF indicates the front side through a counter-clockwise circle), and TextureCoordinates attribute indicates that the 2D texture is mapped to the 3D object --> <! -- Generally derived from a 3D modeling tool --> <MeshGeometry3D Positions = "-200 200 0-200-200 0 200-200 0 200 200 0" TriangleIndices = "0 1 2 0 2 3 "TextureCoordinates =" 0 0 0 1 1 1 1 0 "/> </Viewport2DVisual3D. geometry> <Viewport2DVisual3D. material> <DiffuseMaterial Viewport2DVisual3D. isVisualHostMaterial = "True"/> </Viewport2DVisual3D. material> <Viewport2DVisual3D. visual> <! -- Place the front Custom User Control --> <Page: Win1 Width = "400" Height = "400"/> </Viewport2DVisual3D. visual> </Viewport2DVisual3D> <Viewport2DVisual3D> <Viewport2DVisual3D. geometry> <MeshGeometry3D Positions = "200 200 0 200-200 0-200-200 0-200 200 0" TriangleIndices = "0 1 2 0 2 3" TextureCoordinates = "0 0 0 0 1 1 1 1 0 "/> </Viewport2DVisual3D. geometry> <Viewport2DVisual3D. material> <DiffuseMaterial Viewport2DVisual3D. isVi SualHostMaterial = "True"/> </Viewport2DVisual3D. Material> <Viewport2DVisual3D. Visual> <! -- Place the opposite Custom User Control --> <Page: Win2 Width = "400" Height = "400"/> </Viewport2DVisual3D. visual> </Viewport2DVisual3D> <ContainerUIElement3D. transform> <RotateTransform3D> <RotateTransform3D. rotation> <! -- Set the Axis of rotation to the Y Axis of the alignment Coordinate System --> <AxisAngleRotation3D x: Name = "aar" Angle = "0" Axis = "0 1 0"/> </RotateTransform3D. rotation> </RotateTransform3D> </ContainerUIElement3D. transform> </ContainerUIElement3D> <ModelVisual3D> <ModelVisual3D. content> <! -- Set the parallel Ray filling scenario for propagation in the specified direction --> <DirectionalLight Color = "Transparent"/> </ModelVisual3D. content> </ModelVisual3D> </Viewport3D. children> </Viewport3D> </Grid>

2. backend code implementation

2.1 click the flip animation to display the opposite side of the object at 180 degrees, and double-click the flip animation to display the front of the object at 0 degrees.

private void Grid_MouseDown(object sender, MouseButtonEventArgs e){    DoubleAnimation da = new DoubleAnimation();    da.Duration = new Duration(TimeSpan.FromSeconds(1));    if (e.ClickCount == 2)        da.To = 0d;    else        da.To = 180d;    AxisAngleRotation3D aar = Application.Current.MainWindow.FindName("aar") as AxisAngleRotation3D;    aar.BeginAnimation(AxisAngleRotation3D.AngleProperty, da);  }

3. Running Effect

3.1 as follows

You are welcome to reprint it, but please indicate the source: http://www.cnblogs.com/julyweb/. thank you!