ExpressionAnimation 類別
定義
重要
部分資訊涉及發行前產品,在發行之前可能會有大幅修改。 Microsoft 對此處提供的資訊,不做任何明確或隱含的瑕疵擔保。
合成動畫利用數學方程式計算每一幀動畫屬性的值。
public ref class ExpressionAnimation sealed : CompositionAnimation
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.Foundation.LiftedContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class ExpressionAnimation final : CompositionAnimation
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.Foundation.WindowsAppSDKContract, 65536)]
class ExpressionAnimation final : CompositionAnimation
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.Foundation.LiftedContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class ExpressionAnimation : CompositionAnimation
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.Foundation.WindowsAppSDKContract), 65536)]
public sealed class ExpressionAnimation : CompositionAnimation
Public NotInheritable Class ExpressionAnimation
Inherits CompositionAnimation
- 繼承
- 屬性
範例
void AnimateOpacity()
{
// The Expression below will animate the opacity of the target Visual based on its position to the edge of the window.
ExpressionAnimation exp = _compositor.CreateExpressionAnimation();
float xWinSize = (float) Window.Current.Bounds.Width;
SpriteVisual targetVisual = _compositor.CreateSpriteVisual();
// Define the Expression Equation and references
exp.Expression = "this.Target.Offset.X / xWindowSize";
exp.SetScalarParameter("xWindowSize", xWinSize);
// Attach the animation to the target Opacity property
targetVisual.StartAnimation("Opacity", exp);
}
// Creates an Expression that calculates the angle between two Visual's Offset vectors
// And assigns it to the RotationAngle of a third Visual
void angleBetweenVectors()
{
SpriteVisual visualA = _compositor.CreateSpriteVisual();
SpriteVisual visualB = _compositor.CreateSpriteVisual();
SpriteVisual lineVisual = _compositor.CreateSpriteVisual();
lineVisual.Size = new Vector2(50.0f, 5.0f);
var rotationAnimation = _compositor.CreateExpressionAnimation();
rotationAnimation.SetReferenceParameter("A", visualA);
rotationAnimation.SetReferenceParameter("B", visualB);
rotationAnimation.Expression = "ACos( ( (A.Offset.X * B.Offset.X) + (A.Offset.Y*B.Offset.Y) + (A.Offset.Z * B.Offset.Z) ) / ( Length(A.Offset) * Length(B.Offset) ) )";
lineVisual.StartAnimation("RotationAngle", rotationAnimation);
}
備註
ExpressionAnimations 的核心功能允許開發者定義一個數學方程式,用來計算每幀目標動畫屬性的值。 這與 KeyFrameAnimation s 形成對比,後者使用插值器來定義動畫屬性隨時間的變化。 數學方程式可透過參考合成物件、數學函數與運算子以及輸入的屬性來定義。 表達式動畫讓黏性標題和視差等體驗變得容易描述。
想了解 Composition ExpressionAnimation 的詳細操作,請參考動畫 概覽文件。
使用 CompositionObject.StartAnimation 和 CompositionObject.StopAnimation 方法來開始和停止動畫。
那麼,為什麼表情動畫有用呢?
表達動畫的真正威力來自於它們與其他物件屬性的參考建立數學關係的能力。 這表示你可以有一個方程式,參考其他組合物件、局部變數,甚至在組合屬性集合中的共享值。 隨著這些參考資料隨時間改變和更新,你的表達也會隨之改變。 這開啟了比傳統關鍵影格動畫更廣闊的可能性,因為傳統關鍵影格動畫必須是離散且預先定義的,ExpressionAnimations 能創造更動態的動畫體驗。
注意事項
ExpressionAnimation 有無限的生命週期——它們會持續運行,直到被明確停止為止。
數學方程式會以字串形式輸入到表達式中——這可以在構建 ExpressionAnimation 時完成,或透過改變屬性來單獨完成。 如果在施工期間完成,該物業將會被固定。 + ExpressionAnimation exp = _compositor。CreateExpressionAnimation();經驗值。表達式 = 「這個。Target.Offset.X / xWindowSize“;
- ExpressionAnimation 經驗值 = _compositor。CreateExpressionAnimation(「這個。Target.Offset.X / xWindowSize“)
數學方程式將每幀使用來計算動畫屬性的值(這與使用插值器的 KeyFrameAnimations 形成鮮明對比)
注意你打算製作的屬性類型——你的方程式必須對應相同的類型。 否則,當計算表達式時會拋出錯誤。 如果你的方程式解析為 Nan(數字/0),系統會使用先前計算的值
製作動態動畫 UI 與表達式動畫的關鍵在於建立一個方程式,讓屬性或其他值的參考會隨時間改變。
當系統附加到動畫屬性時,會用此方程式計算該屬性在每一幀的值。 這表示系統會重新評估所有會驅動方程式變更的參考資料。 例如,在上述範例中,如果視覺A或B因其他動畫或輸入而移動,視覺線的旋轉角度會相應改變。
在構建數學方程式時,有許多不同的組成部分需要注意(每個組成部分的詳細說明請參見動畫概述):
運算子、優先順序與結合性 + 表達式字串支援使用典型數學運算子(+、-、/、等),這些運算子通常會用於任何方程式中。
- 當該表達式被評估時,它將遵循 C# 語言規範中定義的運算子優先順序與關聯性。
屬性參數 + 在定義表達式時,你可以選擇在組合視覺化、屬性集或其他 C# 物件中,定義對其他屬性的型別參考。
- 要在表達式字串中使用,請根據型別使用「SetParameter」函式,定義表達式字串所用字串及其映射值。 這些函式列為頂層 CompositionAnimation 類別的一部分。
輔助函數與建構子 + 表達式也能利用方程式中不同物件類型的函數與建構子清單。
- 也有建構器方法,當系統評估方程式時,會構造物件型態
- 以下列出各類型的功能列表
關鍵字 + 表達式也能利用多個在評估表達式字串時會被不同處理的關鍵字。 請考慮這些關鍵字,且不可作為屬性參考中的字串鍵使用。
- 以下列出可用關鍵字列表
條件句 + 表達式也可以利用三元運算子(條件 ? ifTrue_expression : ifFalse_expression)
- 三元運算子可以巢狀作為真或假陳述的表達式。
表達式關鍵詞
| 關鍵詞 | Description |
|---|---|
| 這個。起始價值 | 提供被動畫屬性原始起始值的參考。 |
| 這個。當前價值 | 提供目前「已知」房產價值的參考 |
| 這就是。最終價值 | 提供動畫最終值的參考(如定義) 注意:Relevant for Implicit Animations,對於明確 ,維持與 This.StartingValue 相同的功能 |
| 圓周率 | 提供 PI 值的關鍵字參考 |
| 真 / 假 | 提供「true」或「false」的布林值參考 |
| 這個。目標 | 提供動畫綁定的目標物件參考。 |
每種類型的表達式函數
Scalar
| 函數與建構子操作 | Description |
|---|---|
| ABS(浮動價值) | 回傳一個 float,代表 float 參數的絕對值 |
| 夾(浮點數值、浮點數最小值、浮點數最大值) | 回傳一個浮動值,該值要麼大於最小值但小於最大值;若值小於最小值則為最小值;若值大於最大值則為最大值 |
| 最大值(浮點數值1,浮動值2) | 回傳 value1 與 value2 之間的較大浮動量。 |
| 最小值(浮動值1,浮動值2) | 回傳 value1 與 value2 之間的較小浮動點。 |
| Lerp(浮點數值1,浮點數值2,浮點進度) | 回傳一個浮點點數,代表根據進度(註:進度介於 0.0 到 1.0 之間)計算出的兩個純量值之間的線性插值計算結果。 |
| Slerp(浮點數值1、浮點數值2、浮點數進度) | 回傳一個浮點數,代表兩個浮點數值之間根據進度計算出的球面插值(註:進度介於 0.0 與 1.0 之間) |
| Mod(Float value1, float value2) | 回傳由 value1 與 value2 除法所得的 Float 剩餘部分 |
| Ceil(浮動價值) | 回傳將 Float 參數四捨五入到下一個較大的整數 |
| 底價(浮動價值) | 將浮點數參數回傳到下一個較低的整數 |
| Sqrt(浮動值) | 回傳 Float 參數的平方根 |
| 平方(浮動值) | 回傳浮點參數的平方 |
| Sin(浮動值1) Asin(浮動值2) | 回傳浮點參數的正弦或弧正弦 |
| Cos(浮動值1) ACos(浮動值2) | 回傳浮點參數的 Cos 或 ArcCos |
| Tan(浮動值1) ATan(浮動值2) | 回傳浮點參數的 Tan 或 Arc Tan。 |
| 輪數(浮動價值) | 回傳 Float 參數,四捨五入至最接近的整數 |
| Log10(浮動值) | 回傳 Float 參數的對數(以 10 為底)結果 |
| Ln(浮動值) | 回傳 Float 參數的自然對數結果 |
| Pow(浮動值,浮動力) | 回傳將浮點參數提升至特定冪次的結果 |
| ToDegrees(浮點弧度) | 回傳將 Float 參數轉換為度數 |
| ToRadians(浮點度數) | 回傳將 Float 參數轉換為弧度 |
向量2
| 函數與建構子操作 | Description |
|---|---|
| Abs(Vector2 值) | 回傳一個 Vector2,每個元件都套用絕對值 |
| 夾鉗(Vector2 值1,Vector2 min,Vector2 max) | 回傳一個包含每個元件截合值的 Vector2 |
| Max(Vector2 值1,Vector2 值2) | 回傳一個向量2,該向量對應的每個分量都進行了最大值,從 value1 和 value2 |
| 最小值(向量2值1,向量2值2) | 回傳一個向量2,該向量對應的每個分量都執行了最小值,來自值1和值2。 |
| 縮放(Vector2 值,浮點因子) | 回傳一個向量2,向量的每個分量乘以縮放因子。 |
| 變換(向量2值,矩陣3x2矩陣) | 回傳一個 Vector2,這是 Vector2 與 Matrix3x2 之間的線性變換(也就是將向量乘以矩陣)。 |
| Lerp(Vector2 值1,Vector2 值2,標量進展) | 回傳一個 Vector2,代表根據進度(註:進度介於 0.0 到 1.0 之間)計算出的線性插值計算。 |
| 長度(向量2值) | 回傳一個浮點數值,代表向量2的長度/大小 |
| 長度平方(向量2) | 回傳一個浮點數值,代表向量2的長度/大小的平方 |
| 距離(Vector2 值1,Vector2 值2) | 回傳一個浮點數值,代表兩個 Vector2 值之間的距離 |
| 距離平方(Vector2 value1, Vector2 value2) | 回傳一個浮點數值,代表兩個 Vector2 值之間距離的平方 |
| 正規化(Vector2 值) | 回傳一個 Vector2,代表所有分量已正規化的參數單位向量 |
| Vector2(浮點 x,浮點 y) | 利用兩個 Float 參數構造一個向量 2 |
Vector3
| 函數與建構子操作 | Description |
|---|---|
| 腹肌(Vector3 數值) | 回傳一個 Vector3,每個分量都套用絕對值 |
| 夾具(Vector3 值1,Vector3 min,Vector3 max) | 回傳一個包含每個元件截取值的 Vector3 |
| Max(Vector3 值1,Vector3 值2) | 回傳一個向量3,該向量對應的每個元件都執行了最大值,該分量來自值1和value2 |
| 最小值(Vector3 value1,Vector3 value2) | 回傳一個向量3,該向量對值1和value2中對應的每個成分都做了最小值 |
| 縮放(Vector3 值,浮點因子) | 回傳一個向量3,向量的每個分量乘以縮放因子。 |
| Lerp(Vector3 value1, Vector3 value2, Float progress) | 回傳一個 Vector3,代表根據進度(註:進度介於 0.0 與 1.0 之間)計算出的線性插值計算。 |
| 長度(向量3值) | 回傳一個浮點數值,代表向量的長度/大小 |
| 長度平方(向量3) | 回傳一個浮點數值,代表向量長度/大小的平方。 |
| 距離(Vector3 值1,Vector3 值2) | 回傳一個浮點數值,代表兩個 Vector3 值之間的距離 |
| 距離平方(Vector3 value1, Vector3 value2) | 回傳一個浮點數值,代表兩個 Vector3 值之間距離的平方 |
| 正規化(Vector3 值) | 回傳一個 Vector3,代表所有分量正規化的參數單位向量 |
| 向量3(浮點 x、浮點 y、浮點 z) | 利用三個 Float 參數構造一個向量 3 |
向量4
| 函數與建構子操作 | Description |
|---|---|
| Abs(Vector4 值) | 回傳一個 Vector3,每個分量都套用絕對值 |
| 夾具(Vector4 值1,Vector4 分鐘,Vector4 最大值) | 回傳一個包含每個元件截合值的 Vector4 |
| Max(Vector4 值1 向量 4 value2) | 回傳一個向量4,該向量對應的每個分量都執行了最大值,該分量來自值1和值2 |
| 最小值(Vector4 值1 向量4 value2) | 回傳一個向量4,該向量對值1與值2對應的每個分量都執行了最小值 |
| 縮放(Vector3 值,浮點因子) | 回傳一個向量3,向量的每個分量乘以縮放因子。 |
| Transform(Vector4 值,Matrix4x4 矩陣) | 回傳一個 Vector4,該向量 Vector4 與 Matrix4x4 之間的線性變換(也就是將向量乘以矩陣)。 |
| Lerp(Vector4 值1,Vector4 值2,浮動進度) | 回傳一個 Vector4,代表根據進度(註:進度介於 0.0 與 1.0 之間)計算出的線性插值計算。 |
| 長度(向量4值) | 回傳一個浮點數值,代表向量4的長度/大小 |
| 長度平方(向量4) | 回傳一個浮點數值,代表向量4的長度/大小的平方 |
| 距離(Vector4 值1,Vector4 值2) | 回傳一個浮點數值,代表兩個 Vector4 值之間的距離 |
| 距離平方(Vector4 value1, Vector4 value2) | 回傳一個浮點數值,代表兩個 Vector4 值之間距離的平方 |
| 正規化(Vector4 值) | 回傳一個向量4,代表所有分量均已正規化的參數單位向量 |
| Vector4(浮點 x、浮點 y、浮點 z、浮點 w) | 利用四個 Float 參數構造一個向量 4 |
矩陣3x2
| 函數與建構子操作 | Description |
|---|---|
| 縮放(Matrix3x2 值,浮點因子) | 回傳一個矩陣3x2,矩陣的每個分量乘以縮放因子。 |
| 反矩陣(矩陣 3x2 值) | 回傳一個 Matrix3x2 物件,代表倒易矩陣 |
| Matrix3x2(浮標M11、浮標M12、浮標M21、浮標M22, 浮動M31、浮筒M32) | 使用 6 個 Float 參數構造矩陣 3x2 |
| 矩陣3x2。CreateFromScale(向量2比例) | 從代表尺度的向量2構建矩陣3x2。X,0.0 0.0,比例。Y 0.0, 0.0 ] |
| Matrix3x2.CreateFromTranslation(Vector2 翻譯) | 從表示平移的向量2構造矩陣3x2,該向量2[1.0, 0.0, 0.0, 1.0, 翻譯。X,翻譯。Y] |
| Matrix3x2.CreateSkew(Float x, float y, Vector2 中心點) | 由兩個 Float 和 Vector2[1.0, Tan(y) 構造一個矩陣 3x2, Tan(x), 1.0, -中心點。Y * Tan(x),-中心點。X * Tan(y)] |
| Matrix3x2.CreateRotation(浮點弧度) | 從弧度旋轉構造矩陣3x2,[Cos(radians), Sin(radians), - 正弦(弧度)、Cos(弧度), 0.0, 0.0 ] |
| Matrix3x2.CreateTranslation(向量2翻譯) | (和 Matrix3x2 的 CreateFromTranslation 完全一樣,只是名稱不同以換一致性) |
| Matrix3x2.CreateScale(向量2比例) | (和 Matrix3x2 的 CreateFromScale 完全一樣,只是名稱不同以換一致性) |
Matrix4x4
| 函數與建構子操作 | Description |
|---|---|
| 比例(Matrix4x4 值,浮點因子) | 回傳一個矩陣 4x4,矩陣的每個分量乘以縮放因子。 |
| 反向(矩陣4x4) | 回傳一個 Matrix4x4 物件,代表倒易矩陣 |
| Matrix4x4(浮筒 M11、浮筒 M12、浮筒 M13、浮筒 M14、浮筒 M21、浮筒 M22、浮筒 M23、浮筒 M24, 浮筒M31、浮筒M32、浮筒M33、浮筒M34, 浮筒M41、浮筒M42、浮筒M43、浮筒M44) | 使用 16 個浮點參數構造 Matrix4x4 |
| 矩陣4x4(矩陣3x2矩陣) | 利用 Matrix3x2[matrix.11, matrix.12, 0, 0, 構造一個矩陣4x4, 矩陣.21、矩陣.22、0、0, 0, 0, 1, 0, 矩陣.31, 矩陣.32, 0, 1] |
| Matrix4x4。CreateFromScale(向量3比例) | 從代表尺度的向量3構建矩陣4x4。X,0.0,0.0,0.0, 0.0,比例。Y, 0.0, 0.0, 0.0,0.0,比例。Z,0.0, 0.0, 0.0, 0.0, 1.0] |
| Matrix4x4.CreateFromTranslation(Vector3 翻譯) | 從代表平移的向量3構造矩陣4x4,該向量3表示平移[1.0, 0.0, 0.0, 0.0, 1.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0, 翻譯。X,翻譯。Y,翻譯。Z,1.0] |
| Matrix4x4.CreateTranslation(Vector3 翻譯) | (和 Matrix4x4 的 CreateFromTranslation 完全一樣,只是名稱不同以換一致性) |
| Matrix4x4.CreateScale(Vector3 比例) | (和 Matrix4x4 的 CreateFromScale 完全一樣,只是名稱不同以換一致性) |
| Matrix4x4.CreateFromAxisAngle(向量3軸,浮點角) | 由向量3軸與代表角度的浮點數構建矩陣4x4 |
四元數
| 函數與建構子操作 | Description |
|---|---|
| Slerp(四元數值1,四元數值2,浮點進度) | 回傳一個四元數,代表根據進度計算出的球面插值,兩個四元數值之間(註:進度介於 0.0 到 1.0 之間) |
| 串接(四元數值1 四元數值2) | 回傳一個四元數,代表兩個四元數的連接(又稱代表兩個獨立旋轉組合的四元數) |
| 長度(四元數值) | 回傳一個浮點數值,代表四元數的長度/大小。 |
| 長度平方(四元數) | 回傳一個浮點數值,代表四元數長度/大小的平方 |
| 正規化(四元數值) | 回傳一個分量已正規化的四元數 |
| Quaternion.CreateFromAxisAngle(向量3軸,標量角) | 由向量3軸與表示角度的純量構造四元數 |
| 四元數(浮點數 x、浮點 y、浮點數 z、浮點 w) | 由四個 Float 值構造四元數 |
顏色
| 函數與建構子操作 | Description |
|---|---|
| ColorLerp(Color colorTo, Color colorFrom, Float progress) | 回傳一個顏色物件,代表根據給定進度計算出的兩個色彩物件間的線性插值值。 (註:進度介於 0.0 到 1.0 之間) |
| ColorLerpRGB(Color colorTo, Color colorFrom, Float progress) | 回傳一個色彩物件,代表根據 RGB 色彩空間中特定進展計算出的兩個物件間的線性插值值。 |
| ColorLerpHSL(Color colorTo, Color colorFrom, Float progress) | 回傳一個顏色物件,代表根據 HSL 色彩空間中特定進展,計算出兩個物件間的線性插值值。 |
| ColorRGB(浮點 a、浮點 r、浮點 g、浮點 b) | 建構一個由 ARGB 元件定義的顏色物件。 (註:ARGB成分介於0.0至255.0之間) |
| ColorHsl(浮點 h, 浮點 s, 浮點 l) | 構造一個由 HSL 元件定義的顏色物件(註:Hue 定義為 0 與 2pi) |
屬性
| 名稱 | Description |
|---|---|
| Comment |
一個用來關聯 CompositionObject 的字串。 (繼承來源 CompositionObject) |
| Compositor |
用於建立此 CompositionObject 的合成器。 (繼承來源 CompositionObject) |
| DispatcherQueue |
取得 CompositionObject 的 DispatcherQueue。 (繼承來源 CompositionObject) |
| Expression |
數學方程式規定每幀動畫值的計算方式。 表達式是 ExpressionAnimation 的核心,代表系統用來計算每幀動畫屬性值的方程式。 方程式以字串的形式在此性質上集合。 雖然表達式可以用簡單的數學方程式如「2+2」定義,但真正的力量在於建立數學關係,使輸入值能在每幀之間變化。 |
| ImplicitAnimations |
附加於此物件的隱含動畫集合。 (繼承來源 CompositionObject) |
| InitialValueExpressions |
取得動畫的初始值。 (繼承來源 CompositionAnimation) |
| Properties |
與 CompositionObject 相關聯的屬性集合。 (繼承來源 CompositionObject) |
| Target |
動畫的目標。 (繼承來源 CompositionAnimation) |