14. 预制体 Mask Layout ScorllView组件使用

1. 预制体

制作预制体: 将节点拖入到assets/res文件夹下;
加载预知体: 代码加载(统一在资源加载时讲解)与手动绑定;
预制体对象实例化: cc.instantiate;

 

2. Mask组件

Mask组件是提供viewport功能的一个组件，你可以想象通过一个窗口去看外面的世界, 只能看到这个窗口大小的视区;
Mask的形状: 矩形, 圆形, 图片的Alpha值来做mask;
一个节点加上Mask组件后，它和它的孩子在这个范围内的会显示，不在这个范围内的不显示;

 

3.  cc.Layout

布局组件
     有些物体的布局，可以不用我们写死位置，可以根据内容来排榜
     比如垂直排版, 水平排版等，这样的话，就是不用我们自己调整给我们排好非常方便;
布局组件的面板属性:
      ResizeMode:  
            Node不会对子节点和容器进行大小缩放
            Child: 对子节点的大小进行缩放;
            CONTAINER:对容器的大小进行缩放; 常用的
布局类型: 水平，垂直, GRID布局

 

4. cc.ScrollView

滚动列表的主要结构:
     root->view(Mask裁剪超出范围的内容) ---> content(Layout)负责内容排版;
滚动列表的每个选项:
    root(w, h,制定大小，好给Layout用)
代码里面使用cc.ScrollView
    step1: 将选项做成预制体
    step2: 在代码里面new 出预制体,加入到content节点下;

 

示例请见下节:简易排行榜,列表