本文来自网易云社区

作者:汪毅军

最近使用了NGUI做了下可展开列表,其主要思路如下:首先最外层使用Scroll view以达到滑动效果,然后列表使用UITable进行排列,最后通过点击Item控制Item的显示和隐藏。 效果如下:

Item结构

列表层次结构图如下:

每一个Item下可分为两部分:其中HideItem表示隐藏的部分。剩余的表示一直显示的内容,就比如效果图中的“Item1”,“Item2”等内容。 我们可以根据具体需求提前摆放好Item,或者通过代码动态加载。

功能实现

  • 首先给UITable下的每个Item挂载上点击监听

    [SerializeField]    private UITable _table;    private List<Transform> items;    void Start ()
    {
        items = _table.GetChildList();        for (int i = 0; i < items.Count; i++)
        {
            Transform item=items[i];             UIEventListener.Get(item.gameObject).onClick = OnItemClick;
        }         _table.Reposition();     }
  • 其次定义好打开和关闭操作,需要注意的是,每次打来关闭后,务必调用一下_table.Reposition()以触发UITable去重新排列。

    private void OpenItem(Transform transform)
    {
        transform.Find("HideItem").gameObject.SetActive(true);
    }    private void CloseItem(Transform transform)
    {
        transform.Find("HideItem").gameObject.SetActive(false);
    }    private void ToggleItem(Transform transform)
    {        if (transform.Find("HideItem").gameObject.activeSelf)
        {             CloseItem(transform);
        }        else
        {
            OpenItem(transform);
        }     }    private void OnItemClick(GameObject go)
    {//      这里用于关闭其他的Item,视具体需求使用//        for (int i = 0; i < items.Count; i++)//        {//            if(items[i]!=go.transform) CloseItem(items[i]); //            //        }         ToggleItem(go.transform);
        _table.Reposition();     }

到此为止,一个最简单的可展开列表就实现了。

网易云免费体验馆,0成本体验20+款云产品!

更多网易研发、产品、运营经验分享请访问网易云社区

相关文章:
【推荐】 一个只有十行的精简MVVM框架
【推荐】 abtest-system后台系统设计与搭建

NGUI可展开列表的实现的更多相关文章

  1. jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...

  2. RecycleView实现多布局可展开列表

    代码地址如下:http://www.demodashi.com/demo/13193.html 前言 在开发的时候,我们不免会遇到这么一种数据展示,该数据有以下特征: 数据要以列表形式展示 每条数据要 ...

  3. Android 可展开列表组件 ExpandableListView

    ExpandableListView 是ListView的子类,它把应用中的列表项分为几组,每组里可包含多个列表项. 所显示的列表项应该由ExpandableListAdapter 接口提供,实现Ex ...

  4. 纯CSS实现展开列表

    效果预览 以下为源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...

  5. 快速了解“云原生”(Cloud Native)和前端开发的技术结合点

    欢迎访问网易云社区,了解更多网易技术产品运营经验. 后端视角,结合点就是通过前端流控缓解后端的压力,提升系统响应能力. 从一般意义理解,Cloud Native 是后端应用的事情,要搞的是系统解耦.横 ...

  6. 【原创】从 列表的重复 到 用sum展开二层嵌套列表将子元素合并

      转载请注明出处:https://www.cnblogs.com/oceanicstar/p/9517159.html     ★像R语言里头有rep函数可以让向量的值重复,在python里面可以直 ...

  7. jQueryMobile控件之展开与合并

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. NGUI ScrollView 循环 Item 实现性能优化

    今天来说说一直都让我在项目中头疼的其中一个问题,NGUI 的scrollView 列表性能问题,实现循环使用item减少性能上的开销. 希望能够给其他同学们使用和提供一个我个人的思路,这个写的不是太完 ...

  9. Unity开发之NGUI系列

    Unity插件收集 在Unity开发过程中会收集一些插件,收集这些插件的目的并不是我喜欢在开发中使用插件,而是本着喜欢的态度去收集的,就像我喜欢收集模型一样: 还有一点就是通过了解插件能让我知道Uni ...

随机推荐

  1. 企业级NFS网络文件共享服务_【all】

    1.1. 什么是NFS(1台机器提供服务) Network File System(网络文件系统)通过局域网让不同的主机系统之间共享文件或目录. NFS客户端可以通过挂载的方式将NFS服务器端共享的数 ...

  2. 微信小程序 取随机数

    第一思路 如:现在要从50<  . =<100内取一个随机数: ran.Next(1,50)生成的是1-50的随机数+50 结束 第二思路 Math.random()的取值范围是: 0&l ...

  3. Ardunio led呼吸灯

    #include <Adafruit_NeoPixel.h> #define PIN 9#define LED_NUM 16Adafruit_NeoPixel strip = Adafru ...

  4. Winform启动时隐藏不显示

    我最终用了这个方法:1.MainForm的构造方法中添加: public MainForm() { InitializeComponent(); this.ShowInTaskbar = false; ...

  5. [CEOI2017]Building Bridges

    题目 斜率优化思博题,不想写了 之后就一直\(95\)了,于是靠肮脏的打表 就是更新了一下凸壳上二分斜率的写法,非常清爽好写 就当是挂个板子了 #include<algorithm> #i ...

  6. yii 执行流程

    应用执行流程: 浏览器向服务器发送 Http Request | 控制器(protected/controllers) | |---> Action | 创建模型 (Model) | 检查$_P ...

  7. windows 下搭建git服务器,及问题处理。

    最近要做一个源码管理服务器,权衡了一下还是git最适合,搭建服务器前看了网上一些windows下搭建git服务器的帖子,感觉还比较简单,没有太多需要配置的地方,于是开始动手. 我选择的是 gitfor ...

  8. Solr服务在Linux上的搭建详细教程

    一.系统环境 注:欢迎大家转载,非商业用途请在醒目位置注明本文链接和作者名dijia478即可,商业用途请联系本人dijia478@163.com. CentOS-6.7-i386-bin-DVD1 ...

  9. Python之Cubes框架使用

    本文主要内容包含Cubes框架的介绍和简单使用. 一. 介绍和安装 Cubes是一个轻量级的Python框架和一套工具,用于开发报告和分析应用程序,在线分析处理(OLAP),多维分析和聚合数据的浏览. ...

  10. 【转】纯JS省市区三级联动(行政区划代码更新至2015-9-30)

    本文代码实现的功能是省市区三级联动下拉列表,纯Javascript,网上已有很多这方面的代码.但是作为一个新手,这是我的第一篇CSDN博客,发此文的目的主要是学习交流,希望看到的朋友发现有什么不对的地 ...