这篇记录了三个控件的使用流程：ScrollView和 ListView、PageView。
ScrollView
ScrollView这个控件大家应该挺熟的吧，反正我是经常用到。
1、首先在Cocos Studio 的UI界面添加一个ScrollView的控件，然后设置其属性。ScrollView要设置的东西比较多，我一开始做了如下的设置：
a 设置scrollView的显示窗口大小（Size）为：300x300；
b 设置scrollView的容器层大小（ContentSize）为 300*300；
c 打开BounceBack，也就是当scrollView拖到边缘时有一种弹性的效果
d 设置name 为 scrollView
e 往scollView中添加三个ImageView控件，其中两个放在scrollView显示窗口内，另外一个放在scrollView的显示窗口下方
e 导出工程到Cocos2d-x项目的Resources目录中
2、在Cocos2d-x中加载ScrollView的Widget，代码如下：
|
1
2
|
Widget*scrollViewUi=GUIReader::getInstance()->widgetFromJsonFile(
"ScrollViewUI/ScrollViewUi_1.json"
);
this
->addChild(scrollViewUi,2);
|
调试发现，scrollView的widget已经添加进了场景，但是想拖动scrollView却无法拖动，这也就看不到放在scrollView上的最下方的ImageView控件。
回到Cocos Studio中看下之前ScrollView的属性设置，发现容器层的大小不应该设置成与显示窗口一样，而应该比它大，这样才能拖动scrollView，于是修改第一点的第 b 步：
b 设置scrollView的容器层大小（ContentSize）为 300*400；
重新导出Cocos Studio工程，并运行Cocos2d-x项目，拖动成功。
3、从scrollView的Widget中提取ScrollView。天真的我又到TestCpp中查找了下UIScrollView的控件名，结果啥都没看到，包括之后的ListView，PageView都是如此。最后我恍然大悟，说到底scrollView这类控件其实就是一个Layout嘛，所以他们都统一用Layout来加载就可以了。
autolayout=
static_cast
<Layout*>(Helper::seekWidgetByName(scrollViewUi,
"scrollView"
));
layout->setPosition(Point(300,300));
|
4、ScrollView控件在cocostudio中的默认方向是竖直的，如果要改变为方向可以将Scroll Director中修改。
5、关于layout的源码我打算在PageView与ListView写完后再一起讲，那应该是一个比较大的模块。
------------------------------------------------------------------------------------------------------------------------
ListView
ListView这货说到底就是tableView，但个人感觉比tableView好用一点，因为，我基本没使用过tableView，如果你让我在cocos2dx用tableView实现某个UI，我肯定要花费点时间要了解下tableView的使用方法，原因就在于我认为只要用scrollView就可以实现tableView的所有功能了。
扯远了，进入ListView的主题中来：
新建一个Cocos Studio工程，命名为ListViewUI，然后拉一个ListView的控件到场景中，之后设置它的属性，设置方法和ScrollView还是有一定的出入，如下：
1、我先设置ListView的显示窗口大小（Size）为300x300；
2、设置name 为 ”ListView“；
3、选中ListView，右键--addObject，往ListView中添加一个ImageView控件。发现新添加的ImageView控件默认的位置在ListView的左上角，并且ImageView控件中的一个红色的”+“号告诉我是不能设置这个控件的基本属性的，也就无法挪动它的位置。我又尝试添加了个CheckBox控件，发现它默认的位置在之前的ImageView控件的右边，同时它也无法修改属性。这个情况让我始料不及，于是我又到属性栏里找原因，最终发现原因出在”child Control Layout“这一类的属性里，它的作用是自动给ListView中的控件排列位置，包括排列方向，控件间的距离等。还是比较好理解的，所以我没有截图啦。嘿嘿。
4、在ListView中不一定要设置容器层的大小，因为当你添加控件到ListView中，如果控件所处的坐标已经超出了ListView的显示窗口范围，那么ListView会自动调整容器层的大小。
5、个人感觉ListView还是蛮方便的，特别是对我这种之前一直将ScrollView当tableView用的人来说，简直就是福音啊！！！
6、在Cocos2d-x加载ListView控件，如下：
Widget*ListViewUi=GUIReader::getInstance()->widgetFromJsonFile(
"ListViewUi_1/ListViewUi_1.json"
->addChild(ListViewUi,serif; font-size:14px"> 7、单独提取出ListView控件
|
