slidingPage


slidingPage提供图片轮播的功能,通过rd.require("slidingPage")调用对象

UI展示
image

方法:

  • show : 打开slidingPage窗口
  • remove : 移除slidingPage窗口,释放相应的资源
  • hide : 隐藏显示窗口
  • isShowing : 当前窗口是否显示
  • setFrame : 设置显示窗口的位置
  • setData : 设置数据

对象:

  • Rect : JSON对象,frame参数
  • Data : JSON对象,设置图片数据参数

回调方法:

  • CallBack : 点击图片后回调方法。

show


显示UI

sp.show();
说明:

打开SlidingPag界面

参数:

返回值:

无返回值

示例代码
var sp = rd.require("slidingPage");
sp.show();

remove


移除UI

sp.remove();
说明:

移除slidingPage界面,释放资源

参数:

返回值:

无返回值

示例代码
var sp = rd.require("slidingPage");
sp.remove();

hide


隐藏UI

sp.hide();
说明:

隐藏slidingPage界面,但是不释放资源

参数:

返回值:

无返回值

示例代码
var sp = rd.require("slidingPage");
sp.hide();

isShowing


当前slidingPage是否显示

var showing = sp.isShowing();
说明:

参数:

返回值:
  • showing: ( Boolean ) 当前slidingPage是否显示
示例代码
var sp = rd.require("slidingPage");
var showing = sp.isShowing();

setFrame


设置frame

sp.setFrame(rect);
说明:

参数:
  • rect: ( Rect ) 必选 frame,如果width为0,延伸到屏幕右边,如果height为0,延伸到屏幕下面
返回值:

无返回值

示例代码
var sp = rd.require("slidingPage");
sp.setFrame({x:0, y:0, width:0, height:200});

setData


设置数据

sp.setData(callBack,data);

参数:

  • callBack: ( CallBack ) 必选 点击图片后js回调方法,回传参数为图片序号

  • data: ( Data ) 必选 轮询图片资源数组、圆点指示器的颜色值、圆点指示器的位置

示例:

var sp = rd.require("slidingPage");
sp.setFrame({x:0, y:0, width:0, height:200});
var data = 
{
    "images": [
    "res://icon/bg_introduce.png", 
    "res://icon/bg_introduce.png", 
    "res://icon/bg_introduce.png"
    ], 
    "dotNormalColor": "#ffa060", 
    "dotFocusedColor": "#ff6040",
    'align':'center'
}
sp.setData(function(index){alert('序号:'+index);},data);
sp.show();

Rect


JSON对象 frame参数

Rect 
{
    property Number x,
    property Number y,
    property Number width,
    property Number height
}
说明:

坐标系统,左上角为(0,0),位于第四象限

属性:
  • x: ( Number ) x轴开始坐标
  • y: ( Number ) y轴开始坐标
  • width: ( Number ) 如果width为0,延伸到屏幕右边
  • height: ( Number ) 如果height为0,延伸到屏幕下面

Data


JSON对象 图片参数

Data 
{
    property Array images,
    property String dotNormalColor,
    property String dotFocusedColor,
    property String align
}
说明:

属性:
  • images: ( Array ) 图片资源,支持协议路径
  • dotNormalColor: ( String ) 圆点未选中色值 支持16进制表示法
  • dotFocusedColor: ( String ) 圆点选中色值 支持16进制表示法
  • align: ( String ) 圆点指示器的位置:left、center、right,默认center

CallBack


点击图片后js回调方法,回传参数为图片序号

function callBack(index){

}
说明:

参数:
  • index : (Number) 必选 图片序号.
示例:
function selectedItem(index){
    alert(‘您选择的是第’+'index'+'张图片');
}