anima-picker

picker

---

选择器，模拟下拉选择器、转场选择，同时是虚拟键盘、日历控件等的基类

---

Usage

picker 继承 pop控件，所以支持pop控件的所有属性和方法，使用上更加简单，picker类是抽象类，所以一般需要直接使用的是 listPicker

配置项

继承了pop的所有的属性

element、x,y,width,height,zIndex,visible,effect,direction,duration,easing

自己特有的属性

trigger element

• 触发显示的元素

textField element

• 选择后显示文本的字段，一般是input，也可以是一般的DOM

valueField element

• 选择后存放值的字段，一般是隐藏域

Api

show() 显示

hide() 隐藏

ListPicker 控件

---

列表选择器，模拟下拉选择器、转场选择列表

---

配置项

list Object

• 列表的配置信息
• 渲染后可以通过 picker.get('list')获取到列表对象

usage

<p id="p1">
  <label>选择框</label><input class="text" type="text"> <input type="hidden" class="value">
</p>

seajs.use('anima-picker', function(Picker) {
    var items = [{text:'选项1',value:'a'},{text:'选项2',value:'b'},{text:'选项3',value:'c'},{text:"数字值",value:3}],
      picker = new Picker.ListPicker({
        trigger : '#p1 .text',
        valueField : '#p1 .value',
        width : '100%',
        height : '50%',
        effect : 'slide', //滑出效果
        direction : 'up', //从下往上
        list : {
          className : 'am-list', //自定义列表class
          itemCls : 'am-list-item', //列表项的class
          items : items
        }
      });

    picker.render();
});