Unity使用UGUI设置一个简单多级下拉菜单（不需要代码）

最新推荐文章于 2024-05-31 10:54:37 发布
最新推荐文章于 2024-05-31 10:54:37 发布
阅读量4.6k 收藏 53
点赞数 7
分类专栏： Unity UI相关 文章标签： unity
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44535994/article/details/103981069
版权

使用UGUI设置一个简单多级下拉菜单（不需要代码）

一、效果图

在这里插入图片描述

二、简介

在做项目时需要用到多层下拉框，之前也研究过，但是都是用代码来计算图片的大小来写出来的，又复杂又不方便，一直觉得Unity本来就应该有这个简单的功能，可是自己就是找不到，前段时间又有这个需求，在看了一些大佬博客后就突然想到了这个方法，所以记录一下。

三、具体实现方法

（一）设置Hierarchy面板

1.首先设置一个背景图片，同时挂载上ScrollRect组件，以及mask组件

ScrollRect：滑动列表，里面的数值请自行查看官方文档
mask：遮盖组件，给图片挂载此组件，则不显示此图片子集以外的区域（可以自己试一下）
在这里插入图片描述

2.增加一个空物体为子类，挂载上图片上的组件

Child Controls Size：width打钩后子物体的框不可以自定义，只能与当前物体一样框，高同理
Child Force Expand:选中这个子物体自动扩张
下面的Content Size Fitter,必须挂载，你可以不挂试一下

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

四、细节注意

（一）UI层级

因为上面的Vertical Layout Group 是按照顺序来进行排序的 ，所以列表布局内的层级顺序一定要搞清楚，这也算是一个小小的瑕疵吧。
在这里插入图片描述

（二）要想达到显示和隐藏的效果必须使用Toggle来进行拖拽，Button好像只能设置一次，要是觉得toggler不好用，你也可以使用代码来控制Button。

五、结束语

接下来你就可以按照这个方法多来几层，达到这个效果，再次温馨提示，多层也是全部使用的Toggler
在这里插入图片描述

weixin_44535994
关注
  • 7
    点赞
  • 踩
  • 53
    收藏
    觉得还不错? 一键收藏
  • 9
    评论
专栏目录
Unity UGUI 折叠菜单的实现
qq_35153714的博客
04-30 6842
using System.Collections; using UnityEngine; using UnityEngine.UI; public class FoldableMenu : MonoBehaviour { private RectTransform content;//父物体的parent private TextAsset textAsset;//所有菜单信息 ...
unity-Ugui-伸缩缩菜单显示固定内容一一一一新手
菜的抠脚的博客
12-14 4200
using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; public class demo1 : MonoBehaviour { private List _btnlist = new List();//同级按钮组 public Transf
Unity（UGUI）做一个三级下拉菜单列表（树形下拉菜单）。
03-28
最新项目需求要求做一个三级下拉菜单列表（树形下拉菜单）。但UGUI并没有原生的插件，只能自己实现。思路每个级的ItemPanel（一个单级菜单条）样式是一样的，于是需要一个panel来装所有的itemPanel，在整个菜单 顶部panel上添加vertically layout group组件，使下面的子菜单从上到下依次排列
Unity实现QQ列表折叠菜单
08-19
主要为大家详细介绍了Unity实现QQ列表折叠菜单，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
Unity制作下拉列表
最新发布
guwen2233的博客
05-31 323
4.在Content下新建Image改名为Obj，手动调整至Content同等大小,然后选择Content把Content Size Fitter组件下的Vertical Fit改为Perferred Size,随后把Viewport和Content拖入Scroll View组件下的同名选项里。2.在Scroll View下新建Image，改名为Viewport，点击锚点按住alt，点击随父物体全屏，然后添加Mask组件，取消勾选Show Mask Graphic。
Unity UGUI实现折叠菜单功能
qq_20991149的博客
03-01 7134
其实很简单，一开始自己想复杂了。只需要利用VerticalLayout Group组件嵌套就可以了。 使用了一个ScrollView 组件，一个标题面板TitleItem，一个子面板panelItem和最终显示的子项dataItem,下面把具体的设置和代码贴出来，照着做很简单就可以实现一个折叠菜单的效果,打开菜单的效果使用了DOTween插件。 下面是具体代码 using System.Collections; using System.Collections.Gen..
Unity3d UGUI实现层级菜单
08-30
层级菜单在Unity中用到的并不多，主要是做分类的时候用的比较多，今天就给大家分享几个层级代码，扩充一下，写成插件也是不错的。
Unity UGUI三维菜单旋转循环
06-07
本项目“Unity UGUI三维菜单旋转循环”旨在利用UGUI系统开发一个创新的交互式菜单，该菜单具有3D旋转效果，并且能够循环展示，不受菜单项数量限制。下面我们将深入探讨这一技术实现的关键知识点。 首先，我们来理解...
Unity用UGUI制作一个多选下拉框
12-21
Unity用UGUI制作一个多选下拉框 资源包教程及其说明： https://blog.csdn.net/weixin_48388330/article/details/135126028
Unity下使用UGUI画线
02-09
也有分享使用UGUI画线的方法，但是效果不符合我的项目。画完一次之后重新画时，要么是直接清除了上次的， 要么或首尾连接结束点。 在参考了他们的方法之后，这个脚本也是在UGUI下制作的，尽量还原在纸上画线的效果；...
unity自制多级树型菜单，实现分层次列表展开，仿unity编辑界面Hierarchy窗口-附件资源
03-05
unity自制多级树型菜单，实现分层次列表展开，仿unity编辑界面Hierarchy窗口-附件资源
Unity 中实现一个简单的可折叠菜单
Sun.ME的博客
11-01 5552
Unity3D 中使用UGUI实现可折叠菜单
[Unity][UGUI]Scroll View的折叠UI
BuladeMian的博客，菜得抠脚，菜得真实
09-22 1983
1.先创建Scroll View，对 Content实体添加 Vertical Layout Group组件 在其下面创建 若干个Button子物体，对Button的Text进行设置 便于区分其他子物体Button 2-4分别测试 3种不同的情况，来改变子物体的顺序，对Scroll View的显示有什么区别。 2.设置其中的一个按钮Button的gameobject...
小程序-实现折叠面板-手风琴效果
itclanCoder
10-14 2321
虽互不曾谋面,但希望能和您成为笔尖下的朋友以读书,技术,生活为主,偶尔撒点鸡汤不作,不敷衍,意在真诚吐露,用心分享点击左上方,可关注本刊标星公众号（ID：itclanCoder）如果不知...
uniGUI之主窗口折叠UI之UniTreeMenu(32-2)
GuoGuoABC
04-01 771
目前发现菜单太多时右侧不能自动出现垂直滚动条，即太多的子菜单将超出屏幕范围，鼠标滚轮不能翻动菜单项，不太方便。在UniTreeMenu的clientEvents属性里的UniEvents里，左侧顶部选择Ext.list.Tree,然后在treeMenu.afterCreate里面添加代码如下，即可解决，效果还不错。[info]和[search],[home],[download],[trash],[refresh],[reply],[star],[user]有用，不是所有的都会显示出来。
Unity：UI自动布局与多级菜单
qq_42987967的博客
06-27 1932
在自动布局中主要用到了锚点、轴心、Content Size Fitter、Vertical Layout Group这几个特性。锚点与锚心是两个在UI当中比较重要的概念了，作为初学者，弄了好久才弄明白。首先可参考Unity手册：矩形变换 - Unity 手册锚点又称锚钉，既然能称之为钉子说明其是牢固的，但是其的牢固是相对父物体的，即以父物体的坐标为参考单位的。最形象贴切的理解是这个：unity中关于锚点的相关知识 - LittleMan丶 - 博客园锚点相当于钉子，其位置只受到父物体大小的影响，并且锚点的坐
Unity使用UGUI设置一个简单多级水平方向下拉菜单（不需要代码）
qq_37524903的博客
06-28 1350
参考：Unity使用UGUI设置一个简单多级下拉菜单（不需要代码）_Y-Jin heart的博客-CSDN博客需要对这些unity 组件有所了解：对ScrollRect 、Mask 、Horizontal Layout Group Content Size Fitter GridLayoutGroup效果图： 具体实现步骤：1.创建Image当作父节点，给父节点 添加相应组件 2.创建空物体，为父节点子物体，添加相应组件Child Controls Size：width打钩后子物体的框不可以自定义，只能
【ui系统学习】轻松学会 unity 的 ugui基础控件的使用(包括一个简易血条、蓝条设
05-01
Unity的UGUI基础控件是设计界面和交互的重要组成部分，它们能够让开发者轻松地创建出各种各样的UI界面。其中，最常见的基础控件包括Button、Toggle、Slider、Scrollbar等。下面，我将详细介绍如何在Unity中使用UGUI基础控件。 首先，我们需要了解如何创建UI控件。打开Unity编辑器，选择GameObject->UI->想要创建的控件（例如Button）即可创建一个新的UI控件。可以通过拖拽、调整属性等方式将其设置为想要的样式和功能。 接下来，我将用一个简单的血条和蓝条的实例来展示UGUI基础控件的使用。首先，我们需要创建两个UI Image控件，用于显示血条和蓝条。在Inspector面板中，设置它们的颜色、位置、大小等属性，使它们符合我们想要的效果即可。 然后，我们需要创建一个Slider控件，用于控制血条和蓝条的填充量。在Inspector面板中，我们需要设置Slider的Value属性，使其在滑动时能够控制UI Image的填充量。同时，还需要将Slider的Direction属性设置为左向右或下向上，以符合我们想要的UI设计。 最后，我们需要编写一些简单的脚本来实现血条和蓝条的逻辑。在每一帧中，我们需要将Slider的Value值与UI Image的Fill Amount属性关联起来，使得它们随着Slider的滑动而变化。同时，还需要根据游戏的状态和变化来更新Slider和UI Image的Value和Fill Amount属性，从而实现动态的UI控件。 通过这个简单的实例，我们可以看到UGUI基础控件的使用非常简单，只需了解每个控件的属性和使用方法，就能轻松创建各种各样的UI界面。同时，我们还需要注意UI控件的优化，以保证游戏的流畅性和性能。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 9
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值