EgoFramework-UI

<!doctype html>

UI框架

介绍
UI框架提供了两种概念，视图(View)和窗口(Window)的概念。
1. 视图：游戏中永远只有有一个视图存在，不同视图是一个切换关卡，也可以理解为页面。
2. 窗口：类似操作系统，可以同时打开多个窗口，多个窗口有重叠概念，以及模态窗口的概念（模态也就是只能操作当前窗口，下面的窗口无法被点击）。
UI框架用一种很便捷的方式跳转视图或打开窗口，他们在游戏中是独立的模块，跟游戏逻辑是低耦合的。
如果内存不足时，UI框架会对用不到的界面进行卸载，回收内存。 UI框架管理当前UI的状态，你可以对这些状态变更进行监听，以适配不同的表现，如窗口打开时，菜单栏自动隐藏等效果。视图的基类为EgoView，窗口的基类为EgoWindow。
设计思路
给窗口/视图分配一个唯一key，然后在游戏特定位置配置这个key与prefab的名称的关系，界面显示时自动读取预制，并显示，并且支持设置对应窗口的打开动效。

UI配置

配置路径：菜单栏Egogame-Setting选中，见UI Configs

设置项	说明
View Folder Name	视图预制在Resources目录下的相对目录(默认是Views)
Window Folder Name	窗口预制在Resources目录下的相对目录(默认是Windows)
View Configs	配置key和prefab路径的对应关系
Window Configs	配置key和prefab路径的对应关系

快速开始
目前有的示例，视图预制在Assets/Game/Resources/Views，窗口预制在Assets/Game/Resources/Windows，可以参考制作。
- 如何快速制作视图（View）
  1. 打开MainScene.unity，在Canvas创建空的GameObject，并重命名如TestView
  2. 创建类继承EgoView，如TestView.cs
  3. 对TestView.cs进行逻辑编写
  4. 将TestView挂到创建的空GameObject
  5. 在空的GameObject设置界面元素，如按钮、文本、图片等
  6. 将TestView拖到Assets/Game/Resources/Views目录下，做成预制
  7. 打开ScreenName枚举类，创建一个Test枚举
  8. 打开UI Configs，添加一条配置
  9. 配置结束，即可通过代码进行调用
- 如何快速制作窗口（Window）
  跟创建视图类似，不一样的是类继承EgoWindow，下面介绍另外一种偷懒的作法。
  1. 找到已有的窗口，如OptionWindow，ctrl+D复制一份
  2. 修改预制名，以及修改类名
  3. 修改打开效果showMotion和closeMotion
  4. UI Configs的配置
  5. 搞定

API介绍

GUIControl

描述

UI框架的管理类，比如要打开窗口，切换视图，判断当前视图和当前打开列表等等，都通过该静态类调用。

属性

属性名	返回类型	说明
CurrentView	EgoView	获取当前视图类
CurrentViewName	string	获取当前视图名
CurrentViewScreenName	ScreenName	获取当前视图名对应枚举
CurrentWindow	EgoWindow	获取当前最顶层窗口类
CurrentWindowName	string	获取当前窗口名
CurrentWindowScreenName	ScreenName	获取当前窗口枚举
CurrentWindowList	List	当前窗口列表

静态方法

方法名	返回类型	说明
ChangeView	void	切换视图
OpenWindow	void	打开窗口
CloseWindow	void	关闭窗口
CloseCurrentWindow	void	关闭最顶层窗口
OpenOrCloseWindow	void	打开或者关闭窗口
CloseAllWindows	void	关闭所有窗口
ActiveWindow	void	激活窗口（不使用动效）
DeActiveWindow	void	不激活窗口（不使用动效）
HideAllWindows	void	直接隐藏所有窗口（不使用动效）
IsWindowShow	bool	判断窗口是否显示
IsCurrentView	bool	判断当前视图是否是某视图
IsCurrentWindow	bool	判断当前最顶层是否是某窗口
RegisterWindow	void	注册窗口配置，注意：一般情况下用UI配置注册即可，特殊情况可以采用代码注册
RegisterView	void	注册视图配置，注意：一般情况下用UI配置注册即可，特殊情况可以采用代码注册
CleanUICache	void	清空UI缓存，正常情况不需要代码调用，框架会自动处理
GetView	EgoView	通过名字获取视图对象(注意：该方法会去加载预制对象，没有特殊情况，不需要使用该方法获取)
GetWindow	EgoWindow	通过注册名获取窗口对象(注意：该方法会去加载预制对象，没有特殊情况，不需要使用该方法获取)

EgoScreen

描述

视图和窗口的基类

属性

属性名	类型	说明
target	GameObject	控制目标，无特殊情况，保持为空
showEffect	BaseMotion	显示动效
closeEffect	BaseMotion	关闭动效
screenName	string	当前标识key
donotCache	bool	是否需要缓存，false则关闭后立即销毁
IsOpened	bool	是否打开
IsShowed	bool	是否打开完毕（也就是如果有打开特效，特效已经播放完毕）
IsClosed	bool	是否关闭完毕（也就是如果有关闭特效，特效已经播放完毕）

方法

方法名	说明
OpenScreen	显示
ShowScreen	显示（可传参数）
ActiveScreen	显示（不使用动效）
DeActiveScreen	关闭（不使用动效）
CloseScreen	关闭
BackScreen	返回（如按下Esc键，需要实现）

可重写

方法名	说明
OnShowIng	正要显示
OnShowed	显示完成（如有特效，特效播放完成后执行）
OnClosing	正要关闭
OnClosed	关闭完成（如有特效，特效播放完成后执行）
OnBackScreenHandle	按下返回键的效果，比如窗口按下esc的时候，关闭。视图按下esc的时候返回上一个视图。

EgoView

继承关系

继承：EgoScreen

描述

视图的基类

属性

同EgoScreen

方法

同EgoScreen

EgoWindow

继承关系

继承：EgoScreen

描述

窗口基类

属性

属性名	类型	说明
child	GameObject	动效操作的对象
modal	bool	是否是模态窗口
modalAlpha	float	模态黑框透明度
sceneBlurEffect	SceneBlurData	窗口模糊数据

方法

同EgoScreen

可重写

方法名	说明
OnClickModalHandle	点击窗口外执行函数，如实现点击窗口外关闭窗口

UI事件

事件名	说明
On_ViewChangeHandle	视图改变回调
On_WindowChangeHandle	窗口改变回调（说明当前有新窗口打开或窗口被关闭）
viewEvent	封装了视图打开中、打开完毕、关闭中、关闭完毕等高级事件回调
windowEvent	封装了窗口打开中、打开完毕、关闭中、关闭完毕等高级事件回调

相关工具
描述
框架提供了一个辅助工具，可以列出目前所有的窗口和视图，快速选中或快速编辑
打开方式：Egogame-Tool-UIEditor

选中：在Project视图中选中该预制
打开：播放前-进入预制编辑状态。播放后-打开该视图/窗口

F&Q

如何创建自定义动效（方法1：使用DoTween或者EgoTweenPro，优点：代码控制流程）

可以参考目前有的动效类，如FadeUIMotion、FallUIMotion、FadeMotion、FallMotion


xxxxxxxxxx
public class PopUpUIMotion:BaseUIMotion
{
    private bool _isForward;
    private float _duration;
    
    public PopUpUIMotion(bool isForward,float duration=1f)
    {
        _isForward = isForward;
        _duration = duration;
    }
    
    protected override void OnPlayHandle()
    {
        var fromScale = _isForward ? 0f : 1f;
        var toScale = _isForward ? 1f : 0f;
        
        //使用类似DoTween的方式创建Tween
        var tweener = transform.TweenScale(_duration, fromScale, toScale);
        tweener.easeMethod = _isForward ? EaseMethod.easeOutElastic : EaseMethod.easeOutSine;
        tweener.SetOnFinished(TweenComplete);
    }
    private void TweenComplete()
    {
        //动效完成后，调用基类的Complete函数，通知外部
        PlayComplete();
    }
    protected override void OnStopHandle()
    {
        //被强行停止时，需要停止动效
        transform.TweenStop();
    }
}


xxxxxxxxxx
GUIControl.OpenWindow(ScreenName.Option, false, new PopUpUIMotion(true));
//或者在继承EgoWindow的类中重写ShowMotion和CloseMotion
private PopUpUIMotion _popupMotion;
public override IMotion ShowMotion
{
    get
    {
        if (_popupMotion == null) _popupMotion = new PopUpUIMotion(true);
        return _popupMotion;
    }
}

如何创建自定义动效（方法2：使用EgoTween，挂在GameObject，优点：可以动态调参数）
可以参考当前有的动效，FadeMotion、FallMotion、JumpMotion、PopupMotion等等
1. 继承BaseMotion或BaseTweenMotion，实现逻辑
2. 创建GameObject挂上脚本，关联EgoWindow引用

WeiBlog

EgoFramework-UI

UI框架

介绍

设计思路

UI配置

快速开始

API介绍

GUIControl

描述

属性

静态方法

EgoScreen

描述

属性

方法

可重写

EgoView

继承关系

描述

属性

方法

EgoWindow

继承关系

描述

属性

方法

可重写

UI事件

F&Q

EgoFramework框架逻辑相关