创建了一个为 Beyond Ranch 吸引成员的工具

感谢您的辛勤工作。
我是系统开发室的松山。

这似乎很突然，但我们公司有一个名为“超越午餐”的系统。
每月一次，会员会被随机分组​​并出去吃午餐，在那里他们可以享受与平时不接触的会员的互动。
公司还补贴午餐费用，所以这是一个非常有利的制度。

关于这个分组，组织文化委员会的成员似乎每个月都在手动进行，所以
我想我应该回顾一下Unity的基础知识并创建一个应用程序。

要求

① 按按钮随机分组
② 将每个组显示为滚动列表中的一个元素
③ 使用可编写脚本的对象管理员工姓名
④ 随机分组
⑤ 使用 WebGL（浏览器）（版本）
* Unity 2019.4 使用 11f1 (LTS) 创建。

是这样吗？
只有几个非常基本的功能，但让我们逐步组装它们。

① 画面（UI）制作

使用文本作为标题和版本。
添加一个抽奖的按钮，总体思路就OK了。
适当设置画布大小。 （*由于智能手机习惯，我不得不将其设置为1920x1080并稍后更正。）

一般来说，是这样的。
对于背景，我找到了一个看起来像这样的免费图像并将其粘贴。

② 滚动列表

每个人都喜欢滚动列表。
我总是在这里上瘾（泪）

首先，为每组元素创建一个预制件。
每个小组由一名领导者和四到五名成员组成，所以看起来像这样。

由于名称是在确定成员时注册的，因此让我们创建一些代码来更新文本。
功能仅限于会员设置和显示切换。

公共类 GroupBoard : MonoBehaviour { [SerializeField] 私有 GameObject objBoard; [SerializeField] 私有列表;<GameObject> objList = 新列表<GameObject>(); [序列化字段] 私有列表<Text>txt名称 = 新列表<Text>();<string>成员名称 = 新列表<string>(); ///<summary> /// 启动处理 ///</summary>无效开始（）{初始化（）} ///<summary> /// 初始化 ///</summary>公共无效初始化（）{memberNames.Clear（）; } ///<summary> /// 隐藏（不活动） ///</summary> private void hide() { // 隐藏所有板块 foreach (objList 中的 GameObject obj) { obj.SetActive(false) } // 隐藏底层 objBoard.SetActive(false);<summary> /// 显示（活动） ///</summary>公共无效显示（）{ int mid = 0; for（int i = 0; i <memberNames.Count; i++) { objList[mid].SetActive(true); txtName[mid].text = memberNames[mid]; mid++; } } /// <summary>/// 会员注册 ///</summary> ///<param name="name">会员姓名</param>公共无效SetMember（字符串名称）{memberNames.Add（名称）}}；

最重要的是滚动列表，但

您需要的一切都是在
菜单 UI > Scroll View这很容易。现在让我们进行一些设置。
・调整滚动视图的大小
・删除不必要的水平滚动
・将视口的遮罩更改为矩形遮罩 2D
・调整内容的高度
・将布局元素添加到组的预制件
* 由于这次元素数量较少，所以不考虑元素重用。

总体来说，UI设置已经完成了。

备注）滚动列表使本文易于理解（感谢）
ScrollView Reference

③ 脚本化对象

准备领导者名单和员工名单。
让我们通过可编写脚本的对象来更轻松地管理和扩展。

首先，准备一个基本定义。

[CreateAssetMenu] 公共类 BeyondMember : ScriptableObject { 公共列表<string>领导列表 = 新列表<string>();<string> membeList = 新列表<string>();

Beyond Member 将被添加到资产 > 创建下的菜单中，因此请执行此操作。
将生成数据，因此请在此处注册员工姓名。
将数据放在资源中以便于阅读。

*由于要上传到GitHub，所以暂时用虚拟名称注册。

备注）Scriptable Object 更容易理解（感谢）
ScriptableObject Reference

④ 随机分组

这是 C# 代码，不是 Unity 功能。
我简单解释一下以下两点。

从可编写脚本的对象加载数据

您可以简单地使用 Resources.Load() 加载它。

私人 BeyondMember 超越 = Resources.Load<BeyondMember> （“超越会员”）；

其余的都是List格式，可以直接使用。

随机选择

领导者已经确定，所以要按顺序排列。 （领导者人数 = 组数）
成员是随机选择并放置在每个组中的。
过程是这样的吗？

///<summary> /// 随机选择成员 ///</summary> private void lotteryMember() { int gno = Random.Range(0, groupNum - 1); // 起始组号列表<string>成员=新列表<string>(beyond.membeList); do { int num = Members.Count; int mid = Random.Range(0, num); boardList[gno].SetMember(members[mid]); (gno >= groupNum) gno = 0; } while (members.Count > 0);

* 如果你简单地分配List，它将通过引用传递，因此它会在构造函数中重复。

⑤ 使用WebGL构建

将平台切换到 WebGL 并构建。
将输出几个文件，例如Index.html，因此将它们放在服务器上并完成。
然而，它也有一些奇怪的事情。

字体不显示

执行浏览器时，不会显示编辑器上显示的日语字符。
快速查看后，似乎没有显示文本组件“Arial”，因为它不包含日语字符。
注）请参阅此（谢谢）
WebGL 中不显示日语字体
下载单独的字体并切换要使用的字体。

屏幕布局被破坏

分辨率出奇地低，并且滚动列表与标题和按钮重叠。
当我也查看时，默认分辨率似乎是 960x600。
注意：解释使用 WebGL 的要点，包括字体（谢谢）
WebGL 注释
为每个版本调整 index.html 并不容易，所以这次我将在 960x600 下微调布局。

概括

现在，我们现在可以创建随机组，所以它已经完成了。
我已经有一段时间没有使用Unity的基本功能uGUI和ScriptableObject了，但
我认为只需要几个工具就可以轻松创建一个。
这是它第一次支持WebGL，但存在字体等微妙的隐藏陷阱。 。 。

现在我们已经包含了 Beyond Ranch 工具的最低功能，我们希望将来添加以下功能。

・可以选择年份和月份并按月分组显示
・保留每个月的组成员
・随机确定成员时，不要使用与上个月相同的成员

如果这个问题能够得到解决，这难道不是一个非常有用的工具吗？
好了，现在就这些了。

这次我也将示例项目上传到 GitHub。
我希望这会对您有所帮助。
统一示例

最后

我开设了我所属的系统开发服务网站“SEKARAKU Lab”。
Beyond是从服务器设计搭建到运营的一站式服务，所以如果您在服务器端开发方面遇到任何问题，请随时联系我们。
SEKARAKU 实验室： [https://sekarakulab.beyondjapan.com/](https://sekarakulab.beyondjapan.com/)