判断一个APP是否合格，除了界面美观和功能实用外，很大程度上取决于性能及用户体验。
而在开发一些项目时，如新闻类APP，常常会因为打开的页面数较多，导致手机内存无法及时释放，甚至造成手机崩溃。这时，通过使用AppCan插件容器，可以使页面更加流畅，给用户带来更好的体验效果。
那么，什么是插件容器？
对于Android来说就是个简单的ViewPager，ViewPager的功能就是可以使视图滑动，就像Lanucher左右滑动那样。
与ListView类似，我们也需要一个类似容器的页面PagerAdapter，它提供适配器，该适配器能填充页面内容到ViewPager中。
用到的技术
1.引擎接口，容器相关接口。 2.调用的插件接口及回调，分段导航控件SegmentControl、uexWebView（注：目前仅有这两个插件支持容器）。 3.html技术。整体思路
1.首先初始化容器，先用uexWindow.createPluginViewContainer打开一个容器。 2.容器创建成功的回调，调用支持容器的插件方法，将插件页面填充进去。 3.容器里的插件配合使用，设置插件容器当前要显示的页面。 4.回调接口。1.初始化插件容器
打开一个容器:
注：在创建插件容器之前，需要先定义容器id，方便对容器调用其他容器接口进行相关操作：
官网：http://www.appcan.cn
用到的技术
1.引擎接口，容器相关接口。 2.调用的插件接口及回调，分段导航控件SegmentControl、uexWebView（注：目前仅有这两个插件支持容器）。 3.html技术。整体思路
1.首先初始化容器，先用uexWindow.createPluginViewContainer打开一个容器。 2.容器创建成功的回调，调用支持容器的插件方法，将插件页面填充进去。 3.容器里的插件配合使用，设置插件容器当前要显示的页面。 4.回调接口。1.初始化插件容器
打开一个容器:
function openPluginViewContainer(){
var params = {
"id":pluginViewContainerId,
"x": 0,
"y": titleHeight* 2,
"w":screenWidth,
"h":screenHeight- titleHeight * 2
uexWindow.createPluginViewContainer(JSON.stringify(params));2.在容器里创建插件
uexWindow.cbCreatePluginViewContainer= function(){
//加载当前页并预加载两页数据
openPluginView(showData[0], 0);
openPluginView(showData[1],1);
openPluginView(showData[2],2);
//打开uexSegmentControl导航栏
showSegmentControl();
//open 支持容器的插件，如下例
function openPluginView(id,index){
//获取数据
var webUrl = NetworkCacheData[allData.indexOf(id)];
var params= {
"basicData":{
"index":index,
"id":id,
"containerID":pluginViewContainerId,
"x": 0,
"y": 0,
"w":screenWidth,
"h":screenHeight - titleHeight * 2
"detailedData":{
"webUrl" :webUrl
};//支持绝对路径、appcan协议路径和url地址
uexWebView.open(JSON.stringify(params));
//记录当前页已经打开
showDataOpen[index] = true;//打开uexSegmentControl分段导航插件
function showSegmentControl() {
var width =screenWidth;
var obj={
left:0,
top:titleHeight,
width:width,
height:titleHeight,
dataInfo:{
allData:allData,
showData:showData,
maxShow:25,
isExpand:1,
expandOpenIcon:'',//'res://btn_edit.png',
expandCloseIcon:'',//'res://1Normal.png',
showedLable:'我的频道',
addLable:'点击添加'
uexSegmentControl.open(JSON.stringify(obj));3.容器里的插件使用
//uexSegmentControl 分段选择插件Item点击回调
uexSegmentControl.onItemClick= function(data) {
//alert("uexSegmentControl.onItemClick:" + JSON.stringify(data));
//获取被点击Item的index
var index = data.index;
//判断是否需要加载当前页
if(!showDataOpen[index]){
uexLoadingView.openCircleLoading();
setTimeout("uexLoadingView.close()", 500);
openPluginView(showData[index] ,index );
//设置容器当前展示页(切换操作)
varparams = {
id : pluginViewContainerId,
index : index
uexWindow.setPageInContainer(JSON.stringify(params));4.设置插件容器当前要显示的页面
if(!showDataOpen[index]){
openPluginView(showData[index] ,index );5.容器左右滑动切换监听
uexWindow.onPluginContainerPageChange = function(opId,dataType,data){
//alert("onPluginContainerPageChange : " + data);
//如果当前页没有变化,不做操作
if(currtntIndex != data){
//更新当前页记录
currtntIndex = data;
//更新显示uexSegmentControl分段导航插件的当前项(切换操作)
var params = {
index:currtntIndex,
vardata1 = JSON.stringify(params);
uexSegmentControl.setCurrentItem(data1);
//判断是否需要预加载下一项
if(showData.length > currtntIndex + 1 && !showDataOpen[currtntIndex +1]){
//可以加一个判断是否打开的逻辑
openPluginView(showData[currtntIndex + 1] , currtntIndex + 1 );
//判断是否需要预加载上一项
if(currtntIndex - 1 >= 0 && !showDataOpen[currtntIndex- 1]){
openPluginView(showData[currtntIndex - 1], currtntIndex - 1 );var pluginViewContainerId = '998';官网：http://www.appcan.cn
