【Unity】UIElements Expansions: Carousel

UIElements Expansions是Unity Editor的扩展资产。

UIElements Expansions: Carousel

「UIElements Expansions: Carousel」系列强烈支持「UIElements」,开始与Unity 2019.1。

所谓UIElements

UIElements是从Unity 2019.1开始引入的替换当前Unity编辑器的GUI系统(IMGUI)的功能。

您可以创建Unity的GUI,就像使用HTML和CSS创建网页一样,组合Unity的HTML「UXML」和Unity的样式表「USS」。

当然,您可以像以前一样在编辑器脚本中为编辑器编写处理,并且有像jQuery这样的方法,因此您可以创建像HTML5这样的动态GUI。

在未来,计划不仅取代编辑器,还取代运行时GUI(当前uGUI),并且有望留给未来的Unity GUI。

只是潜力很高,但由于它刚刚推出,它还没有足够的功能来充分利用它。

「UIElements Expansions」是一种强烈支持其缺失部分的资产。

此「UIElements Expansions: Carousel」主要支持以下功能。

• UIElements Expansions通用功能
  • 全局样式表
  • 检查器自动转换功能
  • 添加标签/功能
  • 附加类
• 圆盘传送带
• 圆盘传送带控制器

UIElements Expansions通用功能

请参阅以下页面。

圆盘传送带

在「UIElements Expansions:Carousel」中,您可以放置名为轮播的组件。

旋转木马是Web上的常用组件,可以定期切换图像和内容。

您可以将其放在站点的顶部,并以良好的外观安排要在站点中呈现的内容。

使用此资产,您不仅可以自由放置图像,还可以放置UXML标签,这样您就可以按顺序显示各种内容。

当然,最好将它放在编辑器窗口中,但根据使用情况,也可以在检查器上显示它与MonoBehaviour或ScriptableObject相关联。

圆盘传送带控制器

在「UIElements Expansions:Carousel」中,您不仅可以放置轮播,还可以通过按钮控制显示。

通过放置下一个按钮或上一个按钮,您不仅可以自动切换,还可以手动切换轮播的内容。

利用方法

导入

请从Unity Asset Store购买。

购买后可从「我的资产」导入。

圆盘传送带

基本用法

旋转木马的使用是「engine:CarouselGroup」和「engine:Carousel」的组合。

通过在「engine:CarouselGroup」下放置多个「engine:Carousel」并在「engine:Carousel」中描述您喜欢的UXML标签,将替换由「engine:Carousel」包围的每个UXML元素。

<engine:CarouselGroup name="carouselgroup">
  <engine:Carousel name="carousel1">
    Carousel Contents
  </engine:Carousel>
  <engine:Carousel name="carousel2">
    Carousel Contents
  </engine:Carousel>
</engine:CarouselGroup>

自动游戏

对于上述代码,轮播元素不会移动。如果要自动替换每个元素,则必须在「engine:CarouselGroup」中将「autoplay」属性设置为「true」。

<engine:CarouselGroup autoplay="true" time="5000" name="carouselgroup">
  <engine:Carousel name="carousel1">
    Carousel Contents
  </engine:Carousel>
  <engine:Carousel name="carousel2">
    Carousel Contents
  </engine:Carousel>
</engine:CarouselGroup>

通过指定「time」属性,您可以指定每个元素等待显示的时间。

圆盘传送带控制器

可以使用「BindableButton」来控制轮播。

「上一个」 「下一个」

对于「上一个」和「下一个」按钮,为「BindableButton」的「target」属性指定「engine:CarouselGroup」的名称,为「control」属性指定「prev」或「next」。

<editor:BindableButton text="Prev" target="carouselgroup" control="prev" />
<editor:BindableButton text="Next" target="carouselgroup" control="next" />

如果指定「prev」,则上一个移动,如果指定「next」,则旋转木马元素将转换到下一个。

显示指定的轮播单元元素

通过为「BindableButton」的「target」属性指定特定的「engine:Carousel」名称并为「control」属性指定「show」,您可以直接显示特定的轮播元素。

<editor:BindableButton text="Show Carousel 2" target="carousel2" control="show" />

如果轮播单元格中的「autoplay」有效,请在显示指定元素并等待一段时间后自动显示下一个元素。

总结

「UIElements Expansions: Carousel」强烈支持「UIElements」,开始与Unity 2019.1。特别是,您可以轻松编写需要编写编辑器脚本的检查器的设计。

此外,通过使用轮播,可以在编辑器窗口或检查器中显示适合用户眼睛的内容。

该设计引入了平面设计,并且它被安排成与Unity 2019.3相匹配的形状,这将立即变得很酷,因此您可以舒适地使用它。

如果您有兴趣,请务必考虑一下,因为它在资产商店出售！