Поддерживает ли Windows Composition API 2,5D проецируемое вращение?

Question

Я начал использовать Windows Composition API в приложениях UWP для анимации элементов пользовательского интерфейса.

Визуальные элементы предоставляют свойства RotationAngleInDegrees и RotationAngle, а также свойство RotationAxis.

Когда я анимирую значение RotationAngleInDegrees прямоугольного объекта вокруг оси Y, прямоугольник поворачивается, как я и ожидал, но в окне 2D-приложения он не отображается с проекцией 2.5D.

Есть ли способ получить эффект проекции 2.5D для вращений с помощью композиции api?

Answer 1

Это зависит от того эффекта, который вы хотите получить.На GitHub имеется бесплатный образец приложения для дизайна, а здесь - ссылка.Вы сможете скачать демоверсию из store .И вы можете получить представление об образцах глубины.Например, переверните, чтобы показать, показывает способ поворота карты изображения, и вы можете найти исходный код от здесь .Для получения более подробной информации, пожалуйста, проверьте образец и демо.

В общем, анимация должна вращаться по оси X:

rectanglevisual.RotationAxis = new System.Numerics.Vector3 (1f, 0f, 0f);

А затем использовать анимацию поворота для поворота на основе RotationAngleInDegrees.

Также вы можете сделать это непосредственно на платформе XAML с помощью PlaneProjection из управления изображением.

Answer 2

Как показывает пример, на который @BarryWang указал мне, необходимо применить TransformMatrix к странице (или родительскому контейнеру) перед выполнением анимации, чтобы получить эффект 2.5D с вращением или другие анимации пространственного преобразования с составом API..

    private void UpdatePerspective()
    {
        Visual visual = ElementCompositionPreview.GetElementVisual(MainPanel);

        // Get the size of the area we are enabling perspective for
        Vector2 sizeList = new Vector2((float)MainPanel.ActualWidth, (float)MainPanel.ActualHeight);

        // Setup the perspective transform.
        Matrix4x4 perspective = new Matrix4x4(

                    1.0f, 0.0f, 0.0f, 0.0f,

                    0.0f, 1.0f, 0.0f, 0.0f,

                    0.0f, 0.0f, 1.0f, -1.0f / sizeList.X,

                    0.0f, 0.0f, 0.0f, 1.0f);

        // Set the parent transform to apply perspective to all children
        visual.TransformMatrix =

                           Matrix4x4.CreateTranslation(-sizeList.X / 2, -sizeList.Y / 2, 0f) *      // Translate to origin

                           perspective *                                                            // Apply perspective at origin

                           Matrix4x4.CreateTranslation(sizeList.X / 2, sizeList.Y / 2, 0f);         // Translate back to original position
    }