Тип QML PropertyAnimation

Анимирует изменения значений свойств. Подробнее...

• Список всех членов, включая наследуемые члены

Свойства

• duration : int
• easing
  • easing.amplitude : real
  • easing.bezierCurve : list<real>
  • easing.overshoot : real
  • easing.period : real
  • easing.type : перечисление
• exclude : list<Object>
• from : variant
• properties : string
• property : string
• target : Object
• targets : list<Object>
• to : variant

Подробное описание

PropertyAnimation предоставляет способ анимировать изменения значения свойства.

Его можно использовать для определения анимации несколькими способами:

• В Переходе

  Например, чтобы анимировать все объекты, изменившие свойства x или y в результате изменения состояния, используя кривую сглаживания InOutQuad:

  Rectangle {
      id: rect
      width: 100; height: 100
      color: "red"
  
      states: State {
          name: "moved"
          PropertyChanges { target: rect; x: 50 }
      }
  
      transitions: Transition {
          PropertyAnimation { properties: "x,y"; easing.type: Easing.InOutQuad }
      }
  }

• В Поведении

  Например, чтобы анимировать все изменения свойства x прямоугольника:

  Rectangle {
      width: 100; height: 100
      color: "red"
  
      Behavior on x { PropertyAnimation {} }
  
      MouseArea { anchors.fill: parent; onClicked: parent.x = 50 }
  }

• В качестве источника значения свойства

  Например, чтобы повторно анимировать свойство x прямоугольника:

  Rectangle {
      width: 100; height: 100
      color: "red"
  
      SequentialAnimation on x {
          loops: Animation.Infinite
          PropertyAnimation { to: 50 }
          PropertyAnimation { to: 0 }
      }
  }

• В обработчике сигнала

  Например, чтобы затемнить theObject при нажатии:

  MouseArea {
      anchors.fill: theObject
      onClicked: PropertyAnimation { target: theObject; property: "opacity"; to: 0 }
  }

• Отдельно

  Например, чтобы анимировать свойство rect width в течение 500 мс, от текущей ширины до 30:

  Rectangle {
      id: theRect
      width: 100; height: 100
      color: "red"
  
      // this is a standalone animation, it's not running by default
      PropertyAnimation { id: animation;
                          target: theRect;
                          property: "width";
                          to: 30;
                          duration: 500 }
  
      MouseArea { anchors.fill: parent; onClicked: animation.running = true }
  }

В зависимости от того, как используется анимация, набор используемых свойств будет отличаться. Дополнительную информацию см. в документации по отдельным свойствам, а также в разделе Анимация и переходы в Qt Quick.

Обратите внимание, что PropertyAnimation наследует абстрактный тип Animation. Это включает дополнительные свойства и методы для управления анимацией.

См. также Анимация и переходы в Qt Quick и Примеры Qt Quick — Анимация.

Документация по свойствам

Эти свойства используются как набор для определения свойств, которые должны быть анимированы. Единичная и множественная формы функционально идентичны, например:

NumberAnimation { target: theItem; property: "x"; to: 500 }

имеет такое же значение, как

NumberAnimation { targets: theItem; properties: "x"; to: 500 }

Единичные формы немного оптимизированы, поэтому если у вас есть только один целевой объект/свойство для анимации, вы должны попытаться использовать их.

Свойство targets позволяет установить несколько целевых объектов. Например, это анимирует свойство x как для itemA, так и для itemB:

NumberAnimation { targets: [itemA, itemB]; properties: "x"; to: 500 }

Во многих случаях эти свойства не нужно явно указывать, так как они могут быть выведены из фреймворка анимации:

Rectangle {
    id: theRect
    width: 100; height: 100
    color: Qt.rgba(0,0,1)
    NumberAnimation on x { to: 500; loops: Animation.Infinite } //animate theRect's x property
    Behavior on y { NumberAnimation {} } //animate theRect's y property
}

Rectangle {
    id: theRect
    width: 100; height: 100
    color: Qt.rgba(0,0,1)
    Item { id: uselessItem }
    states: State {
        name: "state1"
        PropertyChanges { target: theRect; x: 200; y: 200; z: 4 }
        PropertyChanges { target: uselessItem; x: 10; y: 10; z: 2 }
    }
    transitions: Transition {
        //animate both theRect's and uselessItem's x and y to their final values
        NumberAnimation { properties: "x,y" }

        //animate theRect's z to its final value
        NumberAnimation { target: theRect; property: "z" }
    }
}

Rectangle {
    id: theRect
    width: 100; height: 100
    color: Qt.rgba(0,0,1)
    //need to explicitly specify target and property
    NumberAnimation { id: theAnim; target: theRect; property: "x"; to: 500 }
    MouseArea {
        anchors.fill: parent
        onClicked: theAnim.start()
    }
}

Как показано в примере выше, свойства указываются как отделенный запятыми список имён свойств, которые должны быть анимированы.

См. также exclude и Анимация и переходы в Qt Quick.

duration : int

Это свойство хранит продолжительность анимации в миллисекундах.

Значение по умолчанию — 250.

easing.amplitude : real

Указывает кривую сглаживания, используемую для анимации.

Чтобы указать кривую сглаживания, вам нужно указать хотя бы тип. Для некоторых кривых вы также можете указать амплитуду, период и/или перескок (подробнее после таблицы). Кривая сглаживания по умолчанию — Easing.Linear.

PropertyAnimation { properties: "y";
                    easing.type: Easing.InOutElastic;
                    easing.amplitude: 2.0;
                    easing.period: 1.5 }

Доступные типы:

Easing.Linear	Кривая сглаживания для линейной (t) функции: скорость постоянна.
Easing.InQuad	Кривая сглаживания для квадратичной (t^2) функции: ускорение от нулевой скорости.
Easing.OutQuad	Кривая сглаживания для квадратичной (t^2) функции: замедление до нулевой скорости.
Easing.InOutQuad	Кривая сглаживания для квадратичной (t^2) функции: ускорение до середины, затем замедление.
Easing.OutInQuad	Кривая сглаживания для квадратичной (t^2) функции: замедление до середины, затем ускорение.
Easing.InCubic	Кривая сглаживания для кубической (t^3) функции: ускорение от нулевой скорости.
Easing.OutCubic	Кривая сглаживания для кубической (t^3) функции: замедление до нулевой скорости.
Easing.InOutCubic	Кривая сглаживания для кубической (t^3) функции: ускорение до середины, затем замедление.
Easing.OutInCubic	Кривая сглаживания для кубической (t^3) функции: замедление до середины, затем ускорение.
Easing.InQuart	Кривая сглаживания для четвёртой степени (t^4) функции: ускорение от нулевой скорости.
Easing.OutQuart	Кривая сглаживания для четвёртой степени (t^4) функции: замедление до нулевой скорости.
Easing.InOutQuart	Кривая сглаживания для четвёртой степени (t^4) функции: ускорение до середины, затем замедление.
Easing.OutInQuart	Кривая сглаживания для четвёртой степени (t^4) функции: замедление до середины, затем ускорение.
Easing.InQuint	Кривая сглаживания для пятой степени (t^5) функции: ускорение от нулевой скорости.
Easing.OutQuint	Кривая сглаживания для пятой степени (t^5) функции: замедление до нулевой скорости.
Easing.InOutQuint	Кривая сглаживания для пятой степени (t^5) функции: ускорение до середины, затем замедление.
Easing.OutInQuint	Кривая сглаживания для пятой степени (t^5) функции: замедление до середины, затем ускорение.
Easing.InSine	Кривая сглаживания для синусоидальной (sin(t)) функции: ускорение от нулевой скорости.
Easing.OutSine	Кривая сглаживания для синусоидальной (sin(t)) функции: замедление до нулевой скорости.
Easing.InOutSine	Кривая сглаживания для синусоидальной (sin(t)) функции: ускорение до середины, затем замедление.
Easing.OutInSine	Кривая сглаживания для синусоидальной (sin(t)) функции: замедление до середины, затем ускорение.
Easing.InExpo	Кривая сглаживания для экспоненциальной (2^t) функции: ускорение от нулевой скорости.
Easing.OutExpo	Кривая сглаживания для экспоненциальной (2^t) функции: замедление до нулевой скорости.
Easing.InOutExpo	Кривая сглаживания для экспоненциальной (2^t) функции: ускорение до середины, затем замедление.
Easing.OutInExpo	Кривая сглаживания для экспоненциальной (2^t) функции: замедление до середины, затем ускорение.
Easing.InCirc	Кривая сглаживания для круговой (sqrt(1-t^2)) функции: ускорение от нулевой скорости.
Easing.OutCirc	Кривая сглаживания для круговой (sqrt(1-t^2)) функции: замедление до нулевой скорости.
Easing.InOutCirc	Кривая сглаживания для круговой (sqrt(1-t^2)) функции: ускорение до середины, затем замедление.
Easing.OutInCirc	Кривая сглаживания для круговой (sqrt(1-t^2)) функции: замедление до середины, затем ускорение.
Easing.InElastic	Кривая сглаживания для упругой (экспоненциально убывающая синусоидальная волна) функции: ускорение от нулевой скорости. Пиковая амплитуда может быть установлена с помощью параметра amplitude, а период затухания — параметром period.
Easing.OutElastic	Кривая сглаживания для упругой (экспоненциально убывающая синусоидальная волна) функции: замедление до нулевой скорости. Пиковая амплитуда может быть установлена с помощью параметра amplitude, а период затухания — параметром period.
Easing.InOutElastic	Кривая сглаживания для упругой (экспоненциально убывающая синусоидальная волна) функции: ускорение до середины, затем замедление.
Easing.OutInElastic	Кривая сглаживания для упругой (экспоненциально убывающая синусоидальная волна) функции: замедление до середины, затем ускорение.
Easing.InBack	Кривая сглаживания для обратного (перескочившей кубической функции: (s+1)*t^3 - s*t^2) easing в: ускорение от нулевой скорости.
Easing.OutBack	Кривая сглаживания для обратного (перескочившей кубической функции: (s+1)*t^3 - s*t^2) easing out: замедление до нулевой скорости.
Easing.InOutBack	Кривая сглаживания для обратного (перескочившей кубической функции: (s+1)*t^3 - s*t^2) easing в/наружу: ускорение до середины, затем замедление.
Easing.OutInBack	Кривая сглаживания для обратного (перескочившей кубической easing: (s+1)*t^3 - s*t^2) easing out/in: замедление до середины, затем ускорение.
Easing.InBounce	Кривая сглаживания для отскока (экспоненциально убывающего параболического отскока) функции: ускорение от нулевой скорости.
Easing.OutBounce	Кривая сглаживания для отскока (экспоненциально убывающего параболического отскока) функции: замедление до нулевой скорости.
Easing.InOutBounce	Кривая сглаживания для отскока (экспоненциально убывающего параболического отскока) функции easing в/наружу: ускорение до середины, затем замедление.
Easing.OutInBounce	Кривая сглаживания для отскока (экспоненциально убывающего параболического отскока) функции easing out/in: замедление до середины, затем ускорение.
Easing.Bezier	Пользовательская кривая сглаживания, определенная свойством easing.bezierCurve.

easing.amplitude применимо только для кривых отскока и упругих кривых (кривых типа Easing.InBounce, Easing.OutBounce, Easing.InOutBounce, Easing.OutInBounce, Easing.InElastic, Easing.OutElastic, Easing.InOutElastic или Easing.OutInElastic).

easing.overshoot применимо только в том случае, если easing.type равно: Easing.InBack, Easing.OutBack, Easing.InOutBack или Easing.OutInBack.

easing.period применимо только в том случае, если easing.type равно: Easing.InElastic, Easing.OutElastic, Easing.InOutElastic или Easing.OutInElastic.

easing.bezierCurve применимо только если easing.type равен Easing.Bezier. Это свойство — список<вещественное число> содержащий группы из трёх точек, определяющих кривую от 0,0 до 1,1 — контрольная точка 1, контрольная точка 2, конечная точка: [cx1, cy1, cx2, cy2, endx, endy, ...]. Последняя точка должна быть 1,1.

См. Кривые сглаживания для демонстрации различных настроек сглаживания.

exclude : список<Объект>

Это свойство содержит элементы, на которые данная анимация не должна влиять.

См. также PropertyAnimation::targets.

from : переменная

Это свойство содержит начальное значение для анимации.

Если PropertyAnimation определён в Переход или Поведение, это значение по умолчанию равно значению, определённому в начальном состоянии Перехода, или текущему значению свойства в момент запуска Поведения.

См. также Анимация и переходы в Qt Quick.

to : переменная

Это свойство содержит конечное значение для анимации.

Если PropertyAnimation определен в Переходе или Поведении, это значение по умолчанию соответствует значению, определенному в конечном состоянии Перехода, или значению изменения свойства, которое вызвало Поведение.

См. также Анимации и переходы в Qt Quick.