feat(ui): 添加UI过渡动画系统

添加了完整的UI过渡动画功能,包括:
- 新增UiTransitionAnimation枚举定义各种动画类型
- 扩展IUiRouter接口支持动画策略参数
- 新增IUiTransition接口定义动画播放契约
- 新增UiAnimationPolicy类配置动画行为
- 实现God
This commit is contained in:
GeWuYou 2026-01-20 09:36:59 +08:00
parent c9f01f5877
commit e972d926a7
6 changed files with 360 additions and 9 deletions

View File

@ -0,0 +1,48 @@
namespace GFramework.Game.Abstractions.enums;
/// <summary>
/// UI过渡动画类型枚举
/// 定义UI切换时支持的动画效果
/// </summary>
public enum UiTransitionAnimation
{
/// <summary>
/// 无动画
/// </summary>
None,
/// <summary>
/// 淡入淡出动画
/// </summary>
Fade,
/// <summary>
/// 从右侧滑入
/// </summary>
SlideLeft,
/// <summary>
/// 从左侧滑入
/// </summary>
SlideRight,
/// <summary>
/// 从下方滑入
/// </summary>
SlideUp,
/// <summary>
/// 从上方滑入
/// </summary>
SlideDown,
/// <summary>
/// 缩放动画
/// </summary>
Scale,
/// <summary>
/// 自定义动画(需要提供自定义的 IUiTransition 实现)
/// </summary>
Custom
}

View File

@ -26,8 +26,9 @@ public interface IUiRouter : ISystem
/// <param name="param">进入界面的参数,可为空</param>
/// <param name="policy">界面切换策略默认为Exclusive独占</param>
/// <param name="instancePolicy">实例管理策略默认为Reuse复用</param>
/// <param name="animationPolicy">动画策略,可为空</param>
void Push(string uiKey, IUiPageEnterParam? param = null, UiTransitionPolicy policy = UiTransitionPolicy.Exclusive,
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse);
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse, UiAnimationPolicy? animationPolicy = null);
/// <summary>
@ -37,8 +38,9 @@ public interface IUiRouter : ISystem
/// <param name="page">已创建的UI页面行为实例</param>
/// <param name="param">进入界面的参数,可为空</param>
/// <param name="policy">界面切换策略,默认为Exclusive(独占)</param>
/// <param name="animationPolicy">动画策略,可为空</param>
void Push(IUiPageBehavior page, IUiPageEnterParam? param = null,
UiTransitionPolicy policy = UiTransitionPolicy.Exclusive);
UiTransitionPolicy policy = UiTransitionPolicy.Exclusive, UiAnimationPolicy? animationPolicy = null);
/// <summary>
@ -55,12 +57,14 @@ public interface IUiRouter : ISystem
/// <param name="popPolicy">弹出页面时的销毁策略,默认为销毁</param>
/// <param name="pushPolicy">推入页面时的过渡策略,默认为独占</param>
/// <param name="instancePolicy">实例管理策略</param>
/// <param name="animationPolicy">动画策略,可为空</param>
public void Replace(
string uiKey,
IUiPageEnterParam? param = null,
UiPopPolicy popPolicy = UiPopPolicy.Destroy,
UiTransitionPolicy pushPolicy = UiTransitionPolicy.Exclusive,
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse);
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse,
UiAnimationPolicy? animationPolicy = null);
/// <summary>
/// 替换当前所有页面为已存在的页面(基于实例)
@ -69,11 +73,13 @@ public interface IUiRouter : ISystem
/// <param name="param">页面进入参数,可为空</param>
/// <param name="popPolicy">弹出页面时的销毁策略,默认为销毁</param>
/// <param name="pushPolicy">推入页面时的过渡策略,默认为独占</param>
/// <param name="animationPolicy">动画策略,可为空</param>
public void Replace(
IUiPageBehavior page,
IUiPageEnterParam? param = null,
UiPopPolicy popPolicy = UiPopPolicy.Destroy,
UiTransitionPolicy pushPolicy = UiTransitionPolicy.Exclusive);
UiTransitionPolicy pushPolicy = UiTransitionPolicy.Exclusive,
UiAnimationPolicy? animationPolicy = null);
/// <summary>
/// 清空所有UI界面重置路由状态
/// </summary>

View File

@ -0,0 +1,24 @@
using System.Threading.Tasks;
namespace GFramework.Game.Abstractions.ui;
/// <summary>
/// UI过渡动画接口
/// 定义UI进入和退出时的动画效果
/// </summary>
public interface IUiTransition
{
/// <summary>
/// 播放进入动画
/// </summary>
/// <param name="page">UI页面</param>
/// <returns>异步任务,动画完成后完成</returns>
Task PlayEnterAsync(IUiPageBehavior page);
/// <summary>
/// 播放退出动画
/// </summary>
/// <param name="page">UI页面</param>
/// <returns>异步任务,动画完成后完成</returns>
Task PlayExitAsync(IUiPageBehavior page);
}

View File

@ -0,0 +1,91 @@
using GFramework.Game.Abstractions.enums;
namespace GFramework.Game.Abstractions.ui;
/// <summary>
/// UI动画策略配置
/// 用于配置UI过渡动画的行为
/// </summary>
public class UiAnimationPolicy
{
/// <summary>
/// 动画类型
/// </summary>
public UiTransitionAnimation Animation { get; set; } = UiTransitionAnimation.None;
/// <summary>
/// 动画持续时间(秒)
/// </summary>
public float Duration { get; set; } = 0.3f;
/// <summary>
/// 是否阻塞UI切换等待动画完成
/// </summary>
public bool BlockTransition { get; set; } = false;
/// <summary>
/// 自定义动画实现(仅当 Animation 为 Custom 时使用)
/// </summary>
public IUiTransition? CustomTransition { get; set; }
/// <summary>
/// 缓动函数(可选,用于调整动画曲线)
/// </summary>
public EasingFunction Easing { get; set; } = EasingFunction.EaseInOut;
/// <summary>
/// 创建默认策略(无动画)
/// </summary>
public static UiAnimationPolicy None => new UiAnimationPolicy { Animation = UiTransitionAnimation.None };
/// <summary>
/// 创建淡入淡出策略
/// </summary>
/// <param name="duration">持续时间</param>
/// <param name="block">是否阻塞</param>
public static UiAnimationPolicy Fade(float duration = 0.3f, bool block = false)
=> new UiAnimationPolicy { Animation = UiTransitionAnimation.Fade, Duration = duration, BlockTransition = block };
/// <summary>
/// 创建滑入策略
/// </summary>
/// <param name="direction">滑动方向</param>
/// <param name="duration">持续时间</param>
/// <param name="block">是否阻塞</param>
public static UiAnimationPolicy Slide(UiTransitionAnimation direction, float duration = 0.3f, bool block = false)
=> new UiAnimationPolicy { Animation = direction, Duration = duration, BlockTransition = block };
/// <summary>
/// 创建缩放策略
/// </summary>
/// <param name="duration">持续时间</param>
/// <param name="block">是否阻塞</param>
public static UiAnimationPolicy Scale(float duration = 0.3f, bool block = false)
=> new UiAnimationPolicy { Animation = UiTransitionAnimation.Scale, Duration = duration, BlockTransition = block };
}
/// <summary>
/// 缓动函数枚举
/// </summary>
public enum EasingFunction
{
/// <summary>
/// 线性
/// </summary>
Linear,
/// <summary>
/// 缓入
/// </summary>
EaseIn,
/// <summary>
/// 缓出
/// </summary>
EaseOut,
/// <summary>
/// 缓入缓出
/// </summary>
EaseInOut
}

View File

@ -73,8 +73,9 @@ public abstract class UiRouterBase : AbstractSystem, IUiRouter
/// <param name="param">进入界面的参数,可为空</param>
/// <param name="policy">界面切换策略默认为Exclusive独占</param>
/// <param name="instancePolicy">实例管理策略默认为Reuse复用</param>
/// <param name="animationPolicy">动画策略,可为空</param>
public void Push(string uiKey, IUiPageEnterParam? param = null, UiTransitionPolicy policy = UiTransitionPolicy.Exclusive,
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse)
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse, UiAnimationPolicy? animationPolicy = null)
{
if (IsTop(uiKey))
{
@ -83,6 +84,7 @@ public abstract class UiRouterBase : AbstractSystem, IUiRouter
}
var @event = CreateEvent(uiKey, UiTransitionType.Push, policy, param);
@event.Set("AnimationPolicy", animationPolicy);
Log.Debug(
"Push UI Page: key={0}, policy={1}, instancePolicy={2}, stackBefore={3}",
@ -106,10 +108,12 @@ public abstract class UiRouterBase : AbstractSystem, IUiRouter
/// <param name="page">已创建的UI页面行为实例</param>
/// <param name="param">页面进入参数,可为空</param>
/// <param name="policy">页面切换策略</param>
/// <param name="animationPolicy">动画策略,可为空</param>
public void Push(
IUiPageBehavior page,
IUiPageEnterParam? param = null,
UiTransitionPolicy policy = UiTransitionPolicy.Exclusive
UiTransitionPolicy policy = UiTransitionPolicy.Exclusive,
UiAnimationPolicy? animationPolicy = null
)
{
var uiKey = page.View.GetType().Name;
@ -121,6 +125,7 @@ public abstract class UiRouterBase : AbstractSystem, IUiRouter
}
var @event = CreateEvent(uiKey, UiTransitionType.Push, policy, param);
@event.Set("AnimationPolicy", animationPolicy);
Log.Debug(
"Push existing UI Page: key={0}, policy={1}, stackBefore={2}",
@ -164,14 +169,17 @@ public abstract class UiRouterBase : AbstractSystem, IUiRouter
/// <param name="popPolicy">弹出页面时的销毁策略,默认为销毁</param>
/// <param name="pushPolicy">推入页面时的过渡策略,默认为独占</param>
/// <param name="instancePolicy">实例管理策略</param>
/// <param name="animationPolicy">动画策略,可为空</param>
public void Replace(
string uiKey,
IUiPageEnterParam? param = null,
UiPopPolicy popPolicy = UiPopPolicy.Destroy,
UiTransitionPolicy pushPolicy = UiTransitionPolicy.Exclusive,
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse)
UiInstancePolicy instancePolicy = UiInstancePolicy.Reuse,
UiAnimationPolicy? animationPolicy = null)
{
var @event = CreateEvent(uiKey, UiTransitionType.Replace, pushPolicy, param);
@event.Set("AnimationPolicy", animationPolicy);
Log.Debug(
"Replace UI Stack with page: key={0}, popPolicy={1}, pushPolicy={2}, instancePolicy={3}",
@ -186,7 +194,7 @@ public abstract class UiRouterBase : AbstractSystem, IUiRouter
// 使用工厂的增强方法获取实例
var page = _factory.GetOrCreate(uiKey, instancePolicy);
Log.Debug("Get/Create UI Page instance for Replace: {0}", page.GetType().Name);
DoPushPageInternal(page, param, pushPolicy);
AfterChange(@event);
@ -198,14 +206,17 @@ public abstract class UiRouterBase : AbstractSystem, IUiRouter
/// <param name="param">页面进入参数,可为空</param>
/// <param name="popPolicy">弹出页面时的销毁策略,默认为销毁</param>
/// <param name="pushPolicy">推入页面时的过渡策略,默认为独占</param>
/// <param name="animationPolicy">动画策略,可为空</param>
public void Replace(
IUiPageBehavior page,
IUiPageEnterParam? param = null,
UiPopPolicy popPolicy = UiPopPolicy.Destroy,
UiTransitionPolicy pushPolicy = UiTransitionPolicy.Exclusive)
UiTransitionPolicy pushPolicy = UiTransitionPolicy.Exclusive,
UiAnimationPolicy? animationPolicy = null)
{
var uiKey = page.Key;
var @event = CreateEvent(uiKey, UiTransitionType.Replace, pushPolicy, param);
@event.Set("AnimationPolicy", animationPolicy);
Log.Debug(
"Replace UI Stack with existing page: key={0}, popPolicy={1}, pushPolicy={2}",

View File

@ -0,0 +1,171 @@
using System;
using System.Threading.Tasks;
using GFramework.Game.Abstractions.enums;
using GFramework.Game.Abstractions.ui;
using Godot;
namespace GFramework.Godot.ui;
/// <summary>
/// Godot平台的UI过渡动画实现
/// 支持多种预定义动画效果
/// </summary>
public class GodotUiTransition : IUiTransition
{
private readonly UiTransitionAnimation _animation;
/// <summary>
/// 创建过渡动画实例
/// </summary>
/// <param name="animation">动画类型</param>
public GodotUiTransition(UiTransitionAnimation animation)
{
_animation = animation;
}
/// <summary>
/// 播放进入动画
/// </summary>
public async Task PlayEnterAsync(IUiPageBehavior page)
{
var node = page.View as Node;
if (node == null)
return;
switch (_animation)
{
case UiTransitionAnimation.Fade:
await PlayFadeEnterAsync(node);
break;
case UiTransitionAnimation.Scale:
await PlayScaleEnterAsync(node);
break;
case UiTransitionAnimation.SlideLeft:
case UiTransitionAnimation.SlideRight:
case UiTransitionAnimation.SlideUp:
case UiTransitionAnimation.SlideDown:
await PlaySlideEnterAsync(node, _animation);
break;
case UiTransitionAnimation.None:
default:
break;
}
}
/// <summary>
/// 播放退出动画
/// </summary>
public async Task PlayExitAsync(IUiPageBehavior page)
{
var node = page.View as Node;
if (node == null)
return;
switch (_animation)
{
case UiTransitionAnimation.Fade:
await PlayFadeExitAsync(node);
break;
case UiTransitionAnimation.Scale:
await PlayScaleExitAsync(node);
break;
case UiTransitionAnimation.SlideLeft:
case UiTransitionAnimation.SlideRight:
case UiTransitionAnimation.SlideUp:
case UiTransitionAnimation.SlideDown:
await PlaySlideExitAsync(node, _animation);
break;
case UiTransitionAnimation.None:
default:
break;
}
}
private static async Task PlayFadeEnterAsync(Node node)
{
if (node is CanvasItem canvasItem)
{
canvasItem.Modulate = new Color(1,1, 1, 0);
canvasItem.Visible = true;
await Task.Delay(300);
canvasItem.Modulate = new Color(1,1, 1, 1);
}
}
private static async Task PlayFadeExitAsync(Node node)
{
if (node is CanvasItem canvasItem)
{
await Task.Delay(300);
canvasItem.Modulate = new Color(1,1, 1, 0);
}
}
private static async Task PlayScaleEnterAsync(Node node)
{
if (node is Control control)
{
control.Scale = Vector2.Zero;
control.PivotOffset = control.Size / 2;
await Task.Delay(300);
control.Scale = Vector2.One;
}
}
private static async Task PlayScaleExitAsync(Node node)
{
if (node is Control control)
{
control.PivotOffset = control.Size / 2;
await Task.Delay(300);
control.Scale = Vector2.Zero;
}
}
private static async Task PlaySlideEnterAsync(Node node, UiTransitionAnimation direction)
{
if (node is Control control)
{
var screenPos = control.GetViewportRect().Size;
var offset = GetSlideOffset(direction, screenPos);
control.Position += offset;
await Task.Delay(300);
control.Position -= offset;
}
}
private static async Task PlaySlideExitAsync(Node node, UiTransitionAnimation direction)
{
if (node is Control control)
{
var screenPos = control.GetViewportRect().Size;
var offset = GetSlideExitOffset(direction, screenPos);
await Task.Delay(300);
control.Position += offset;
}
}
private static Vector2 GetSlideOffset(UiTransitionAnimation direction, Vector2 screenPos)
{
return direction switch
{
UiTransitionAnimation.SlideLeft => Vector2.Right * screenPos.X,
UiTransitionAnimation.SlideRight => Vector2.Left * screenPos.X,
UiTransitionAnimation.SlideUp => Vector2.Down * screenPos.Y,
UiTransitionAnimation.SlideDown => Vector2.Up * screenPos.Y,
_ => Vector2.Zero
};
}
private static Vector2 GetSlideExitOffset(UiTransitionAnimation direction, Vector2 screenPos)
{
return direction switch
{
UiTransitionAnimation.SlideLeft => Vector2.Left * screenPos.X,
UiTransitionAnimation.SlideRight => Vector2.Right * screenPos.X,
UiTransitionAnimation.SlideUp => Vector2.Up * screenPos.Y,
UiTransitionAnimation.SlideDown => Vector2.Down * screenPos.Y,
_ => Vector2.Zero
};
}
}