利用EditorWindow配制序列化数据表格

简介：

程序开发中需要连接网络或在程序外部进行配制的数据，一般不保存在unity自身序列化的文件中。但一些固定的数据类型，利用unity3d自身的序列化功能，配合Editor编程可以方便快速的制作可扩展的数据加载模块，需要更换数据源也变得十分便利。本文就一个比较复杂的可序列化类，利用Editor窗口编程，实现数据的快速配制。

一、数据模型

1、准备一个数据类DataItem，需要为类添加Serializable属性，这样可以利用unity3d的序列化功能记录到文件中

[Serializable]

public class DataItem

{

    public string name;

    public List<float> values;

    public string unitName;

    #region graph

    public bool graph = true;

    public string graphName;

    public float axisMin;

    public float axisMax;

    public float axisSize;

    #endregion

}

2、还是使用一个更加复杂的类，上面的一个类直接在面版上进行编辑就好了，没有必要使用EditorWindow到重新写一遍显示（其实也是因为实际项目用到这样一个复杂的类，顺便不用重新写一个新的）

[Serializable]

public class DataList

{

    public string name;

    public DataItem key;

    public List<DataItem> values;

}

3、写一个可序列化的对象，并且添加创建菜单（同时这个对象创建出来后在Inspactor面版上所显示的数据变得异常复杂）

[CreateAssetMenu(fileName = "LoadForceDataObject.asset", menuName = "生成/加载数据")]

public class LoadForceDataObject : ScriptableObject {

    public List<DataList> dataList;

}

4、在Inspactor面版上的显示效果如下，显然在这样的面版中进行数据配制十分困难（还只设置了一个DataList和其中一个Key,,,）



二、设计人性化的配制面版

1、分析数据类型

     在窗口界面中应该有一个放置数据源的输入框，在有数据的情况下可以显示一个大的可缩放的可视化区域，这其中每一个DataList对象显示为一个小的固定大小的区域，在其中至少有一个固定的DataItem作为Key,DataItem中其中的Values不想一个一个填写，要求可以进行对一个串以符号分割的字符串进行split，自动加载到其中去。

2、绘制草图

    按以上的思路进行设计，可以做出以下的草图



三、实现细节

1、建立窗口类，并实现窗口打开。按如下脚本可以实现一个editor模式下的指定大小的小窗口

public class DataTableWindow : EditorWindow

{

    [MenuItem("Window/DataTable")]

    static void CreateWindow()

    {

        EditorWindow window = EditorWindow.GetWindow<DataTableWindow>("数据配制", true);

        window.position = new Rect(200, 300, 600, 400);

        window.maxSize = new Vector2(600, 400);

    }

}

2、绘制数据源，实现效果如下图所示

  void DrawHead()

    {

        using (var scope = new EditorGUILayout.HorizontalScope())

        {

            GUI.Box(scope.rect, new GUIContent());

            EditorGUILayout.SelectableLabel("数据源", LayoutOption.shortWidth);

            dataObj = EditorGUILayout.ObjectField(dataObj, typeof(LoadForceDataObject), false, LayoutOption.longWidth) as LoadForceDataObject;

        }

    }



3、绘制一个List添加功能按扭， 输入框内放入创建的asset格式的数据源后，开始是没有数据的，因此需要一个按扭来创建一个DataList是没有数据的，因此需要一个按扭来创建一个DataList 并加入到这个对象中，效果如下图所示。使用HorizontalScope这不必要，主要是考虑到还有一些其他的操作功能也可以加入到其中

  void DrawListsTools()

    {

        using (var scope = new EditorGUILayout.HorizontalScope())

        {

            GUI.backgroundColor = Color.blue;

            if (GUILayout.Button("+", LayoutOption.shortWidth))

            {

                dataLists.Add(new DataList());

            }

            GUI.backgroundColor = Color.white;

        }

    }



4、绘制可滑动的实体区域，bodyScorll 是一个全局变量，用来保存当前的滑动所处的状态。dataLists是数据源对象所包含的所有DataList,在这其中将绘制的功能再次分为绘制DataList的标题头和数据体。

  void DrawBody()

    {

        using (var scope = new EditorGUILayout.ScrollViewScope(bodyScorll))

        {

            bodyScorll = scope.scrollPosition;

            foreach (var item in dataLists)

            {

                using (var vscope = new EditorGUILayout.VerticalScope())

                {

                    GUI.Box(vscope.rect, new GUIContent());

                    if (DrawListHeader(item))

                    {

                        DrawListBody(item);

                        GUILayout.Space(EditorGUIUtility.singleLineHeight);

                    }

                    else

                    {

                        continue;

                    }

                }

            }

            if (waitDeleteList != null)

            {

                dataLists.Remove(waitDeleteList);

            }

        }

    }

带有返回值的LitstHeader绘制可以实现数据体的展开和隐藏

 bool DrawListHeader(DataList list)

    {

        using (var scope = new EditorGUILayout.HorizontalScope())

        {

            if (!viewDic.ContainsKey(list))

            {

                viewDic.Add(list, true);

            }

            if (viewDic[list] = GUILayout.Toggle(viewDic[list], list.name,LayoutOption.mediaHigh))

            {

                GUI.backgroundColor = Color.green;

                GUI.Box(scope.rect, "");

                GUI.backgroundColor = Color.white;

                EditorGUILayout.LabelField("ListName", LayoutOption.longWidth);

                list.name = EditorGUILayout.TextField(list.name, LayoutOption.longWidth);

                list.values = list.values ?? new List<DataItem>();

                GUI.backgroundColor = Color.blue;

                if (GUILayout.Button("+", LayoutOption.minWidth))

                {

                    list.values.Add(new DataItem());

                }

               

                GUI.backgroundColor = Color.white;

                return true;

            }

            else

            {

                GUI.backgroundColor = Color.red;

                if (GUILayout.Button("-", LayoutOption.minWidth))

                {

                    waitDeleteList = list;

                }

                GUI.backgroundColor = Color.white;

                return false;

            }

        }

    }

5、其他细节就没有太多了，github地址为：https://github.com/zouhunter/Editor_Extends(后续有相关的编辑器学习使用的脚本会同步到其中)

四、最终截图：（在这样的环境进行配制貌似省心了不少吧）