【转载】在 UMG 中使用 ColorPicker

806 阅读4分钟

原文链接:【插件】在UMG中使用ColorPicker | Mantra

正文

时势造英雄,但是更重要的是英雄克服了巨大的困难并且抓住了千载难逢的机遇

--- Mantra

一直有一个理想,就是可以不用干活就有钱花。但是。。。

咳咳,回到正题。

今天我们实现的功能是如何把 UE4Editor 里的 ColorPicker(就是下图中的这货)应用到 UMG 中,这样选择颜色不是很酷? 插件和示例工程下载在文章末尾。

一、先来看最终效果

  • 选择颜色时按钮刷新

动画123.gif

二、思路来源

网上一顿搜(鲁大师都说过“天下文章一大抄”,不是不知道羞耻,是因为自己菜,菜,菜。。。)还真被我找到了,传送门 ,不过没有找到原作者(Rama)的地址,这是被 fork(是fork,不是 fu*k )的。不过也没有那么重要了。

顺带提一嘴,有找到的记得告诉我,我补上。

三、如何使用

按照一般套路将插件导入到工程中即可:

(小白专用)首先将插件下载下来解压,之后拷贝到工程目录下(.uproject)的 Plugins 文件夹中(没有的话可以手动创建一下,注意大小写和名字绝对不能错),之后重新打开工程,不出意外的话可以正常进入,提示错误的时候点击 “重新构建” 即可。如果依然不行就加群来问我呀

如何确保导入成功了呢?打开 Edit>Plugins 菜单,看到如下内容并且已经处于激活状态即可(默认应该是激活状态,如果没有激活则勾选“Enable”并重启编辑器即可)。

既然是在 UMG 中使用,所以我们创建一个 UMG(这个就不用多说了吧,不会的话可以找我的视频教程),之后可以在左侧的 Victory UMG 分类下面找到 Joy Color Wheel ,直接拖拽到视图中,如下图所示。

一个最基本的 ColorPicker 就创建好了,接下来我们查看这个组件的属性,如下图所示,比较关键的有两个(JoyColor 设置颜色,还有 OnColorChanged 回调,颜色改变时执行的操作)(如果颜色属性没有出来,记得用我改过的插件呦,文章最后有下载地址)

为了完成测试我们创建了下图中的 UMG,实现什么效果呢?当改变 ColorPicker 的颜色时会刷新按钮的背景色,点击按钮时会将 ColorPicker 的颜色进行重置。

具体的实现逻辑如下

image.png

点击打开大图

做完这些操作之后就可以实现前面视频中演示的最终效果。

四、更高级的东西

如果下载了我改过的插件和工程(下载链接在文章最后),会发现我在插件中添加了很多的注释方便快速理解和拆分(如果有什么不对的地方,欢迎大佬指正批评,一定认真改过自新,重新做人【咦,好像哪里不对。。。】),废话不多说,截几张图吧。

补充一点:如何查看插件中的代码?如果你创建的是一个纯蓝图工程,需要首先添加一个 C++ 类才能查看,点击 File>New C++ Class,随便选择一个父类(如果生活中也可以随便选择父亲。。。。。),这个条条走完会打开 VS。

解决方案中找到这个路径打开即可

接下来是注释预览图

image.png

image.png

image.png

五、彩蛋

在写注释的过程中遇到一个问题,如何在 .uplugin 文件中写注释,因为想把我要对你说的小秘密写在里面,在群里问了问大佬(小白瑟瑟发抖),大佬说 “查一下JSON怎么写注释” ,后来一查(自己动手丰衣足食)有两种方式:

第一种 就是 类代码注释 /** */,类似于这种,但是很不幸,我们的 .uplugin 文件只能是类JSON(类。。。而不是 是),所以这种方式编译失败,UE4 不认。

么滴办法,需要找第二种,也就是下面这种

需要以 Key:Value 的形式书写,具体效果如图所示

六、下载地址

百度网盘 提取码 100g