Clock¶

简介¶

Clock是时钟控件。用于显示由用户自定义的时间。

sample¶

sample演示了利用clock显示秒表效果。

控件布局¶

直接在page上拖放一个clock。

JS代码¶

var page = {
    timer : 0,//定时器
    time: 0,//时间，秒数
    /* 此方法在第一次显示窗体前发生 */
    onLoad:function(event){
        var that = this;
        that.timer = setInterval(function(){
            that.setData({Clock1 : {value : that.time , refresh : true}});
            that.time++;
        },1000)
    },

    /* 此方法关闭窗体前发生 */
    onExit:function(event){
        clearInterval(this.timer);//清除定时器
    },
};

效果¶

演示为快进效果。

Clock属性¶

公共属性¶

控件类型

默认clock，且不可改动
透明度

设置背景颜色的透明度，范围： 0 ~ 255。也可以在背景颜色中设定。

注：当背景图片的设定不为空时，将自动设置为 0。

名称¶

控件名称

设定控件的名称。

在JS脚本中，可根据控件名称来指定控件，并对其进行设定或操作。

设计¶

控件锁定

选项：True/False

设定该控件是否锁定。

如果设定值为True,则设计器中无法移动该控件。
是否隐藏控件

选项：True/False

设定该控件是否需要隐藏。

如果设定值为True,设计器与实际效果都不会显示该控件及控件中的内容。

当控件已隐藏时，可通过在工程管理器中点击来选中该控件。

图片¶

背景图片

设定控件的背景图片，不支持缩放，且居中显示。

外观¶

背景颜色

设定背景颜色，设定背景颜色的ARGB值。

可打开颜色选择器，通过颜色选择器修改RGB值。

Alpha值(即透明度)，可以直接修改设定值或修改透明度的值。背景颜色的透明度与属性透明度的值会自动保持一致。
分针图片

设定显示分针的图片。
秒针图片

设定显示秒针的图片。
时针图片

设定显示时针的图片。
时间(秒)

设定当前显示的时间。
中心图片

设定钟盘最中心的显示图片。

位置属性¶

x坐标点

设定控件的左上角相对于父控件的左上角的横坐标。
y坐标点

设定控件的左上角相对于父控件的左上角的纵坐标。
高度

设定控件的高度
宽度

设定控件的宽度

setData¶

控件自有属性

属性名类型描述注解

time Number Clock控件值时间值单位秒
setData 设置更改属性示例

示例代码注解

this.setData({clock1 : 60}) 设置控件的时间值置为 60

this.setData({clock1 : {value : 60}}) 设置控件的时间值置为 60

示例代码	注解
`this.setData({clock1 : 60})`	设置控件的时间值置为 60
`this.setData({clock1 : {value : 60}})`	设置控件的时间值置为 60