可以先學習的知識點有：預製體，Mask，ScrollView，Layout
最終要實現的就是如下效果：
Step1：Canvas下新建-UI節點-ScrollView，自動生成如下：
層級目錄下面有：
重點關注view這個視窗：
可以發現view節點屬性中是有mask屬性，用來只顯示mask框下的內容
Step2: 修改item的大小和佈局，將width都設置爲240，錨點改爲0.5,0.5；
在item下添加單色精靈，修改顏色爲紅色；
添加小新頭像，加上label，修改字體大小；
Step3：在content節點上添加組件layout，修改layout爲垂直排布，選擇container對容器進行縮放；
Step4： 將item拖到資源管理器，形成預製體（刪除層級管理器中的item）
Step5：在content下掛載自動添加腳本：
cc.Class({
extends: cc.Component,
properties: {
item_prefab: {
type: cc.Prefab,
default: null
},
},
onLoad: function () {
for (var i = 0; i < 10; i++) {
var item = cc.instantiate(this.item_prefab);
this.node.addChild(item);
}
},
});
拖拽預製體到對應位置，運行即可。
參考視頻：
https://www.bilibili.com/video/av23265982/?p=18
真正完成的微信排行榜要需要參考：