Browse Source

文档整理

es6
iapyang 7 years ago
parent
commit
c7ea0980db
  1. 2
      docs/.gitignore
  2. 0
      docs/OVERVIEW.html
  3. 5
      docs/OVERVIEW.md
  4. 20
      docs/README.md
  5. 0
      docs/START.html
  6. 3
      docs/START.md
  7. 176
      docs/SUMMARY.md
  8. 40
      docs/_book/base/bubble.md
  9. 70
      docs/_book/base/button/button.md
  10. 39
      docs/_book/base/button/icon_button.md
  11. 49
      docs/_book/base/button/image_button.md
  12. 58
      docs/_book/base/button/text_button.md
  13. 40
      docs/_book/base/canvas.md
  14. 53
      docs/_book/base/editor/code_editor.md
  15. 89
      docs/_book/base/editor/editor.md
  16. 59
      docs/_book/base/editor/formula_editor.md
  17. 51
      docs/_book/base/editor/multifile_editor.md
  18. 45
      docs/_book/base/editor/textarea_editor.md
  19. 67
      docs/_book/base/label.md
  20. 39
      docs/_book/base/message.md
  21. 68
      docs/_book/base/pager.md
  22. 55
      docs/_book/base/svg.md
  23. 74
      docs/_book/base/table/collection_table.md
  24. 59
      docs/_book/base/table/grid_table.md
  25. 77
      docs/_book/base/table/resizable_table.md
  26. 73
      docs/_book/base/table/table_view.md
  27. 42
      docs/_book/base/toast.md
  28. 53
      docs/_book/case/button/multi_select_item.md
  29. 54
      docs/_book/case/button/single_select_item.md
  30. 55
      docs/_book/case/button/single_select_radio_item.md
  31. 47
      docs/_book/case/calendar.md
  32. 33
      docs/_book/case/clipboard.md
  33. 32
      docs/_book/case/color_chooser.md
  34. 45
      docs/_book/case/color_chooser_popup.md
  35. 86
      docs/_book/case/combo/bubble_combo.md
  36. 68
      docs/_book/case/combo/icon_combo.md
  37. 58
      docs/_book/case/combo/static_combo.md
  38. 58
      docs/_book/case/combo/text_value_combo.md
  39. 65
      docs/_book/case/combo/text_value_downlist_combo.md
  40. 37
      docs/_book/case/complex_canvas.md
  41. 93
      docs/_book/case/editor/shelter_editor.md
  42. 91
      docs/_book/case/editor/sign_editor.md
  43. 92
      docs/_book/case/editor/sign_initial_editor.md
  44. 89
      docs/_book/case/editor/state_editor.md
  45. 69
      docs/_book/case/layer/layer_panel.md
  46. 34
      docs/_book/case/layer/multi_popup_layer.md
  47. 74
      docs/_book/case/layer/pane_list.md
  48. 54
      docs/_book/case/layer/panel.md
  49. 59
      docs/_book/case/list/list.select.md
  50. 43
      docs/_book/case/loader/lazy_loader.md
  51. 54
      docs/_book/case/loader/list_loader.md
  52. 54
      docs/_book/case/loader/sort_list.md
  53. 48
      docs/_book/case/pager/all_count_pager.md
  54. 65
      docs/_book/case/pager/direction_pager.md
  55. 58
      docs/_book/case/segment.md
  56. 69
      docs/_book/case/table/adaptive_table.md
  57. 72
      docs/_book/case/table/layer_tree_table.md
  58. 73
      docs/_book/case/table/tree_table.md
  59. 41
      docs/_book/case/tree/branch_relation.md
  60. 44
      docs/_book/case/tree/branch_tree.md
  61. 33
      docs/_book/case/tree/display_tree.md
  62. 46
      docs/_book/case/tree/handstand_branch_tree.md
  63. 43
      docs/_book/case/tree/level_tree.md
  64. 40
      docs/_book/case/tree/simple_tree.md
  65. 44
      docs/_book/case/trigger/editor_trigger.md
  66. 21
      docs/_book/case/trigger/icon_trigger.md
  67. 28
      docs/_book/case/trigger/text_trigger.md
  68. 68
      docs/_book/core/abstract/button_group.md
  69. 50
      docs/_book/core/abstract/button_tree.md
  70. 71
      docs/_book/core/abstract/collection_view.md
  71. 84
      docs/_book/core/abstract/custom_tree.md
  72. 78
      docs/_book/core/abstract/grid_view.md
  73. 51
      docs/_book/core/abstract/virtual_group.md
  74. 52
      docs/_book/core/abstract/virtual_list.md
  75. 46
      docs/_book/core/basic_button.md
  76. 88
      docs/_book/core/combination/bi.combo.md
  77. 88
      docs/_book/core/combination/bi.expander.md
  78. 64
      docs/_book/core/combination/group_combo.md
  79. 83
      docs/_book/core/combination/loader.md
  80. 78
      docs/_book/core/combination/navigation.md
  81. 102
      docs/_book/core/combination/searcher.md
  82. 83
      docs/_book/core/combination/switcher.md
  83. 84
      docs/_book/core/combination/tab.md
  84. 63
      docs/_book/core/layer/layer_float_box.md
  85. 76
      docs/_book/core/layer/layer_popup.md
  86. 54
      docs/_book/core/layer/layer_searcher.md
  87. 54
      docs/_book/core/layout/border.md
  88. 47
      docs/_book/core/layout/center.md
  89. 47
      docs/_book/core/layout/center_adapt.md
  90. 48
      docs/_book/core/layout/float_center.md
  91. 75
      docs/_book/core/layout/flow.md
  92. 71
      docs/_book/core/layout/grid.md
  93. 51
      docs/_book/core/layout/horizontal.md
  94. 52
      docs/_book/core/layout/horizontal_adapt.md
  95. 49
      docs/_book/core/layout/horizontal_auto.md
  96. 44
      docs/_book/core/layout/horizontal_float.md
  97. 64
      docs/_book/core/layout/htape.md
  98. 55
      docs/_book/core/layout/left_right_vertical_adapt.md
  99. 37
      docs/_book/core/layout/table.md
  100. 38
      docs/_book/core/layout/td.md
  101. Some files were not shown because too many files have changed in this diff Show More

2
docs/.gitignore vendored

@ -10,5 +10,5 @@ dist
archive
archive.zip
*.log
#_book
_book
test

0
docs/_book/OVERVIEW.html → docs/OVERVIEW.html

5
docs/OVERVIEW.md

@ -1,5 +0,0 @@
# 通用规范
1. 控件都会提供setValue, getValue, populate这几个方法来设置值,获取值(展示类控件除外)和刷新控件
2. 控件都会提供setEnable, setVisible, setValid这几个方法来设置使能,是否可见,是否有效状态,并且在fineui2.0之后,会自动给子组件设置同样的状态,不要重写这些方法,一些需要在设置状态时的额外操作可以通过重写_setXXX来实现
3. 使用populate来清空或者重置布局,不要使用empty, 慎用resize
4. 谨慎监听和触发BI.Controller.EVENT_CHANGE事件,一般来说,控件都会有一个BI.ClassName.EVENT_CHANGE事件,一些特殊的事件会在对应控件文档中列出

20
docs/README.md

@ -1,20 +0,0 @@
# FineUIdocs
FineUI文档
## 文档地址
GithubPages: [https://fanruan.github.io/fineui](https://fanruan.github.io/fineui)
CodingPages: [http://fanruan.coding.me/fineui](http://fanruan.coding.me/fineui)
## Demo
CodingPages: [http://fanruan.coding.me/fineui/dist/index.html](http://fanruan.coding.me/fineui/dist/index.html)
## 代码设计文档
KMS: [http://www.finedevelop.com/display/DR/FineUI](http://www.finedevelop.com/display/DR/FineUI)

0
docs/_book/START.html → docs/START.html

3
docs/START.md

@ -1,3 +0,0 @@
## 开发教程
KMS: [http://www.finedevelop.com/pages/viewpage.action?pageId=15330077](http://www.finedevelop.com/pages/viewpage.action?pageId=15330077)

176
docs/SUMMARY.md

@ -1,176 +0,0 @@
# Summary
## 总览
* [概览](README.md)
* [起步](START.md)
## 通用规范
* [通用规范](OVERVIEW.md)
## 核心控件
* 布局
* [vertical](core/layout/vertical.md)
* [horizontal](core/layout/horizontal.md)
* [htape](core/layout/htape.md)
* [vtape](core/layout/vtape.md)
* [center_adapt](core/layout/center_adapt.md)
* [vertical_adapt](core/layout/vertical_adapt.md)
* [left_right_vertical_adapt](core/layout/left_right_vertical_adapt.md)
* [flow](core/layout/flow.md)
* [center](core/layout/center.md)
* [horizontal_adapt](core/layout/horizontal_adapt.md)
* [horizontal_auto](core/layout/horizontal_auto.md)
* [horizontal_float](core/layout/horizontal_float.md)
* [float_center](core/layout/float_center.md)
* [border](core/layout/border.md)
* [grid](core/layout/grid.md)
* [table](core/layout/table.md)
* [td](core/layout/td.md)
* 抽象控件
* [button_group](core/abstract/button_group.md)
* [button_tree](core/abstract/button_tree.md)
* [virtual_group](core/abstract/virtual_group.md)
* [custom_tree](core/abstract/custom_tree.md)
* [grid_view](core/abstract/grid_view.md)
* [collection_view](core/abstract/collection_view.md)
* [virtual_list](core/abstract/virtual_list.md)
* 组合控件
* [combo](core/combination/bi.combo.md)
* [expander](core/combination/bi.expander.md)
* [group_combo](core/combination/group_combo.md)
* [loader](core/combination/loader.md)
* [navigation](core/combination/navigation.md)
* [searcher](core/combination/searcher.md)
* [switcher](core/combination/switcher.md)
* [tab](core/combination/tab.md)
* 弹出层
* [float_box](core/layer/layer_float_box.md)
* [popup](core/layer/layer_popup.md)
* [searcher](core/layer/layer_searcher.md)
* [widget](core/widget.md)
* [single](core/single.md)
* [basic_button](core/basic_button.md)
* [node_button](core/node_button.md)
* [pane](core/pane.md)
## 基础控件
* [label](base/label.md)
* [bubble](base/bubble.md)
* [toast](base/toast.md)
* [message](base/message.md)
* 按钮
* [button](base/button/button.md)
* [text_button](base/button/text_button.md)
* [icon_button](base/button/icon_button.md)
* [image_button](base/button/image_button.md)
* 编辑框
* [editor](base/editor/editor.md)
* [code_editor](base/editor/code_editor.md)
* [multifile_editor](base/editor/multifile_editor.md)
* [textarea_editor](base/editor/textarea_editor.md)
* [formula_editor](base/editor/formula_editor.md)
* 表格
* [table_view](base/table/table_view.md)
* [grid_table](base/table/grid_table.md)
* [collection_table](base/table/collection_table.md)
* [resizable_table](base/table/resizable_table.md)
* [pager](base/pager.md)
* [svg](base/svg.md)
* [canvas](base/canvas.md)
## 实例控件
* 按钮
* [multi_select_item](case/button/multi_select_item.md)
* [single_select_item](case/button/single_select_item.md)
* [single_select_radio_item](case/button/single_select_radio_item.md)
* 编辑框
* [shelter_editor](case/editor/shelter_editor.md)
* [sign_editor](case/editor/sign_editor.md)
* [sign_initial_editor](case/editor/sign_initial_editor.md)
* [state_editor](case/editor/state_editor.md)
* 弹出层
* [multi_popup_layer](case/layer/multi_popup_layer.md)
* [layer_panel](case/layer/layer_panel.md)
* [pane_list](case/layer/pane_list.md)
* [panel](case/layer/panel.md)
* 列表
* [select_list](case/list/list.select.md)
* [lazy_loader](case/loader/lazy_loader.md)
* [list_loader](case/loader/list_loader.md)
* [sort_list](case/loader/sort_list.md)
* 触发器
* [editor_trigger](case/trigger/editor_trigger.md)
* [icon_trigger](case/trigger/icon_trigger.md)
* [text_trigger](case/trigger/text_trigger.md)
* 下拉框
* [bubble_combo](case/combo/bubble_combo.md)
* [icon_combo](case/combo/icon_combo.md)
* [static_combo](case/combo/static_combo.md)
* [text_value_combo](case/combo/text_value_combo.md)
* [text_value_downlist_combo](case/combo/text_value_downlist_combo.md)
* 树
* [branch_tree](case/tree/branch_tree.md)
* [handstand_branch_tree](case/tree/handstand_branch_tree.md)
* [display_tree](case/tree/display_tree.md)
* [simple_tree](case/tree/simple_tree.md)
* [level_tree](case/tree/level_tree.md)
* [branch_relation](case/tree/branch_relation.md)
* 表格
* [adaptive_table](case/table/adaptive_table.md)
* [tree_table](case/table/tree_table.md)
* [layer_tree_table](case/table/layer_tree_table.md)
* Pager
* [all_count_pager](case/pager/all_count_pager.md)
* [direction_pager](case/pager/direction_pager.md)
* [calendar](case/calendar.md)
* [clipboard](case/clipboard.md)
* [complex_canvas](case/complex_canvas.md)
* [color_chooser](case/color_chooser.md)
* [color_chooser_popup](case/color_chooser_popup.md)
* [segment](case/segment.md)
## 详细控件
* 各种小组件
* [通用按钮](detailed/bi.button/general.md)
* [提示性信息](detailed/bi.button/tooltip.md)
* [各种items](detailed/bi.button/items.md)
* [各种节点nodes](detailed/bi.button/node.md)
* [各种segment](detailed/bi.button/segment.md)
* 树形结构
* [multi_tree_combo](detailed/tree/bi.multi_tree_combo.md)
* [switch_tree](detailed/tree/bi.switch_tree.md)
* 表格
* [preview_table](detailed/table/bi.preview_table.md)
* [responsive_table](detailed/table/bi.responsive_table.md)
* [excel_table](detailed/table/bi.excel_table.md)
* [page_table](detailed/table/bi.page_table.md)
* 文本框控件
* [bi.text_editor](detailed/text_input/bi.text_editor.md)
* [bi.search_editor](detailed/text_input/bi.search_editor.md)
* [bi.clear_editor](detailed/text_input/bi.clear_editor.md)
* [finetuning_number_editor](detailed/text_input/finetuning_number_editor.md)
* [year_combo](detailed/year_combo.md)
* [month_combo](detailed/month_combo.md)
* [quarter_combo](detailed/quarter_combo.md)
* [down_list_combo](detailed/down_list_combo.md)
* [numeric_interval](detailed/numeric_interval.md)
* [multi_select_combo](detailed/multi_select_combo.md)
* 简单日期控件
* [date_combo](detailed/date/date_combo.md)
* [date_pane_widget](detailed/date/date_pane_widget.md)
* [year_month_combo](detailed/date/year_month_combo.md)
* [year_quarter_combo](detailed/date/year_quarter_combo.md)
* [custom_date_time](detailed/date/custom_date_time.md)
* 简单下拉树
* [single_tree_combo](detailed/combo/single_tree_combo.md)
* [multilayer_single_tree_combo](detailed/combo/multilayer_single_tree_combo.md)
* [select_tree_combo](detailed/combo/select_tree_combo.md)
* [multilayer_select_tree_combo](detailed/combo/multilayer_select_tree_combo.md)
* 路径选择
* [path_chooser](detailed/path/path_chooser.md)
* [direction_path_chooser](detailed/path/direction_path_chooser.md)
* [relation_view](detailed/relation_view.md)
* [dialog](detailed/dialog.md)
* [file_manager](detailed/file_manager.md)
* [slider](detailed/slider.md)

40
docs/_book/base/bubble.md

@ -1,40 +0,0 @@
# bi.bubble
#### 气泡提示
{% method %}
[source](https://jsfiddle.net/fineui/4u705v2v/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.bubble',
element: "#wrapper",
height: 30,
text: "测试"
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :---- |:----
| direction | 气泡显示位置 | string | — | "top" |
| height | 气泡高度 | number | — | 35 |
| text | 气泡显示内容 | string | — | " " |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setText | 设置文本值 | 需要设置的文本值text|
---

70
docs/_book/base/button/button.md

@ -1,70 +0,0 @@
# bi.button
## 文字类型的按钮,基类[BI.BasicButton](/core/basicButton.md)
{% method %}
[source](https://jsfiddle.net/fineui/txqwwzLm/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.button',
element: "#wrapper",
text: '一般按钮',
level: 'common',
height: 30
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值,如果clear属性为true,该属性值置0 | number | — | 10 |
| vgap | 效果相当于文本框上下padding值 | number | — | 0 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| tgap |效果相当于文本框top-padding值 | number | — | 0 |
| bgap | 效果相当于文本框bottom-padding值 | number | — | 0 |
| items | 子控件数组 | array | — | [ ] |
| width | 宽度 | number | — | — |
| height | 高度 | number | — | — |
##### 高级属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| level |按钮类型 | string| common,success,warning,ignore | common |
| minWidth | 最小宽度,如果block/clear中某一项为true,此项值为0,否则为90 | number | — | 90 |
| shadow | 是否显示阴影 | boolean| true,false | props.clear !== true |
| isShadowShowingOnSelected|选中状态下是否显示阴影 | boolean| true,false | true |
| readonly | 是否只读 | boolean | true,false | true |
| iconClass | 图标类型 | string| — | " "|
| block| 是否块状显示,即不显示边框,没有最小宽度的限制 | boolean| true,false | false |
| clear| 是否去掉边框和背景 |boolean| true,false | false |
| textAlign | 文字布局 | string | left,center,right | cneter |
| whiteSpace | 元素内的空白处理方式 | string | normal,nowrap | nowrap|
| forceCenter | 是否无论如何都要居中, 不考虑超出边界的情况, 在未知宽度和高度时有效 | boolean | true,false | false |
| textWidth| 按钮文本宽度 | number| — | null |
| textHeight | 按钮文本高度 | number| — | null |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| doRedMark | 文本标红 | — |
| unRedMark | 取消文本标红| —|
| doHighLight | 文本高亮 | —|
| unHighLight | 取消文本高亮 | —|
| setText| 设置文本值 | 需要设置的文本值text|
| doClick | 点击事件 | —|
| destroy | 销毁事件 |— |
| setValue | 设置文本值 | 需要设置的文本值text |
---

39
docs/_book/base/button/icon_button.md

@ -1,39 +0,0 @@
# bi.icon_button
## 图标button,基类[BI.BasicButton](/core/basicButton.md)
{% method %}
[source](https://jsfiddle.net/fineui/g52u14ay/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.icon_button',
cls: "close-ha-font",
width: 20,
height: 20
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| iconWidth | 图标宽度 | number| — | null |
| iconHeight | 图标高度 | number| — | null |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| doClick | 点击事件 | —|
---

49
docs/_book/base/button/image_button.md

@ -1,49 +0,0 @@
# bi.image_button
## 图片的button,基类[BI.BasicButton](/core/basicButton.md)
{% method %}
[source](https://jsfiddle.net/fineui/yc0g9gLw/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.image_button',
src: "http://www.easyicon.net/api/resizeApi.php?id=1206741&size=128",
width: 100,
height: 100
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| src |图片路径 |string | —|" " |
| iconWidth | 图标宽度 | number/string| — | "100%" |
| iconHeight | 图标高度 | number/string | — | "100%"|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| doClick | 点击事件 | —|
| setWidth | 设置按钮宽度| 宽度width |
| setHeight | 设置按钮高度 | 高度height|
| setImageWidth | 设置图片宽度| 宽度width |
| setImageHeight| 设置图片高度| 高度height|
| getImageWidth | 获取图片宽度| —|
| getImageHeight | 获取图片高度| —|
| setSrc| 设置图片路径| src |
| getSrc |获取图片路径| — |
---

58
docs/_book/base/button/text_button.md

@ -1,58 +0,0 @@
# bi.text_button
## 可以点击的一行文字,基类[BI.BasicButton](/core/basicButton.md)
{% method %}
[source](https://jsfiddle.net/fineui/5p99L39q/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.text_button',
text: '文字按钮',
height: 30
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值,如果clear属性为true,该属性值置0 | number | — | 10 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| text|按钮文本内容 | string| — | — |
| textWidth| 按钮文本宽度 | number| — | null |
| textHeight | 按钮文本高度 | number| — | null |
##### 高级属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| py | 拼音 | string| | " " |
| textAlign | 文字布局 | string | left,center,right | cneter |
| whiteSpace | 元素内的空白处理方式 | string | normal,nowrap | nowrap|
| forceCenter | 是否无论如何都要居中, 不考虑超出边界的情况, 在未知宽度和高度时有效 | boolean | true,false | false |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| doRedMark | 文本标红 | — |
| unRedMark | 取消文本标红| —|
| doHighLight | 文本高亮 | —|
| unHighLight | 取消文本高亮 | —|
| setText| 设置文本值 | 需要设置的文本值text|
| doClick | 点击事件 | —|
| setValue | 设置文本值 | 需要设置的文本值text |
| setStyle | 设置文本样式 |需要设置的文本标签样式,例{"color":"#000"} |
---

40
docs/_book/base/canvas.md

@ -1,40 +0,0 @@
# bi.canvas
## canvas绘图,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/gcgd1va0/)
{% common %}
```javascript
var canvas = BI.createWidget({
type: "bi.canvas",
element: "#wrapper",
width: 500,
height: 600
});
canvas.circle(150, 50, 20, "green");
canvas.stroke();
```
{% endmethod %}
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| line | 绘制线段| (x0, y0, x1, y1) |
| rect | 绘制矩形 | (x,y,w,h,color)分别表示左上角的横坐标、纵坐标,矩形宽、高、以及绘制的颜色|
| circle | 绘制圆形 | (x, y, radius, color)分别表示原点的横坐标,纵坐标,半径以及颜色 |
| hollow | 填充中空的路径 | — |
| solid | 填充实心的路径 | — |
| gradient | 绘制渐变色 | (x0, y0, x1, y1, start, end) |
| reset | 重置画布 | —|
| stroke | 绘制 | callback |
---

53
docs/_book/base/editor/code_editor.md

@ -1,53 +0,0 @@
# bi.code_editor
## 代码文本框,基类[BI.Single](/core/single.md)
{% method %}
[source](https://jsfiddle.net/fineui/fx86hLgm/)
{% common %}
```javascript
BI.createWidget({
type: "bi.code_editor",
cls: "mvc-border",
width: 600,
height: 400
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| watermark | 文本框placeholder | string | — | " " |
| readOnly | 是否只读 | boolean | true,false | false|
| lineHeight | 行高 | number|— | 2|
| value | 文本框值| string| —| " "|
| paramFormatter| 参数显示值构造函数 | function| — | value |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| insertParam | 插入参数 | param |
| insertString | 插入字符串 | str|
| getValue | 获取文本框值|—|
| setValue | 设置文本框值|value|
| focus | 文本框获取焦点| — |
| blur | 文本框失焦|—|
| setStyle | 设置文本样式 |需要设置的文本标签样式style,例{"color":"#000"} |
| getStyle | 获取文本样式 |— |
| refresh | 刷新文本框 | —|
---

89
docs/_book/base/editor/editor.md

@ -1,89 +0,0 @@
# bi.editor
## 文本框,基类[BI.Single](/core/single.md)
{% method %}
[source](https://jsfiddle.net/fineui/4eLytgve/)
{% common %}
```javascript
BI.createWidget({
type: "bi.editor",
element: "#wrapper",
errorText: "字段不可重名!",
width: 200,
height: 30
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值 | number | — | 4 |
| vgap | 效果相当于文本框上下padding值 | number | — | 2 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| tgap |效果相当于文本框top-padding值 | number | — | 0 |
| bgap | 效果相当于文本框bottom-padding值 | number | — | 0 |
| validationChecker | 输入较验函数 |function| — | — |
| quitChecker | 是否允许退出编辑函数 | function | — | — |
| allowBlank | 是否允许空值 | boolean | true,false | false |
| watermark | 文本框placeholder | string | — | " " |
| errorText | 错误提示 | string/function | —| " "|
| tipType| 提示类型 | string |success,warning | "warning"|
| inputType| 输入框类型| string| 参考input输入框类型 | "text"|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setErrorText | 设置错误文本 | text |
| getErrorText | 获取错误文本 | —|
| setErrorVisible | 设置错误文本可见|b |
| disableError | 设置error不可用|— |
| enableError| 设置error可用| —|
| disableWaterMark | 设置文本框placeholder不可用| —|
| enableWaterMark | 恢复文本框placeholder可用| — |
| focus | 文本框获取焦点| — |
| blur | 文本框失焦|—|
| selectAll | 选中文本框文本| —|
| onKeyDown |按键事件|key|
| setValue | 设置文本框值|value|
| getLastValidValue | 获取文本框最后一次输入的有效值| —|
| resetLastValidValue| 重置文本框最后一次输入的有效值|value|
| getValue | 获取文本框值|—|
| isEditing | 文本框是否处于编辑状态|—|
| isValid | 文本框值是否有效|—|
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.Editor.EVENT_CHANGE | editor的value发生改变触发 |
|BI.Editor.EVENT_FOCUS | focus事件 |
|BI.Editor.EVENT_BLUR | blur事件 |
|BI.Editor.EVENT_CLICK | 点击编辑框触发(不在编辑状态时) |
|BI.Editor.EVENT_KEY_DOWN | keyDown时触发 |
|BI.Editor.EVENT_SPACE | 按下空格触发 |
|BI.Editor.EVENT_BACKSPACE | 按下Backspace触发 |
|BI.Editor.EVENT_START | 开始输入触发 |
|BI.Editor.EVENT_PAUSE | 暂停输入触发(输入空白字符) |
|BI.Editor.EVENT_STOP | 停止输入触发 |
|BI.Editor.EVENT_CONFIRM | 确定输入触发(blur时且输入值有效) |
|BI.Editor.EVENT_VALID | 输入值有效的状态事件 |
|BI.Editor.EVENT_ERROR | 输入值无效的状态事件 |
|BI.Editor.EVENT_ENTER | 回车事件 |
|BI.Editor.EVENT_RESTRICT | 回车但是值不合法 |
|BI.Editor.EVENT_REMOVE | 输入为空时按下backspace |
|BI.Editor.EVENT_EMPTY | 输入框为空时触发 |
---

59
docs/_book/base/editor/formula_editor.md

@ -1,59 +0,0 @@
# bi.formula_editor
## 公式编辑控件,基类[BI.Single](/core/single.md)
{% method %}
[source](https://jsfiddle.net/fineui/qnquz4o0/)
{% common %}
```javascript
BI.createWidget({
type: "bi.formula_editor",
cls: "bi-border",
watermark:'请输入公式',
value: 'SUM(C5, 16, 26)',
width: "100%",
height: "100%"
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| value | 文本域的值 | string | — | " "|
| watermark | 文本框placeholder| string | —| " " |
| fieldTextValueMap | 字段集合 | onject | —| {}|
| showHint | 是否显示提示信息 | boolean | true,false | true |
| lineHeight | 行高 | number | —| 2|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| disableWaterMark | 设置文本框placeholder不可用 | — |
| focus | 文本框获取焦点| — |
| insertField | 添加字段 | field |
| insertFunction | 插入函数 | fn |
| insertOperator | 插入操作符| op|
| setFunction | 设置函数 | v|
| insertString | 插入字符串 | str|
| getFormulaString | 获取公式框内容 |— |
| getUsedFields | 获取可用字段 | — |
| getCheckString | 获取校验内容 | — |
| getValue | 获取文本框值|—|
| setValue | 设置文本框值|value|
| setFieldTextValueMap | 设置字段集合 | fieldTextValueMap |
| refresh | 刷新文本框 | —|
---

51
docs/_book/base/editor/multifile_editor.md

@ -1,51 +0,0 @@
# bi.multifile_editor
## 多文件,基类[BI.Single](/core/single.md)
{% method %}
[source](https://jsfiddle.net/fineui/25r3r5fq/)
{% common %}
```javascript
BI.createWidget({
type: "bi.multifile_editor",
width: 400,
height: 300
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| multiple | 是否支持多选 | boolean | true,false| false |
| maxSize | 最大可选数量 | number |— | -1 |
| accept | 允许上传的文件类型 | string | —| " "|
| url | 文件路径 | string | —| " "|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| select | 选择文件 | —|
| getValue | 获取文件名称 | —|
| upload | 文件上传| —|
| reset | 重置| —|
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.MultifileEditor.EVENT_UPLOADSTART | 开始上传时触发 |
|BI.MultifileEditor.EVENT_PROGRESS | 上传过程中触发 |
|BI.MultifileEditor.EVENT_UPLOADED | 上传结束后触发 |
---

45
docs/_book/base/editor/textarea_editor.md

@ -1,45 +0,0 @@
# bi.textarea_editor
## 文本域,基类[BI.Single](/core/single.md)
{% method %}
[source](https://jsfiddle.net/fineui/90721e0a/)
{% common %}
```javascript
BI.createWidget({
type: "bi.textarea_editor",
width: 400,
height: 300
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| value | 文本域的值 | string | — | " "|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| getValue | 获取文本域值|—|
| setValue | 设置文本域值|value|
| setStyle | 设置文本域样式 |需要设置的文本域样式style,例{"color":"#000"} |
| getStyle | 获取文本域样式 |— |
| focus | 文本域获取焦点| — |
| blur | 文本域失焦|—|
---

67
docs/_book/base/label.md

@ -1,67 +0,0 @@
# bi.label
#### 文本标签
{% method %}
[source](https://jsfiddle.net/fineui/47f5ps1j/)
{% common %}
```javascript
BI.createWidget({
type: "bi.label",
textWidth: 100,
textHeight: 30,
text: "基本标签"
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | —| 0 |
| vgap | 效果相当于容器上下padding值 | number | —| 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | —| 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| textWidth | 文本标签宽度 | number| — | null |
| textHeight | 文本标签宽度 | number| — | null |
| text | 文本内容 | string | — | " " |
##### 高级属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| textAlign | 文本对齐方式 | string | left,center,right | center |
| whiteSpace | 元素内空白处理方式 | string| normal,nowrap | nowrap|
| forceCenter | 是否无论如何都要居中, 不考虑超出边界的情况, 在未知宽度和高度时有效 | boolean | true,false | true |
| py | 拼音 | string | — | 空 |
| keyword | 设置标红的关键词 | string | —| 空 |
| disabled | 灰化 | boolean| true,false | 无 |
| title | 提示title | string | — | 空 |
| warningTitle | 错误提示title | string | — | 空 |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| doRedMark | 文本标红 | — |
| unRedMark | 取消文本标红| —|
| doHighLight | 文本高亮 | —|
| unHighLight | 取消文本高亮 | —|
| setText| 设置文本值 | 需要设置的文本值text|
| getText| 获取文本值 | —|
| setStyle | 设置文本样式 |需要设置的文本标签样式,例{"color":"#000"} |
| setValue | 设置文本值 | 需要设置的文本值text |
| populate| 清空label | —|
---

39
docs/_book/base/message.md

@ -1,39 +0,0 @@
# bi.Msg
#### 消息提示
{% method %}
[source](https://jsfiddle.net/fineui/feu8kf4u/)
{% common %}
```javascript
BI.createWidget({
type: "bi.button",
element: "#wrapper",
text : '点击我弹出一个消息框',
height : 30,
handler : function() {
BI.Msg.confirm('测试消息框',"我是测试消息框的内容");
}
});
```
{% endmethod %}
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| alert | 警告消息框 | title, message, callback|
| confirm | 确认消息框 | title, message, callback |
| prompt | 提示消息框 | title, message, value, callback, min_width |
| toast | toast提示 | message, level, context|
---

68
docs/_book/base/pager.md

@ -1,68 +0,0 @@
# bi.pager
## 分页控件,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/rhhte9b3/)
{% common %}
```javascript
BI.createWidget({
type: "bi.pager",
height: 50,
pages: 18,
groups: 5,
curr: 6,
first: "首页",
last: "尾页"
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| behaviors | 自定义列表中item项的行为,如高亮,标红等 | object| — | {}|
| layouts | 布局| array |— | {type:"bi.horizontal",hgap:10,vgap:0} |
| dynamicShow | 是否动态显示上一页、下一页、首页、尾页, 若为false,则指对其设置使能状态 | boolean| true,false | true|
| dynamicShowFirstLast | 是否动态显示首页、尾页,dynamicShow为false时生效| boolean| true,false | false |
| dynamicShowPrevNext | 是否动态显示上一页、下一页,dynamicShow为false时生效 | boolean| true,false | false|
| pages | 是否显示总页数 | boolean| true,false|false|
| curr | 初始化当前页 | function | —| function(){return 1;}|
| groups | 连续显示分页数 | number | — | 0 |
| jump | 页数跳转| function |— | —|
| first | 是否显示首页 | boolean | true,false| false|
| last | 是否显示尾页 | boolean | true,false| false|
| prev | 上一页 | string,object —| — |"上一页" |
| next | 下一页 | sting,object| —| "下一页" |
| firstPage | 第一页 | number|— | 1 |
| lastPage | 最后一页,在万不得已时才会调用这个函数获取最后一页的页码, 主要作用于setValue方法 | function | —| function(){ return 1;}|
| hasPrev | 判断是否有上一页,pages不可用时有效 | function | —| — |
| hasNext | 判断是否有下一页,pages不可用时有效 | function |— | — |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| getCurrentPage | 获取当前页码 | —|
| setAllPages | 设置总页数 | pages |
| hasPrev | 判断是否有上一页 | v |
| hasNext | 判断是否有下一页 | v |
| setValue | 设置当前页码 | v |
| getValue | 获取当前页码 | —|
| attr | 设置属性 | key,value |
| populate | 刷新或者清空列表| —|
## 事件
| 名称 | 说明 |
| :------ |:------------- |
| BI.Pager.EVENT_AFTER_POPULATE | pager刷新完成事件 |
---

55
docs/_book/base/svg.md

@ -1,55 +0,0 @@
# bi.svg
## svg绘图,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/1xn8snp3/)
{% common %}
```javascript
var svg = BI.createWidget({
type: "bi.svg",
width: 500,
height: 600
});
svg.path("M10,10L50,50M50,10L10,50")
.attr({stroke: "red"});
```
{% endmethod %}
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| add | 添加对象到json数组 | json |
| path | 绘制路径 | pathString |
| image | 绘制图片 | (src,x,y,w,h)分别表示图片路径,绘制的原点横、纵坐标,宽、高 |
| rect | 绘制矩形 | (x,y,w,h,r)分别表示左上角的横坐标、纵坐标,矩形宽、高、以及矩形的圆角border-radius大小|
| circle | 绘制圆形 | (x,y,r)分别表示原点的横坐标,纵坐标,以及半径 |
| ellipse | 绘制椭圆 |(x,y,rx,ry)分别表示原点的横、纵坐标,以及水平半径和垂直半径|
| text | 绘制文本 | (x,y,text)分别表示绘制的原点横、纵坐标以及要绘制的文本内容|
| print | 根据制定参数打印出路径 | (x, y, string, font, size, origin, letter_spacing, line_spacing) |
| setStart | 开始绘制 | — |
| setFinish | 结束绘制 | — |
| setSize | 设置画布尺寸 | (width,height)分别表示画布宽高|
| setViewBox | 设置画布可视区域 | (x,y,width,height,fit)分别表示可视区域原点坐标以及可视区域宽高,以及是否根据可视区域进行调整 |
| getById | 根据id返回元素 | id |
| getElementByPoint | 获根据给定的点坐标返回元素 | (x,y)|
| getElementsByPoint | 获根据给定的点坐标返回元素 | (x,y) |
| getFont | 通过给定的参数在已注册的字体中找到字体对象 | (family, weight, style, stretch) |
| set | 绘制形状的集合 | — |
| remove | 设置总页数 | pages |
| clear | 判断是否有上一页 | v |
---

74
docs/_book/base/table/collection_table.md

@ -1,74 +0,0 @@
# bi.collection_table
### 基本的表格 继承BI.Widget
{% method %}
[source](https://jsfiddle.net/fineui/x2zxfzhp/)
{% common %}
```javascript
BI.createWidget({
type: "bi.collection_table",
element: "body",
columnSize: [200,200],
items: [
[{
type: "bi.label",
cls: "layout-bg1",
text: "第一行第一列"
}, {
type: "bi.label",
cls: "layout-bg2",
text: "第一行第二列"
}],
[{
type: "bi.label",
cls: "layout-bg3",
text: "第二行第一列"
}, {
type: "bi.label",
cls: "layout-bg4",
text: "第二行第二列"
}]
]
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ---------------- | ------------- | -------------------- | ----------------- |
| isNeedFreeze | 是否冻结列 | boolean | false |
| freezeCols | 冻结的列 | array | [] |
| isNeedMerge | 是否需要合并单元格 | boolean | false |
| mergeCols | 合并的单元格列号 | array | [] |
| mergeRule | 合并规则, 默认相等时合并 | function(row1, row2) | 默认row1 = row2 时合并 |
| columnSize | 单元格宽度集合 | array | [] |
| headerRowSize | 表头高度 | number | 25 |
| rowSize | 普通单元格高度 | number | 25 |
| regionColumnSize | 列项间的 | array | [] |
| items | 子组件 | array | [] |
## 方法
| 方法名 | 说明 | 参数 |
| ------------------------- | ----------- | ---------- |
| setWidth | 设置宽度 | width |
| setHeight | 设置高度 | height |
| setColumnSize | 设置列宽 | columnSize |
| getColumnSize | 得到列宽 | — |
| setRegionColumnSize | 设置列项之间的间隙 | columnSize |
| getRegionColumnSize | 获得列项之间的间隙 | — |
| getScrollRegionColumnSize | 获取横向滚动条宽度 | — |
| setVerticalScroll | 设置纵向滚动距离 | scrollTop |
| setLeftHorizontalScroll | 设置左到右横向滚动距离 | scrollLeft |
| setRightHorizontalScroll | 设置右往左横向滚动距离 | scrollLeft |
| getVerticalScroll | 获取纵向滚动距离 | — |
| getLeftHorizontalScroll | 获取左到右横向滚动距离 | — |
| getRightHorizontalScroll | 获取右往左横向滚动距离 | — |
| getColumns | 获取列项 | — |
| populate | 增加行 | rows |
| restore | 存储数据 | — |
------

59
docs/_book/base/table/grid_table.md

@ -1,59 +0,0 @@
# bi.grid_table
### 列表展示的table,继承BI.Widget
{% method %}
[source](https://jsfiddle.net/fineui/a936vcvj/)
{% common %}
```javascript
BI.createWidget({
type: "bi.grid_table",
element: 'body',
width: 600,
height: 500,
isResizeAdapt: true,
isNeedResize: true,
isNeedFreeze: true,
freezeCols: [0, 1],
columnSize: [50,50,200,250,400],
items: items,
header: header
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ---------------- | ------- | ------- | ----- |
| isNeedFreeze | 是否需要冻结 | boolean | false |
| freezeCols | 冻结列 | array | [] |
| columnSize | 单元格宽度集合 | array | [] |
| headerRowSize | 表头高度 | number | 25 |
| rowSize | 普通单元格高度 | number | 25 |
| regionColumnSize | 列项间的 | array | [] |
| header | 表头 | array | [] |
| items | 子组件 | array | [] |
## 方法
| 方法名 | 说明 | 参数 |
| ------------------------ | ----------- | ---------- |
| setWidth | 设置宽度 | width |
| setHeight | 设置高度 | height |
| getRegionSize | 获取间隙大小 | — |
| setColumnSize | 设置列宽 | columnSize |
| getColumnSize | 得到列宽 | — |
| setRegionColumnSize | 设置列项之间的间隙 | columnSize |
| getRegionColumnSize | 获得列项之间的间隙 | — |
| setVerticalScroll | 设置纵向滚动距离 | scrollTop |
| setLeftHorizontalScroll | 设置左到右横向滚动距离 | scrollLeft |
| setRightHorizontalScroll | 设置右往左横向滚动距离 | scrollLeft |
| getVerticalScroll | 获取纵向滚动距离 | — |
| getLeftHorizontalScroll | 获取左到右横向滚动距离 | — |
| getRightHorizontalScroll | 获取右往左横向滚动距离 | — |
| populate | 刷新内容 | rows |
| restore | 储存 | — |
------

77
docs/_book/base/table/resizable_table.md

@ -1,77 +0,0 @@
# bi.resizable_table
### 可调整列宽的grid表格,继承BI.Widget
{% method %}
[source](https://jsfiddle.net/fineui/0e7p2ezc/)
{% common %}
```javascript
BI.createWidget({
type: "bi.resizable_table",
element: "body",
columnSize: [200,200],
items: [
[{
type: "bi.label",
cls: "layout-bg1",
text: "第一行第一列"
}, {
type: "bi.label",
cls: "layout-bg2",
text: "第一行第二列"
}],
[{
type: "bi.label",
cls: "layout-bg3",
text: "第二行第一列"
}, {
type: "bi.label",
cls: "layout-bg4",
text: "第二行第二列"
}]
]
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ---------------- | --------- | ------- | ----- |
| isNeedFreeze | 是否需要冻结列 | boolean | false |
| freezeCols | 冻结的列 | array | [] |
| isNeedResize | 是否需要调整大小 | boolean | false |
| isResizeAdapt | 是否调整时自适应 | boolean | true |
| isNeedMerge | 是否需要合并单元格 | boolean | false |
| mergeCols | 合并的单元格列号 | array | [] |
| columnSize | 单元格宽度集合 | array | [] |
| minColumnSize | 最小列宽 | array | [] |
| maxColumnSize | 最大列宽 | array | [] |
| headerRowSize | 表头高度 | number | 25 |
| rowSize | 普通单元格高度 | number | 25 |
| header | 表头 | array | [] |
| regionColumnSize | 列项间的 | array | [] |
| items | 子组件 | array | [] |
## 方法
| 方法名 | 说明 | 参数 |
| ------------------------ | ----------- | ------------- |
| setWidth | 设置宽度 | — |
| setHeight | 设置高度 | — |
| setColumnSize | 设置列宽 | columnSize |
| getColumnSize | 得到列宽 | — |
| setRegionColumnSize | 设置列项之间的间隙 | columnSize |
| getRegionColumnSize | 获得列项之间的间隙 | — |
| setVerticalScroll | 设置纵向滚动距离 | scrollTop |
| setLeftHorizontalScroll | 设置左到右横向滚动距离 | scrollLeft |
| setRightHorizontalScroll | 设置右往左横向滚动距离 | scrollLeft |
| getVerticalScroll | 获取纵向滚动距离 | — |
| getLeftHorizontalScroll | 获取左到右横向滚动距离 | — |
| getRightHorizontalScroll | 获取右往左横向滚动距离 | — |
| attr | 设置属性 | key:键,value:值 |
| populate | 刷新内容 | rows |
| restore | 保存表 | — |
------

73
docs/_book/base/table/table_view.md

@ -1,73 +0,0 @@
# bi.table_view
### 能处理静态宽度以及动态宽度的表
{% method %}
[source](https://jsfiddle.net/fineui/mbazb80a/)
{% common %}
```javascript
BI.createWidget({
type: "bi.table_view",
element: 'body',
isNeedMerge: true,
isNeedFreeze: true,
freezeCols: [0, 1],
mergeCols: [0, 1],
columnSize: [100, 200, 300, 400, 500],
items: [],
header: []
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ---------------- | ------------- | -------------------- | ----------------- |
| isNeedMerge | 是否需要合并单元格 | boolean | false |
| mergeCols | 合并的单元格列号 | array | [] |
| mergeRule | 合并规则, 默认相等时合并 | function(row1, row2) | 默认row1 = row2 时合并 |
| columnSize | 单元格宽度集合 | array | [] |
| headerRowSize | 表头高度 | number | 25 |
| footerRowSize | 表尾高度 | number | 25 |
| rowSize | 普通单元格高度 | number | 25 |
| regionColumnSize | 列项间的 | array | false |
| header | 表头 | array | [] |
| footer | 表尾 | array | false |
| items | 子组件 | array | [] |
## 方法
| 方法名 | 说明 | 参数 |
| ---------------------------- | ---------------- | ---------- |
| resize | 调整表格 | — |
| setColumnSize | 设置列宽 | columnSize |
| getColumnSize | 得到列宽 | — |
| getCalculateColumnSize | 获得计算后的列宽 | — |
| setHeaderColumnSize | 设置表头的列宽 | columnSize |
| setRegionColumnSize | 设置列项之间的间隙 | columnSize |
| getRegionColumnSize | 获得列项之间的间隙 | — |
| getCalculateRegionColumnSize | 获取计算后的列项之间的间隙 | — |
| getCalculateRegionRowSize | 获取计算后的列项上下之间的间隙 | — |
| getClientRegionColumnSize | 获取浏览器中显示的列项之间的间隙 | — |
| getScrollRegionColumnSize | 获取横向滚动条宽度 | — |
| getScrollRegionRowSize | 获取纵向滚动条宽度 | — |
| hasVerticalScroll | 是否含有数值滚动条 | — |
| setVerticalScroll | 设置纵向滚动距离 | scrollTop |
| setLeftHorizontalScroll | 设置左到右横向滚动距离 | scrollLeft |
| setRightHorizontalScroll | 设置右往左横向滚动距离 | scrollLeft |
| getVerticalScroll | 获取纵向滚动距离 | — |
| getLeftHorizontalScroll | 获取左到右横向滚动距离 | — |
| getRightHorizontalScroll | 获取右往左横向滚动距离 | — |
| getColumns | 获取列项 | — |
| populate | 刷新内容 | rows |
## 事件
| 事件 | 说明 |
| :------------------------------ | :------------------ |
| BI.Table.EVENT_TABLE_AFTER_INIT | table初始化完成后触发 |
| BI.Table.EVENT_TABLE_RESIZE | table大小调整时触发(窗口变化等) |
| BI.Table.EVENT_TABLE_SCROLL | 滚动事件 |
---

42
docs/_book/base/toast.md

@ -1,42 +0,0 @@
# bi.toast
#### toast提示
{% method %}
[source](https://jsfiddle.net/fineui/wop751sg/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.toast',
element: "#wrapper",
height: 30,
level: "warning",
text: "toast测试"
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :---- |:----
| level | 提示类型 | string | success,warning | "success" |
| height | 高度 | number | — | 30 |
| text | 显示内容 | string | — | " " |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setText | 设置文本值 | 需要设置的文本值text |
| setHeight | 设置高度 | 需要设置的高度值height |
---

53
docs/_book/case/button/multi_select_item.md

@ -1,53 +0,0 @@
# bi.multi_select_item
## 复选框item,基类[BI.BasicButton](/core/basic_button.md)
{% method %}
[source](https://jsfiddle.net/fineui/0z1fud88/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.vertical',
element: "#wrapper",
items: [{
type: "bi.label",
height: 30,
text: "复选item"
}, {
type: "bi.multi_select_item",
text: "复选项"
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| height | 高度 | number | — | 30
| logic | 布局逻辑 | object | — | {dynamic:false} |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setSelected| 设置选中值| v |
| doRedMark | 标红 |—|
| unRedMark | 取消标红 | — |
| doClick | 点击事件| —
---

54
docs/_book/case/button/single_select_item.md

@ -1,54 +0,0 @@
# bi.single_select_item
## 可以点击的label,基类[BI.BasicButton](/core/basic_button.md)
{% method %}
[source](https://jsfiddle.net/fineui/19qqcej4/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.vertical',
element: "#wrapper",
items: [{
type: "bi.label",
height: 30,
text: "复选item"
}, {
type: "bi.single_select_item",
text: "复选项"
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| height | 高度 | number | — | 25
| hgap | 效果相当于文本框左右padding值 |number | —| 10 |
|textAlign |文本对齐方式 |string |left,center,right |"left"
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setSelected| 设置选中值| v |
| doRedMark | 标红 |—|
| unRedMark | 取消标红 | — |
| doClick | 点击事件| —
---

55
docs/_book/case/button/single_select_radio_item.md

@ -1,55 +0,0 @@
# bi.single_select_radio_item
## 单选框item,基类[BI.BasicButton](/core/basic_button.md)
{% method %}
[source](https://jsfiddle.net/fineui/d3vw4438/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.vertical',
element: "#wrapper",
items: [{
type: "bi.label",
height: 30,
text: "单选item"
}, {
type: "bi.single_select_radio_item",
text: "单选项"
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| height | 高度 | number | — | 25
| hgap | 效果相当于文本框左右padding值 |number | —| 10 |
|textAlign |文本对齐方式 |string |left,center,right |"left"
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setSelected| 设置选中值| v |
| doRedMark | 标红 |—|
| unRedMark | 取消标红 | — |
| doClick | 点击事件| —
---

47
docs/_book/case/calendar.md

@ -1,47 +0,0 @@
# bi.calendar
### 日历控件
{% method %}
[source](https://jsfiddle.net/fineui/4sfsaoma/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.calendar',
min: '1900-01-01', //最小日期
max: '2099-12-31', //最大日期
year: 2015,
month: 7, //7表示八月
day: 25,
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| ----- | ----- | ------ | ------------ |
| min | 最小日期 | string | '1900-01-01' |
| max | 最大日期 | string | '2099-12-31' |
| year | 设定的年份 | number | 2015 |
| month | 设定的月份 | number | 7 |
| day | 设定的日期 | number | 25 |
### 方法
| 方法名 | 说明 | 参数 |
| ----------- | ------- | -------------------------- |
| isFrontDate | 是否为最小日期 | — |
| isFinalDate | 是否为最大日期 | — |
| setValue | 设置日期 | object: {year, month, day} |
| getVlaue | 获得日期 | — |
------

33
docs/_book/case/clipboard.md

@ -1,33 +0,0 @@
# bi.clipboard
### 剪切板
{% method %}
[source](https://jsfiddle.net/fineui/kLzq99c3/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.clipboard',
width: 100,
height: 100,
copy: function () {},
afterCopy: function () {}
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| --------- | ---------- | -------- | ---------- |
| copy | 获取需要拷贝的值 | function | BI.emptyFn |
| afterCopy | 完成拷贝后执行的方法 | function | BI.emptyFn |
------

32
docs/_book/case/color_chooser.md

@ -1,32 +0,0 @@
# bi.color_chooser
### 选色控件
{% method %}
[source](https://jsfiddle.net/fineui/z4fwweg9/)
{% common %}
```javascript
BI.createWidget({
type: "bi.color_chooser",
element: "#wrapper",
width: 30,
height: 30
});
```
{% endmethod %}
### 方法
| 方法名 | 说明 | 参数 |
| ------------- | ------ | ----- |
| isViewVisible | 判断是否显示 | — |
| setValue | 设置颜色值 | color |
| getValue | 获取颜色值 | — |
------

45
docs/_book/case/color_chooser_popup.md

@ -1,45 +0,0 @@
# bi.color_chooser_popup
### 选色控件弹窗
{% method %}
[source](https://jsfiddle.net/fineui/xL7moydu/)
{% common %}
```javascript
BI.createWidget({
type: "bi.color_chooser_popup",
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| ------ | ---- | ------ | ---- |
| height | 高度 | number | 145 |
### 方法
| 方法名 | 说明 | 参数 |
| -------------- | -------- | ------ |
| setStoreColors | 设置储存的颜色值 | colors |
| setValue | 设置颜色值 | color |
| getValue | 获取颜色值 | — |
### 事件
| 事件 | 说明 |
| ------------------ | -------- |
| EVENT_VALUE_CHANGE | 颜色值改变时触发 |
------

86
docs/_book/case/combo/bubble_combo.md

@ -1,86 +0,0 @@
# bi.bubble_combo
## 表示一个可以展开的节点, 不仅有选中状态而且有展开状态, 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/urvt04so/)
{% common %}
```javascript
BI.createWidget({
type: "bi.bubble_combo",
element:"#wrapper",
el: {
type: "bi.button",
text: "测试",
height: 25
},
popup: {
el: {
type: "bi.button_group",
items: BI.makeArray(100, {
type: "bi.text_item",
height: 25,
text: "item"
}),
layouts: [{
type: "bi.vertical"
}]
},
maxHeight: 200
}
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| text | 组件text值 | string | —| "" |
| value | 组件value值 | string |— |""|
| stopEvent | 阻止事件 |boolean | true,false | false |
| stopPropagation | 阻止冒泡 | boolean | true,false| false |
| selected | button的选中状态 | boolean | true,false |false |
| once | 点击一次选中有效,再点无效 | boolean | true,false | false|
| forceSelected | 点击即选中, 选中了就不会被取消,与once的区别是forceSelected不影响事件的触发| boolean | true,false| false|
| forceNotSelected | 无论怎么点击都不会被选中 | boolean| true,false | false|
| disableSelected | 使能选中| boolean | true,false| false|
| shadow | 是否显示阴影 | boolean| true,false| false|
| isShadowShowingOnSelected| 选中状态下是否显示阴影|boolean| true,false | false|
| trigger | 被选元素要触发的事件 | string | mousedown, mouseup, click, dblclick, lclick | null|
| handler | 点击事件回调 | function | —| BI.emptyFn |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| bindEvent | 绑定事件| —|
| beforeClick | 点击事件之前 | —|
| doClick | 点击事件 | — |
| handle | 返回该对象 | —|
| hover | hover事件| —|
| dishover | 取消hover事件| —|
|setSelected | 设置选中的文本| b|
| isSelected | 是否被选中| —|
| isOnce | 是否只允许点击一次| —|
| isForceSelected| 判断是否点击即选中| —|
| isForceNotSelected| 判断是否怎么点击都不会被选中|—|
| isDisableSelected| 判断是否让选中|—|
| setText| 设置文本值|—|
| getText| 获取文本值|—|
| empty| 清空组件|—|
| destroy| 销毁组件|—|
---

68
docs/_book/case/combo/icon_combo.md

@ -1,68 +0,0 @@
# bi.icon_combo
## 切换trigger图标的combo 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/z02vzvtb/)
{% common %}
```javascript
BI.createWidget({
type: "bi.icon_combo",
element: "#wrapper",
iconClass: "rename-font",
items: [{
value: "第一项",
iconClass: "delete-font"
}, {
value: "第二项",
iconClass: "rename-font"
}, {
value: "第三项",
iconClass: "move-font"
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| width | 宽度 | number | — | 24
| height | 高度 | number | — | 24
| iconClass | icon的类名 | string | —|" "|
| el | 自定义下拉框trigger| object | —|{ } |
| popup | 弹出层| object | —| { }
| minWidth| 最小宽度| number | —|100|
| maxWidth | 最大宽度 | string/number | — | "auto"|
| maxHeight | 最大高度 | number | —| 300
| adjustLength | 弹出列表和trigger的距离 | number | — | 0 |
| adjustXOffset | 调整横向偏移 | number | — | 0 |
| adjustYOffset |调整纵向偏移 | number | — | 0 |
| offsetStyle | 弹出层显示位置 | string | left,right,center | "left,right,center"|
| chooseType | 选择类型 | const | 参考button_group | BI.ButtonGroup.CHOOSE_TYPE_SINGLE |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setValue| 设置value值|—|
| getValue| 获取value值|—|
| showView | 显示弹出层 | —|
| hideView | 隐藏弹出层 |—|
| populate | 刷新列表 | items |
---

58
docs/_book/case/combo/static_combo.md

@ -1,58 +0,0 @@
# bi.static_combo
## 单选combo,trigger显示项不会改变 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/kn64gfzn/)
{% common %}
```javascript
BI.createWidget({
type: "bi.static_combo",
element: "#wrapper",
text: "Value 不变",
items: [{
text: "1",
value: 1
}, {
text: "2",
value: 2
}, {
text: "3",
value: 3
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| height | 高度 | number | — | 24
| el | 自定义下拉框trigger| object | —|{ } |
| items | 子组件 | array | — | [ ]
| text | 文本内容 | string | — | " " |
| chooseType | 选择类型 | const |参考button_group | BI.ButtonGroup.CHOOSE_TYPE_SINGLE |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setValue| 设置value值|—|
| getValue| 获取value值|—|
| populate | 刷新列表 | items |
---

58
docs/_book/case/combo/text_value_combo.md

@ -1,58 +0,0 @@
# bi.text_value_combo
## 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/hcf0kd9m/)
{% common %}
```javascript
BI.createWidget({
type: "bi.text_value_combo",
element: "#wrapper",
text: "value_combo",
width: 300,
items: [{
text: "1",
value: 1
}, {
text: "2",
value: 2
}, {
text: "3",
value: 3
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| height | 高度 | number | — | 30
| el | 自定义下拉框trigger| object |—|{ } |
| text | 文本内容 | string | — | " " |
| chooseType | 选择类型 | const |参考button_group | BI.ButtonGroup.CHOOSE_TYPE_SINGLE |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setValue| 设置value值|—|
| getValue| 获取value值|—|
| populate | 刷新列表 | items |
---

65
docs/_book/case/combo/text_value_downlist_combo.md

@ -1,65 +0,0 @@
# bi.text_value_down_list_combo
## 有二级下拉菜单的combo 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/xtxmfgx1/)
{% common %}
```javascript
BI.createWidget({
type: "bi.text_value_down_list_combo",
element: "#wrapper",
text: "text",
items: [
[{
el: {
text: "1",
value: 1
},
children: [{
text: "11",
value: 11
}]
}],
[{
text: "2",
value: 2
}, {
text: "3",
value: 3
}]
]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| height | 高度 | number | — | 30
| text | 文本内容 | string | — | " " |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setValue| 设置value值|—|
| getValue| 获取value值|—|
| populate | 刷新列表 | items |
---

37
docs/_book/case/complex_canvas.md

@ -1,37 +0,0 @@
# complex_canvas
## 复杂的canvas绘图
{% method %}
[source](https://jsfiddle.net/fineui/psozjkgn/)
{% common %}
```javascript
var canvas = BI.createWidget({
type: "bi.complex_canvas",
width: 500,
height: 600
});
canvas.branch(55, 100, 10, 10, 100, 10, 200, 10, {
offset: 20,
strokeStyle: "red",
lineWidth: 2
});
canvas.stroke();
```
{% endmethod %}
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| branch | 绘制树枝节点| (x0, y0, x1, y1, x2, y2) (以x0, y0为根节点,分支到x1,y1, x2,y2...)|
| stroke | 绘制 | |
---

93
docs/_book/case/editor/shelter_editor.md

@ -1,93 +0,0 @@
# bi.shelter_editor
## 带标记的文本框,需手动控制进入编辑状态 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/9Lbx6kga/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.shelter_editor",
cls: "bi-border",
width: 300,
watermark: "这个是带标记的"
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值 | number | — | 4 |
| vgap | 效果相当于文本框上下padding值 | number | — | 2 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| tgap |效果相当于文本框top-padding值 | number | — | 0 |
| bgap | 效果相当于文本框bottom-padding值 | number | — | 0 |
| validationChecker | 输入较验函数 |function| — | — |
| quitChecker | 是否允许退出编辑函数 | function | — | — |
| allowBlank | 是否允许空值 | boolean | true,false | true |
| watermark | 文本框placeholder | string | — | " " |
| errorText | 错误提示 | string/function | —| " "|
| height| 高度| number |— | 30|
| textAlign| 对齐方式 | string |left,center,right |"left"|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setErrorText | 设置错误文本 | text |
| getErrorText | 获取错误文本 | —|
| focus | 文本框获取焦点| — |
| blur | 文本框失焦|—|
| onKeyDown |按键事件|key|
| setValue | 设置文本框值|value|
| getLastValidValue | 获取文本框最后一次输入的有效值| —|
| setTextStyle| 设置文本框样式| style |
| getValue | 获取文本框值|—|
| isEditing | 文本框是否处于编辑状态|—|
| isValid | 文本框值是否有效|—|
| doRedMark | 文本标红 | — |
| unRedMark | 取消文本标红| —|
| doHighLight | 文本高亮 | —|
| unHighLight | 取消文本高亮 | —|
| setTitle| 设置title | title|
| setWarningTitle| 设置错误title | title |
| setState | 设置文本框值 |—
| getState | 获取文本框值 | —
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.Editor.EVENT_CHANGE | editor的value发生改变触发 |
|BI.Editor.EVENT_FOCUS | focus事件 |
|BI.Editor.EVENT_BLUR | blur事件 |
|BI.Editor.EVENT_CLICK | 点击编辑框触发(不在编辑状态时) |
|BI.Editor.EVENT_KEY_DOWN | keyDown时触发 |
|BI.Editor.EVENT_SPACE | 按下空格触发 |
|BI.Editor.EVENT_BACKSPACE | 按下Backspace触发 |
|BI.Editor.EVENT_START | 开始输入触发 |
|BI.Editor.EVENT_PAUSE | 暂停输入触发(输入空白字符) |
|BI.Editor.EVENT_STOP | 停止输入触发 |
|BI.Editor.EVENT_CONFIRM | 确定输入触发(blur时且输入值有效) |
|BI.Editor.EVENT_VALID | 输入值有效的状态事件 |
|BI.Editor.EVENT_ERROR | 输入值无效的状态事件 |
|BI.Editor.EVENT_ENTER | 回车事件 |
|BI.Editor.EVENT_RESTRICT | 回车但是值不合法 |
|BI.Editor.EVENT_REMOVE | 输入为空时按下backspace |
|BI.Editor.EVENT_EMPTY | 输入框为空时触发 |
---

91
docs/_book/case/editor/sign_editor.md

@ -1,91 +0,0 @@
# bi.sign_editor
## 带标记的文本框,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/tmdedu5t/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.sign_editor",
cls:"layout-bg5",
value: "123",
text: "456",
width: 300
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值 | number | — | 4 |
| vgap | 效果相当于文本框上下padding值 | number | —| 2 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| tgap |效果相当于文本框top-padding值 | number | — | 0 |
| bgap | 效果相当于文本框bottom-padding值 | number | — | 0 |
| validationChecker | 输入较验函数 |function| — | — |
| quitChecker | 是否允许退出编辑函数 | function | — | — |
| allowBlank | 是否允许空值 | boolean | true,false | true |
| watermark | 文本框placeholder | string | — | " " |
| errorText | 错误提示 | string/function | —| " "|
| height| 高度| number |— | 30|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setErrorText | 设置错误文本 | text |
| getErrorText | 获取错误文本 | —|
| focus | 文本框获取焦点| — |
| blur | 文本框失焦|—|
| setValue | 设置文本框值|value|
| getLastValidValue | 获取文本框最后一次输入的有效值| —|
| getValue | 获取文本框值|—|
| isEditing | 文本框是否处于编辑状态|—|
| isValid | 文本框值是否有效|—|
| doRedMark | 文本标红 | — |
| unRedMark | 取消文本标红| —|
| doHighLight | 文本高亮 | —|
| unHighLight | 取消文本高亮 | —|
| setTitle| 设置title | title|
| setWarningTitle| 设置错误title | title |
| setState | 设置文本框值 |—
| getState | 获取文本框值 | —
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.Editor.EVENT_CHANGE | editor的value发生改变触发 |
|BI.Editor.EVENT_FOCUS | focus事件 |
|BI.Editor.EVENT_BLUR | blur事件 |
|BI.Editor.EVENT_CLICK | 点击编辑框触发(不在编辑状态时) |
|BI.Editor.EVENT_KEY_DOWN | keyDown时触发 |
|BI.Editor.EVENT_SPACE | 按下空格触发 |
|BI.Editor.EVENT_BACKSPACE | 按下Backspace触发 |
|BI.Editor.EVENT_START | 开始输入触发 |
|BI.Editor.EVENT_PAUSE | 暂停输入触发(输入空白字符) |
|BI.Editor.EVENT_STOP | 停止输入触发 |
|BI.Editor.EVENT_CONFIRM | 确定输入触发(blur时且输入值有效) |
|BI.Editor.EVENT_VALID | 输入值有效的状态事件 |
|BI.Editor.EVENT_ERROR | 输入值无效的状态事件 |
|BI.Editor.EVENT_ENTER | 回车事件 |
|BI.Editor.EVENT_RESTRICT | 回车但是值不合法 |
|BI.Editor.EVENT_REMOVE | 输入为空时按下backspace |
|BI.Editor.EVENT_EMPTY | 输入框为空时触发 |
---

92
docs/_book/case/editor/sign_initial_editor.md

@ -1,92 +0,0 @@
# bi.sign_initial_editor
## 指定初始值 之后初始值会一直显示的editor 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/9vjghevp/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.sign_initial_editor",
cls: "layout-bg5",
text: "原始值",
width: 300
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值 | number | — | 4 |
| vgap | 效果相当于文本框上下padding值 | number | — | 2 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| tgap |效果相当于文本框top-padding值 | number | —| 0 |
| bgap | 效果相当于文本框bottom-padding值 | number | | 0 |
| validationChecker | 输入较验函数 |function| — | — |
| quitChecker | 是否允许退出编辑函数 | function | — | — |
| allowBlank | 是否允许空值 | boolean | true,false | true |
| watermark | 文本框placeholder | string | — | " " |
| errorText | 错误提示 | string/function | —| " "|
| height| 高度| number |— | 30|
| text | 文本内容 | string | —| " " |
| value | 文本value值 | string | — | " " |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setErrorText | 设置错误文本 | text |
| getErrorText | 获取错误文本 | —|
| focus | 文本框获取焦点| — |
| blur | 文本框失焦|—|
| setValue | 设置文本框值|value|
| getLastValidValue | 获取文本框最后一次输入的有效值| —|
| getValue | 获取文本框值|—|
| isEditing | 文本框是否处于编辑状态|—|
| isValid | 文本框值是否有效|—|
| doRedMark | 文本标红 | — |
| unRedMark | 取消文本标红| —|
| doHighLight | 文本高亮 | —|
| unHighLight | 取消文本高亮 | —|
| setTitle| 设置title | title|
| setWarningTitle| 设置错误title | title |
| setState | 设置文本框值 |—
| getState | 获取文本框值 | —
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.Editor.EVENT_CHANGE | editor的value发生改变触发 |
|BI.Editor.EVENT_FOCUS | focus事件 |
|BI.Editor.EVENT_BLUR | blur事件 |
|BI.Editor.EVENT_CLICK | 点击编辑框触发(不在编辑状态时) |
|BI.Editor.EVENT_KEY_DOWN | keyDown时触发 |
|BI.Editor.EVENT_SPACE | 按下空格触发 |
|BI.Editor.EVENT_BACKSPACE | 按下Backspace触发 |
|BI.Editor.EVENT_START | 开始输入触发 |
|BI.Editor.EVENT_PAUSE | 暂停输入触发(输入空白字符) |
|BI.Editor.EVENT_STOP | 停止输入触发 |
|BI.Editor.EVENT_CONFIRM | 确定输入触发(blur时且输入值有效) |
|BI.Editor.EVENT_VALID | 输入值有效的状态事件 |
|BI.Editor.EVENT_ERROR | 输入值无效的状态事件 |
|BI.Editor.EVENT_ENTER | 回车事件 |
|BI.Editor.EVENT_RESTRICT | 回车但是值不合法 |
|BI.Editor.EVENT_REMOVE | 输入为空时按下backspace |
|BI.Editor.EVENT_EMPTY | 输入框为空时触发 |
---

89
docs/_book/case/editor/state_editor.md

@ -1,89 +0,0 @@
# bi.state_editor
## 记录状态的输入框,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/p68bwkmv/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.state_editor",
value: "123",
text: "456",
width: 300
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值 | number | — | 4 |
| vgap | 效果相当于文本框上下padding值 | number | — | 2 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| tgap |效果相当于文本框top-padding值 | number | —| 0 |
| bgap | 效果相当于文本框bottom-padding值 | number | — | 0 |
| validationChecker | 输入较验函数 |function| — | — |
| quitChecker | 是否允许退出编辑函数 | function |— | — |
| allowBlank | 是否允许空值 | boolean | true,false | true |
| watermark | 文本框placeholder | string | —| " " |
| errorText | 错误提示 | string/function |— | " "|
| height| 高度| number |— | 30|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setErrorText | 设置错误文本 | text |
| getErrorText | 获取错误文本 | —|
| focus | 文本框获取焦点| — |
| blur | 文本框失焦|—|
| setValue | 设置文本框值|value|
| getLastValidValue | 获取文本框最后一次输入的有效值| —|
| getValue | 获取文本框值|—|
| isEditing | 文本框是否处于编辑状态|—|
| isValid | 文本框值是否有效|—|
| doRedMark | 文本标红 | — |
| unRedMark | 取消文本标红| —|
| doHighLight | 文本高亮 | —|
| unHighLight | 取消文本高亮 | —|
| setState | 设置文本框值 |—
| getState | 获取文本框值 | —
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.Editor.EVENT_CHANGE | editor的value发生改变触发 |
|BI.Editor.EVENT_FOCUS | focus事件 |
|BI.Editor.EVENT_BLUR | blur事件 |
|BI.Editor.EVENT_CLICK | 点击编辑框触发(不在编辑状态时) |
|BI.Editor.EVENT_KEY_DOWN | keyDown时触发 |
|BI.Editor.EVENT_SPACE | 按下空格触发 |
|BI.Editor.EVENT_BACKSPACE | 按下Backspace触发 |
|BI.Editor.EVENT_START | 开始输入触发 |
|BI.Editor.EVENT_PAUSE | 暂停输入触发(输入空白字符) |
|BI.Editor.EVENT_STOP | 停止输入触发 |
|BI.Editor.EVENT_CONFIRM | 确定输入触发(blur时且输入值有效) |
|BI.Editor.EVENT_VALID | 输入值有效的状态事件 |
|BI.Editor.EVENT_ERROR | 输入值无效的状态事件 |
|BI.Editor.EVENT_ENTER | 回车事件 |
|BI.Editor.EVENT_RESTRICT | 回车但是值不合法 |
|BI.Editor.EVENT_REMOVE | 输入为空时按下backspace |
|BI.Editor.EVENT_EMPTY | 输入框为空时触发 |
---

69
docs/_book/case/layer/layer_panel.md

@ -1,69 +0,0 @@
# bi.popup_panel
## 可以理解为MultiPopupView和Panel两个面板的结合体,基类[BI.MultiPopupView](case/layer/multi_popup_layer.md)
{% method %}
[source](https://jsfiddle.net/fineui/zhnqvera/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.popup_panel",
title: "测试",
width: 300
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| title | 标题 | string | — | " "
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| prependItems | 内部前插入 | items |
| addItems | 内部后插入 | items |
| removeItemAt | 移除指定索引处的item | indexs |
| populate | 刷新列表 | items |
| setNotSelectedValue| 设置未被选中的值 | value,可以是单个值也可以是个数组|
| setValue | 设置value值 | value,可以是单个值也可以是个数组 |
| getNotSelectedValue | 获取没有被选中的值 | —|
| getValue | 获取被选中的值 |—|
| getAllButtons | 获取所有button |—|
| getAllLeaves | 获取所有的叶子节点 | —|
| getSelectedButtons | 获取所有被选中的元素 | —|
| getNotSelectedButtons | 获取所有未被选中的元素 | —|
| getIndexByValue | 根据value值获取value在数组中的索引 | value|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
| empty| 清空组件|—|
| hasPrev| 是否有上一页|—|
| hasNext | 是否有下一页 | —
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.PopupPanel.EVENT_CHANGE | panel的value发生改变触发 |
| BI.PopupPanel.EVENT_CLOSE | panel的关闭事件
| BI.PopupPanel.EVENT_CLICK_TOOLBAR_BUTTON | 点击工具栏事件
---

34
docs/_book/case/layer/multi_popup_layer.md

@ -1,34 +0,0 @@
# bi.multi_popup_view
## 下拉框弹出层的多选版本,toolbar带有若干按钮, zIndex在1000w,基类[BI.MultiPopupView](case/layer/multi_popup_layer.md)
{% method %}
[source](https://jsfiddle.net/fineui/8of9a7cy/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.multi_popup_view",
width: 300
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| buttons | 按钮组 |array | — | BI.i18nText("BI-Basic_Sure")
---

74
docs/_book/case/layer/pane_list.md

@ -1,74 +0,0 @@
# bi.list_pane
## list面板,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/7Lv8q9p9/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.list_pane',
element: "#wrapper",
cls: "bi-border",
items: []
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| items | 列表 | array | — | [ ]
| itemsCreator | 列表创建器| function | — | —
| hasNext | 是否有下一页 | function | —| —
| onLoad | 正在加载 | function | —| —
| el | 开启panel的元素 | object | —|{type: "bi.button_group" }|
| logic | 布局逻辑 | object |— | { dynamic:true}
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | —| 0 |
| lgap | 效果相当于容器left-padding值 | number | —| 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| prependItems | 内部前插入 | items |
| addItems | 内部后插入 | items |
| removeItemAt | 移除指定索引处的item | indexs |
| populate | 刷新列表 | items |
| setNotSelectedValue| 设置未被选中的值 | value,可以是单个值也可以是个数组|
| setValue | 设置value值 | value,可以是单个值也可以是个数组 |
| getNotSelectedValue | 获取没有被选中的值 | —|
| getValue | 获取被选中的值 |—|
| getAllButtons | 获取所有button |—|
| getAllLeaves | 获取所有的叶子节点 | —|
| getSelectedButtons | 获取所有被选中的元素 | —|
| getNotSelectedButtons | 获取所有未被选中的元素 | —|
| getIndexByValue | 根据value值获取value在数组中的索引 | value|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
| empty| 清空组件|—|
| hasPrev| 是否有上一页|—|
| hasNext | 是否有下一页 | —
---

54
docs/_book/case/layer/panel.md

@ -1,54 +0,0 @@
# bi.panel
## 带有标题栏的panel,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/3m1q3857/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.panel",
title: "标题",
titleButtons: [{
type: "bi.button",
text: "+"
}],
el: this.button_group,
logic: {
dynamic: true
}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| title | 标题 | string | — | " "
| titleButton | 标题后的按钮组 | array | —| [ ]
| el | 开启panel的元素 | object | —|{ }|
| logic | 布局逻辑 | object |— | { dynamic:false}
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setTitle |设置标题| title
---

59
docs/_book/case/list/list.select.md

@ -1,59 +0,0 @@
# bi.select_list
### 选择列表
{% method %}
[source](https://jsfiddle.net/fineui/c3azpxss/)
{% common %}
```javascript
BI.createWidget({
type: "bi.select_list",
items: [{
text: '1',
}, {
text: '2',
}]
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | --------------- | -------- | ---------------- |
| direction | toolbar位置 | string | BI.Direction.Top |
| onLoaded | 加载完成的回调(测试了无效果) | function | BI.emptyFn |
| items | 子项 | array | [] |
| itemsCreator | 元素创造器 | function | BI.emptyFn |
### 方法
| 方法名 | 说明 | 参数 |
| --------------------- | ------------- | ------- |
| setAllSelected | 设置全选 | v: boolean |
| setToolBarVisible | 设置toolbar是否可见 | b: boolean |
| isAllSelected | 是否全选中 | — |
| hasPrev | 是否有上一页 | — |
| hasNext | 是否有下一页 | — |
| prependItems | 列表最前添加元素 | items |
| addItems | 列表最后添加元素 | items |
| setValue | 设置值 | data |
| getVlaue | 获得值 | — |
| empty | 清空 | — |
| populate | 替换内容 | items |
| resetHeight | 重新设置高度 | h |
| setNotSelectedValue | 设置未选中值 | — |
| getNotSelectedValue | 获取未选中植 | — |
| getAllButtons | 获得所以根节点 | — |
| getAllLeaves | 获得所有叶节点 | — |
| getSelectedButtons | 获取选中的根节点 | — |
| getNotSelectedButtons | 获取未选中的根节点 | — |
| getIndexByValue | 根据值获取索引 | value |
| getNodeById | 根据id获取node | id |
| getNodeByValue | 根据值获取node | value |
------

43
docs/_book/case/loader/lazy_loader.md

@ -1,43 +0,0 @@
# bi.lazy_loader
### 懒加载loader
{% method %}
[source](https://jsfiddle.net/fineui/n710yphc/)
{% common %}
```javascript
BI.createWidget({
type: "bi.lazy_loader",
width: 100,
element: 'body',
items: items,
});
```
{% endmethod %}
### 方法
| 方法名 | 说明 | 参数 |
| --------------------- | ---------- | ----- |
| addItems | 列表最后添加元素 | items |
| setValue | 设置值 | data |
| getVlaue | 获得值 | — |
| empty | 清空 | — |
| populate | 替换内容 | items |
| setNotSelectedValue | 设置未选中值 | — |
| getNotSelectedValue | 获取未选中植 | — |
| getAllButtons | 获得所以根节点 | — |
| getAllLeaves | 获得所有叶节点 | — |
| getSelectedButtons | 获取选中的根节点 | — |
| getNotSelectedButtons | 获取未选中的根节点 | — |
| getIndexByValue | 根据值获取索引 | value |
| getNodeById | 根据id获取node | id |
| getNodeByValue | 根据值获取node | value |
------

54
docs/_book/case/loader/list_loader.md

@ -1,54 +0,0 @@
# bi.list_loader
### 为解决排序问题引入的控件
{% method %}
[source](https://jsfiddle.net/fineui/8wa7rvcd/)
{% common %}
```javascript
BI.createWidget({
type: "bi.list_loader",
width: 100,
element: 'body',
items: items,
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | ------ | -------- | ---------- |
| count | 分页计数 | number | false |
| next | | object | {} |
| hasNext | 是否有下一页 | function | BI.emptyFn |
| items | 子项 | array | [] |
| itemsCreator | 元素创造器 | function | BI.emptyFn |
| onLoaded | 加载完成回调 | function | BI.emptyFn |
### 方法
| 方法名 | 说明 | 参数 |
| --------------------- | ---------- | ----- |
| hasNext | 是否有下一页 | — |
| addItems | 列表最后添加元素 | items |
| setValue | 设置值 | data |
| getVlaue | 获得值 | — |
| empty | 清空 | — |
| populate | 替换内容 | items |
| resetHeight | 重新设置高度 | h |
| setNotSelectedValue | 设置未选中值 | — |
| getNotSelectedValue | 获取未选中植 | — |
| getAllButtons | 获得所以根节点 | — |
| getAllLeaves | 获得所有叶节点 | — |
| getSelectedButtons | 获取选中的根节点 | — |
| getNotSelectedButtons | 获取未选中的根节点 | — |
| getIndexByValue | 根据值获取索引 | value |
| getNodeById | 根据id获取node | id |
| getNodeByValue | 根据值获取node | value |
------

54
docs/_book/case/loader/sort_list.md

@ -1,54 +0,0 @@
# bi.sort_list
### 排序列表
{% method %}
[source](https://jsfiddle.net/fineui/wj68tdvx/)
{% common %}
```javascript
BI.createWidget({
type: "bi.sort_list",
width: 100,
element: 'body',
items: items,
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | ------ | -------- | ---------- |
| count | 分页计数 | number | false |
| next | | object | {} |
| hasNext | 是否有下一页 | function | BI.emptyFn |
| items | 子项 | array | [] |
| itemsCreator | 元素创造器 | function | BI.emptyFn |
| onLoaded | 加载完成回调 | function | BI.emptyFn |
### 方法
| 方法名 | 说明 | 参数 |
| --------------------- | ---------- | ----- |
| hasNext | 是否有下一页 | — |
| addItems | 列表最后添加元素 | items |
| setValue | 设置值 | data |
| getVlaue | 获得值 | — |
| empty | 清空 | — |
| populate | 替换内容 | items |
| resetHeight | 重新设置高度 | h |
| setNotSelectedValue | 设置未选中值 | — |
| getNotSelectedValue | 获取未选中植 | — |
| getAllButtons | 获得所以根节点 | — |
| getAllLeaves | 获得所有叶节点 | — |
| getSelectedButtons | 获取选中的根节点 | — |
| getNotSelectedButtons | 获取未选中的根节点 | — |
| getIndexByValue | 根据值获取索引 | value |
| getNodeById | 根据id获取node | id |
| getNodeByValue | 根据值获取node | value |
------

48
docs/_book/case/pager/all_count_pager.md

@ -1,48 +0,0 @@
# bi.all_count_pager
### 有总页数和总行数的分页控件
{% method %}
[source](https://jsfiddle.net/fineui/cmtamo5L/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.all_count_pager',
height: 30,
pages: 10, //必选项
curr: 1,
count: 1,
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| ------ | ---- | ------ | ---- |
| height | 控件高度 | number | 30 |
| pages | 总页数 | number | 1 |
| curr | 当前页 | number | 1 |
| count | 总行数 | number | 1 |
### 方法
| 方法名 | 说明 | 参数 |
| --------------- | -------- | ---------- |
| setAllPages | 设置总页数 | v |
| setValue | 设置当前页码 | v |
| setVPage | 设置当前页码 | v |
| setCount | 设置计数 | count |
| getCurrentPage | 获取当前页码 | — |
| hasPrev | 是否有前一页 | — |
| hasNext | 是否有后一页 | — |
| setPagerVisible | 设置页码是否可见 | true/false |
| populate | 清空内容 | — |
------

65
docs/_book/case/pager/direction_pager.md

@ -1,65 +0,0 @@
# bi.direction_pager
### 显示页码的分页控件
{% method %}
[source](https://jsfiddle.net/fineui/vyc36s2a/)
{% common %}
```javascript
var pager = BI.createWidget({
type: 'bi.direction_pager',
height: 30,
horizontal: {
pages: 10, //必选项
curr: 1, //初始化当前页, pages为数字时可用,
firstPage: 1,
lastPage: 10,
},
vertical: {
pages: 10, //必选项
curr: 1, //初始化当前页, pages为数字时可用,
firstPage: 1,
lastPage: 10,
},
element: 'body',
});
```
{% endmethod %}
### 参数
| 参数 | 二级参数 | 说明 | 类型 | 默认值 |
| ---------- | --------- | ---------------------- | --------------- | ---------- |
| height | | 控件高度 | number | 30 |
| horizontal | | 横向翻页设置 | object | — |
| | pages | 总页数 | number/boolean | false |
| | curr | 当前页, pages为数字时可用 | number | 1 |
| | hasPrev | 判断是否有前一页的方法 | function | BI.emptyFn |
| | hasNext | 判断是否有后一页的方法 | function | BI.emptyFn |
| | firstPage | 第一页 | number | 1 |
| | lastPage | 最后一页 | number/function | BI.emptyFn |
| vertical | | 纵向翻页设置,参数与horizontal相同 | object | — |
### 方法
| 方法名 | 说明 | 参数 |
| ---------------- | ---------- | ---- |
| getVPage | 获取纵向页码 | — |
| getHPage | 获取水平向页码 | — |
| setVPage | 获取纵向页码 | v |
| setHPage | 获取水平向页码 | v |
| hasVNext | 纵向坐标是否有下一页 | — |
| hasHNext | 横向坐标是否有下一页 | — |
| hasVPrev | 纵向坐标是否有上一页 | — |
| hasHPrev | 横向坐标是否有上一页 | — |
| setHPagerVisible | 设置横向分页键可见 | — |
| setVPagerVisible | 设置纵向分页键可见 | — |
| populate | 清空内容 | — |
------

58
docs/_book/case/segment.md

@ -1,58 +0,0 @@
# bi.sgement
## 各种segment
{% method %}
[source](https://jsfiddle.net/fineui/7skvd64L/)
{% common %}
```javascript
BI.createWidget({
type: "bi.vertical",
element: "#wrapper",
items: [{
type: "bi.label",
height: 30,
text: "默认风格"
}, {
type: "bi.segment",
items: [{
text: "tab1",
value: 1,
selected: true
}, {
text: "tab2",
value: 2
}, {
text: "tab3 disabled",
disabled: true,
value: 3
}]
}],
hgap: 50,
vgap: 20
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于文本框左右padding值 | number | — | 10 |
| vgap | 效果相当于文本框上下padding值 | number | — | 0 |
| lgap | 效果相当于文本框left-padding值 | number | — | 0 |
| rgap | 效果相当于文本框right-padding值 | number | — | 0 |
| tgap |效果相当于文本框top-padding值 | number | — | 0 |
| bgap | 效果相当于文本框bottom-padding值 | number | — | 0 |
| items | 子控件数组 | array |— | [ ] |
| width | 宽度 | number | — | — |
| height | 高度 | number | — | — |
---

69
docs/_book/case/table/adaptive_table.md

@ -1,69 +0,0 @@
# bi.adaptive_table
### 自适应宽度的表格
{% method %}
[source](https://jsfiddle.net/fineui/pbgnjeg0/)
{% common %}
```javascript
BI.createWidget({
type: "bi.adaptive_table",
element: 'body',
width: 600,
height: 500,
isResizeAdapt: true,
isNeedResize: true,
isNeedFreeze: true,
freezeCols: [0, 1],
columnSize: [50,50,200,250,400],
header: [],
items: [],
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ---------------- | ------------- | -------------------- | ----------------- |
| isNeedResize | 是否可改变列大小 | boolean | true |
| isNeedFreeze | 是否需要冻结表头 | boolean | false |
| freezeCols | 冻结的列 | array | [] |
| isNeedMerge | 是否需要合并单元格 | boolean | false |
| mergeCols | 合并的单元格列号 | array | [] |
| mergeRule | 合并规则, 默认相等时合并 | function(row1, row2) | 默认row1 = row2 时合并 |
| columnSize | 单元格宽度集合 | array | [] |
| minColumnSize | 最小列宽 | array | [] |
| maxColumnSize | 最大列宽 | array | [] |
| headerRowSize | 表头高度 | number | 25 |
| rowSize | 普通单元格高度 | number | 25 |
| regionColumnSize | 列项间的 | array | [] |
| header | 表头 | array | [] |
| items | 子组件 | array | [] |
| crossHeader | 交叉表头 | array | [] |
| crossItems | 交叉项 | array | [] |
## 方法
| 方法名 | 说明 | 参数 |
| ------------------------ | ----------- | ------------------ |
| setWidth | 设置宽度 | width: 宽度 |
| setHeight | 设置高度 | height: 高度 |
| setColumnSize | 设置列宽 | columnSize: 列宽数组 |
| getColumnSize | 得到列宽 | — |
| setRegionColumnSize | 设置列项之间的间隙 | columnSize: 列宽数组 |
| getRegionColumnSize | 获得列项之间的间隙 | — |
| setVerticalScroll | 设置纵向滚动距离 | scrollTop: 纵向滚动距离 |
| setLeftHorizontalScroll | 设置左到右横向滚动距离 | scrollLeft: 横向滚动距离 |
| setRightHorizontalScroll | 设置右往左横向滚动距离 | scrollLeft: 横向滚动距离 |
| getVerticalScroll | 获取纵向滚动距离 | — |
| getLeftHorizontalScroll | 获取左到右横向滚动距离 | — |
| getRightHorizontalScroll | 获取右往左横向滚动距离 | — |
| attr | 设置属性 | key: 键 value: 值 |
| restore | 存储 | — |
| populate | 增加项 | items: array |
| destroy | 摧毁表 | — |
------

72
docs/_book/case/table/layer_tree_table.md

@ -1,72 +0,0 @@
# bi.layer_tree_table
### 层级树状结构的表格
{% method %}
[source](https://jsfiddle.net/fineui/pqyuLoay/)
{% common %}
```javascript
var table = BI.createWidget({
type: "bi.layer_tree_table",
width: 600,
height: 400,
columnSize: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
minColumnSize: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
header: header,
items: items,
crossHeader: crossHeader,
crossItems: crossItems,
element: 'body',
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ----------------------- | ------------------------ | -------------------- | ----------------- |
| isNeedResize | 是否需要调整列宽 | boolean | false |
| isResizeAdapt | 是否需要在调整列宽或区域宽度的时候它们自适应变化 | boolean | true |
| isNeedFreeze | 是否需要冻结表头 | boolean | false |
| freezeCols | 冻结的列 | array | [] |
| isNeedMerge | 是否需要合并单元格 | boolean | false |
| mergeCols | 合并的单元格列号 | array | [] |
| mergeRule | 合并规则, 默认相等时合并 | function(row1, row2) | 默认row1 = row2 时合并 |
| columnSize | 单元格宽度集合 | array | [] |
| minColumnSize | 最小列宽 | array | [] |
| maxColumnSize | 最大列宽 | array | [] |
| headerRowSize | 表头高度 | number | 25 |
| headerCellStyleGetter | | function | BI.emptyFn |
| summaryCellStyleGetter | | function | BI.emptyFn |
| sequenceCellStyleGetter | | function | BI.emptyFn |
| rowSize | 普通单元格高度 | number | 25 |
| regionColumnSize | 列项间的 | array | [] |
| header | 表头 | array | [] |
| items | 子组件 | array | [] |
| crossHeader | 交叉表头 | array | [] |
| crossItems | 交叉项 | array | [] |
## 方法
| 方法名 | 说明 | 参数 |
| ------------------------ | ----------- | ------------------ |
| setWidth | 设置宽度 | width: 宽度 |
| setHeight | 设置高度 | height: 高度 |
| setColumnSize | 设置列宽 | columnSize: 列宽数组 |
| getColumnSize | 得到列宽 | — |
| setRegionColumnSize | 设置列项之间的间隙 | columnSize: 列宽数组 |
| getRegionColumnSize | 获得列项之间的间隙 | — |
| setVerticalScroll | 设置纵向滚动距离 | scrollTop: 纵向滚动距离 |
| setLeftHorizontalScroll | 设置左到右横向滚动距离 | scrollLeft: 横向滚动距离 |
| setRightHorizontalScroll | 设置右往左横向滚动距离 | scrollLeft: 横向滚动距离 |
| getVerticalScroll | 获取纵向滚动距离 | — |
| getLeftHorizontalScroll | 获取左到右横向滚动距离 | — |
| getRightHorizontalScroll | 获取右往左横向滚动距离 | — |
| attr | 设置属性 | key: 键 value: 值 |
| restore | 存储 | — |
| populate | 增加项 | items: array |
| destroy | 摧毁表 | — |
------

73
docs/_book/case/table/tree_table.md

@ -1,73 +0,0 @@
# bi.tree_table
### 树状结构的表格
{% method %}
[source](https://jsfiddle.net/fineui/a0m21ozk/)
{% common %}
```javascript
var table = BI.createWidget({
type: "bi.tree_table",
width: 600,
height: 400,
columnSize: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
minColumnSize: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
header: header,
items: items,
crossHeader: crossHeader,
crossItems: crossItems,
element: 'body',
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ----------------------- | ------------------------ | -------------------- | ----------------- |
| isNeedResize | 是否需要调整列宽 | boolean | false |
| isResizeAdapt | 是否需要在调整列宽或区域宽度的时候它们自适应变化 | boolean | true |
| isNeedFreeze | 是否需要冻结表头 | boolean | false |
| freezeCols | 冻结的列 | array | [] |
| isNeedMerge | 是否需要合并单元格 | boolean | false |
| mergeCols | 合并的单元格列号 | array | [] |
| mergeRule | 合并规则, 默认相等时合并 | function(row1, row2) | 默认row1 = row2 时合并 |
| columnSize | 单元格宽度集合 | array | [] |
| minColumnSize | 最小列宽 | array | [] |
| maxColumnSize | 最大列宽 | array | [] |
| headerRowSize | 表头高度 | number | 25 |
| headerCellStyleGetter | | function | BI.emptyFn |
| summaryCellStyleGetter | | function | BI.emptyFn |
| sequenceCellStyleGetter | | function | BI.emptyFn |
| rowSize | 普通单元格高度 | number | 25 |
| regionColumnSize | 列项间的 | array | [] |
| header | 表头 | array | [] |
| items | 子组件 | array | [] |
| crossHeader | 交叉表头 | array | [] |
| crossItems | 交叉项 | array | [] |
## 方法
| 方法名 | 说明 | 参数 |
| ------------------------ | ----------- | ------------------ |
| setWidth | 设置宽度 | width: 宽度 |
| setHeight | 设置高度 | height: 高度 |
| setColumnSize | 设置列宽 | columnSize: 列宽数组 |
| getColumnSize | 得到列宽 | — |
| setRegionColumnSize | 设置列项之间的间隙 | columnSize: 列宽数组 |
| getRegionColumnSize | 获得列项之间的间隙 | — |
| setVerticalScroll | 设置纵向滚动距离 | scrollTop: 纵向滚动距离 |
| setLeftHorizontalScroll | 设置左到右横向滚动距离 | scrollLeft: 横向滚动距离 |
| setRightHorizontalScroll | 设置右往左横向滚动距离 | scrollLeft: 横向滚动距离 |
| getVerticalScroll | 获取纵向滚动距离 | — |
| getLeftHorizontalScroll | 获取左到右横向滚动距离 | — |
| getRightHorizontalScroll | 获取右往左横向滚动距离 | — |
| attr | 设置属性 | key: 键 value: 值 |
| restore | 存储 | — |
| populate | 增加项 | items: array |
| destroy | 摧毁表 | — |
------

41
docs/_book/case/tree/branch_relation.md

@ -1,41 +0,0 @@
# bi.branch_relation
### 表关联树
{% method %}
[source](https://jsfiddle.net/fineui/z5hLcruk/)
{% common %}
```javascript
var tree = BI.createWidget({
type: "bi.branch_relation",
element: 'body',
items: [],
direction: BI.Direction.Right,
align: BI.HorizontalAlign.Right,
centerOffset: -50
});
```
{% endmethod %}
### 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | ------- | ------ | -------------------- |
| centerOffset | 重心偏移量 | number | 0 |
| direction | 根节点所在方向 | string | BI.Direction.Bottom |
| align | 对齐方向 | string | BI.VerticalAlign.Top |
| items | 元素 | array | null |
### 方法
| 方法名 | 说明 | 参数 |
| -------- | ---- | ----------- |
| populate | 去掉所有内容 | items: 子项数组 |
------

44
docs/_book/case/tree/branch_tree.md

@ -1,44 +0,0 @@
# bi.branch_tree
### 横向分支的树
{% method %}
[source](https://jsfiddle.net/fineui/mLq3e170/)
{% common %}
```javascript
BI.createWidget({
type: "bi.branch_tree",
element: 'body',
items: [{
el: {},
children: [{
el: {},
children: {},
// ...
}]
}]
});
```
{% endmethod %}
### 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| -------- | -------------------- | ------ | ---- |
| expander | branch_expander组件配置项 | object | {} |
| el | 基础元素 | object | {} |
| items | 子项 | array | [] |
### 方法
| 方法名 | 说明 | 参数 |
| -------- | ------ | ---- |
| populate | 去掉所有内容 | — |
| getValue | 获取所选项值 | — |
------

33
docs/_book/case/tree/display_tree.md

@ -1,33 +0,0 @@
# bi.display_tree
### 树展示控件
{% method %}
[source](https://jsfiddle.net/fineui/cfL6fpa1/)
{% common %}
```javascript
var tree = BI.createWidget({
type: "bi.display_tree",
element: 'body',
});
tree.initTree({
id: 1,
text: '',
open: true,
});
```
{% endmethod %}
### 方法
| 方法名 | 说明 | 参数 |
| -------- | ------ | ---- |
| initTree | 加载tree结构 | node: 节点数组 settings: 配置项 |
| destroy | 摧毁元素 | — |
------

46
docs/_book/case/tree/handstand_branch_tree.md

@ -1,46 +0,0 @@
# bi.handstand_branch_tree
### 纵向分支的树
{% method %}
[source](https://jsfiddle.net/fineui/c2kaoc7x/)
{% common %}
```javascript
BI.createWidget({
type: "bi.handstand_branch_tree",
element: 'body',
el: {},
items: [{
el: {},
children: [{
el: {},
children: {},
// ...
}]
}]
});
```
{% endmethod %}
### 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| -------- | -------------------- | ------ | ---- |
| expander | branch_expander组件配置项 | object | {} |
| el | 基础元素 | object | {} |
| items | 子项 | array | [] |
### 方法
| 方法名 | 说明 | 参数 |
| -------- | ------ | ---- |
| populate | 去掉所有内容 | — |
| getValue | 获取所选项值 | — |
------

43
docs/_book/case/tree/level_tree.md

@ -1,43 +0,0 @@
# bi.level_tree
### 二级树
{% method %}
[source](https://jsfiddle.net/fineui/nvvkwhfo/)
{% common %}
```javascript
var tree = BI.createWidget({
type: "bi.level_tree",
element: 'body',
items: [],
});
```
{% endmethod %}
### 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| -------- | ----------------- | ------ | ---- |
| expander | branch_expander配置 | object | {} |
| items | 元素 | array | [] |
### 方法
| 方法名 | 说明 | 参数 |
| -------------- | -------- | ----------- |
| initTree | 构造树结构 | nodes |
| stroke | 生成树方法 | nodes |
| populate | 去掉所有内容 | items: 子项数组 |
| setValue | 设置值 | v |
| getValue | 获得值 | — |
| getAllLeaves | 获取所有叶节点 | — |
| getNodeById | 根据Id获取节点 | id |
| getNodeByValue | 根据值获取节点 | id |
------

40
docs/_book/case/tree/simple_tree.md

@ -1,40 +0,0 @@
# bi.simple_tree
### 简单的多选树
{% method %}
[source](https://jsfiddle.net/fineui/5qtobqxb/)
{% common %}
```javascript
var tree = BI.createWidget({
type: "bi.simple_tree",
element: 'body',
});
tree.populate(items);
```
{% endmethod %}
### 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | -------- | -------- | ---------- |
| itemsCreator | items构造器 | function | BI.emptyFn |
| items | 元素 | array | null |
### 方法
| 方法名 | 说明 | 参数 |
| -------- | ---- | ------------------------------ |
| populate | 去掉所有内容 | items: 子项数组 keywords: 关键字标红字符串 |
| setValue | 设置值 | v |
| getValue | 获得值 | — |
| empty | 清空树 | — |
------

44
docs/_book/case/trigger/editor_trigger.md

@ -1,44 +0,0 @@
# bi.editor_trigger
### 文本输入框trigger
{% method %}
[source](https://jsfiddle.net/fineui/8ttm4g1u/)
{% common %}
```javascript
BI.createWidget({
type: "bi.editor_trigger",
element: "body",
});
```
{% endmethod %}
### 参数
| 参数 | 说明 | 类型 | 默认值 |
| ----------------- | ------- | -------- | ---------- |
| validationChecker | 验证函数 | function | BI.emptyFn |
| quitChecker | 退出时验证函数 | function | BI.emptyFn |
| allowBlank | 是否允许为空 | boolean | false |
| watermark | 水印 | string | "" |
| errorText | 错误信息 | string | "" |
| triggerWidth | 触发器宽度 | number | 30 |
### 方法
| 方法名 | 说明 | 参数 |
| -------- | ---- | ----- |
| setValue | 设置值 | value |
| getVlaue | 获得值 | — |
| setText | | text |
------

21
docs/_book/case/trigger/icon_trigger.md

@ -1,21 +0,0 @@
# bi.icon_trigger
### 图标按钮trigger
{% method %}
[source](https://jsfiddle.net/fineui/qs44h1xy/)
{% common %}
```javascript
BI.createWidget({
type: "bi.icon_trigger",
element: "body",
});
```
{% endmethod %}
------

28
docs/_book/case/trigger/text_trigger.md

@ -1,28 +0,0 @@
# bi.text_trigger
### 文本输入框trigger
{% method %}
[source](https://jsfiddle.net/fineui/6pz5pjp6/)
{% common %}
```javascript
BI.createWidget({
type: "bi.editor_trigger",
element: "body",
});
```
{% endmethod %}
### 方法
| 方法名 | 说明 | 参数 |
| -------- | ---- | ----- |
| setValue | 设置值 | value |
| getVlaue | 获得值 | — |
------

68
docs/_book/core/abstract/button_group.md

@ -1,68 +0,0 @@
# bi.button_group
## 一组具有相同属性的元素集合,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/te0nLap1/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.button_group",
chooseType: BI.ButtonGroup.CHOOSE_TYPE_SINGLE,
layouts: [{
type: "bi.vertical"
}],
items: [{
el: {
type: "bi.label",
text: "button_group"
},
height: 50,
}]
})
```
{% endmethod %}
## API
##### 基础属性
###### chooseType可选值为 CHOOSE_TYPE_SINGLE,CHOOSE_TYPE_MULTI,CHOOSE_TYPE_ALL,CHOOSE_TYPE_NONE,CHOOSE_TYPE_DEFAULT
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| behaviors | 自定义列表中item项的行为,如高亮,标红等 |object | — |{ }|
| items | 子组件数组 | array | — | [ ] |
| chooseType | 选择类型 | const | 见上| BI.ButtonGroup.CHOOSE_TYPE_SINGLE |
| layouts | 布局 | array | — | [{type: "bi.center",hgap: 0,vgap: 0}] |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| doBehavior | 自定义列表中item项的行为,如高亮,标红等 | — |
| prependItems | 内部前插入 | items |
| addItems | 内部后插入 | items |
| removeItemAt | 移除指定索引处的item | indexs |
| removeItems | 移除制定元素 | values |
| populate | 刷新列表 | items |
| setNotSelectedValue| 设置未被选中的值 | value,可以是单个值也可以是个数组|
| setEnabledValue | 设置value值可用| value,可以是单个值也可以是个数组 |
| setValue | 设置value值 | value,可以是单个值也可以是个数组 |
| getNotSelectedValue | 获取没有被选中的值 | —|
| getValue | 获取被选中的值 |—|
| getAllButtons | 获取所有button |—|
| getAllLeaves | 获取所有的叶子节点 | —|
| getSelectedButtons | 获取所有被选中的元素 | —|
| getNotSelectedButtons | 获取所有未被选中的元素 | —|
| getIndexByValue | 根据value值获取value在数组中的索引 | value|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
| empty| 清空组件|—|
| destroy| 销毁组件|—|
---

50
docs/_book/core/abstract/button_tree.md

@ -1,50 +0,0 @@
# bi.button_tree
## 一组具有相同属性的元素集合,基类[BI.ButtonGroup](/core/abstract/button_group.md)
{% method %}
[source](https://jsfiddle.net/fineui/pgwpw4n9/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.button_tree",
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
layouts: [{
type: "bi.vertical"
}],
items: [{
type: "bi.label",
text: "0",
value: "label1",
height:50,
vgap:10
}]
})
```
{% endmethod %}
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setNotSelectedValue| 设置未被选中的值 | value,可以是单个值也可以是个数组|
| setEnabledValue | 设置value值可用| value,可以是单个值也可以是个数组 |
| setValue | 设置value值 | value,可以是单个值也可以是个数组 |
| getNotSelectedValue | 获取没有被选中的值 | —|
| getValue | 获取被选中的值 |—|
| getAllButtons | 获取所有button |—|
| getAllLeaves | 获取所有的叶子节点 | —|
| getSelectedButtons | 获取所有被选中的元素 | —|
| getNotSelectedButtons | 获取所有未被选中的元素 | —|
| getIndexByValue | 根据value值获取value在数组中的索引 | value|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
---

71
docs/_book/core/abstract/collection_view.md

@ -1,71 +0,0 @@
# bi.collection_view
## CollectionView,指定行列可以删除看不见的元素 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/cmq0b3v0/)
{% common %}
```javascript
BI.createWidget({
type: "bi.collection_view",
element:"#wrapper",
width: 400,
height: 300,
items: [],
cellSizeAndPositionGetter: function (index) {
return {
x: index % 10 * 50,
y: Math.floor(index / 10) * 50,
width: 50,
height: 50
}
}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| items | 子组件数组 | array | — | [ ] |
| overflowX | 是否显示横向滚动条| boolean | true,false | true |
| overflowY | 是否显示纵向滚动条 | boolean | true,false | true |
| cellSizeAndPositionGetter | 设置每个单元格的位置坐标和宽高 | function|— | — |
| horizontalOverscanSize | 横向超出可视范围区域预加载的数量 | number | — | 0 |
| verticalOverscanSize | 纵向超出可视范围区域预加载的数量 | number | — | 0 |
| width | 行宽,必设 |number| — | — |
| height | 列宽,必设 | number | —| — |
| scrollLeft | 滚动条相对于左边的偏移 | number | — | 0 |
| scrollTop | 滚动条相对于顶部的偏移 | number | — | 0 |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setScrollLeft | 设置滚动条相对于左边的偏移 | scrollLeft|
| setScrollTop | 设置滚动条相对于顶部的偏移 | scrollTop |
| setOverflowX | 设置是否显示横向滚动条 | b |
| setOverflowY | 设置是否显示横向滚动条 | b|
| getScrollLeft | 获取滚动条相对于左边的偏移 | —|
| getScrollTop | 获取滚动条相对于顶部的偏移 | — |
| getMaxScrollLeft | 获取滚动条相对于左边的最大偏移 | — |
| getMaxScrollTop | 获取滚动条相对于顶部的最大偏移 |—|
| restore | 还原列表设置 | — |
| populate | 刷新列表 | items |
## 事件
| 事件 | 说明 | 回调参数 |
| :------ |:------------- |:------------------------|
|BI.CollectionView.EVENT_SCROLL| 滚动时触发的事件 | {scrollLeft: scrollLeft, scrollTop: scrollTop} |
---

84
docs/_book/core/abstract/custom_tree.md

@ -1,84 +0,0 @@
# bi.custom_tree
## 自定义树,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/gesh31xg/)
{% common %}
```javascript
BI.createWidget({
type: "bi.custom_tree",
el: {
type: "bi.button_tree",
chooseType: 0,
layouts: [{
type: "bi.vertical",
hgap: 30
}]
},
items: [{
id: -1,
pId: -2,
value: "根目录",
open: true,
type: "bi.plus_group_node",
height: 25
},
{
id: 1,
pId: -1,
value: "第一级目录1",
type: "bi.plus_group_node",
height: 25
},
{
id: 11,
pId: 1,
value: "第二级文件1",
type: "bi.single_select_item",
height: 25
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| items | 子组件数组 | array | — | [ ] |
| itemsCreator| 子组件构造器 | object | — | { } |
| expander | popup组件 | object | — | {el: {},popup: {type: "bi.custom_tree"}}|
| el | 开启popup元素 | object | — | {type: "bi.button_tree",chooseType: 0,layouts: [{type: "bi.vertical"}]}|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| initTree | 构造树结构 | nodes |
| stroke | 生成树方法 | nodes |
| prependItems | 内部前插入 | items |
| addItems | 内部后插入 | items |
| populate | 刷新列表 | nodes|
| render | 渲染列表 | — |
| setValue | 设置value值 | value,可以是单个值也可以是个数组 |
| getValue | 获取被选中的值 |—|
| getAllButtons | 获取所有button |—|
| getAllLeaves | 获取所有的叶子节点 | —|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
| empty| 清空组件|—|
---

78
docs/_book/core/abstract/grid_view.md

@ -1,78 +0,0 @@
# bi.grid_view
## 可以合并单元格,指定行列可以删除看不见的元素,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/fkntzLq5/)
{% common %}
```javascript
BI.createWidget({
type: "bi.grid_view",
width: 400,
height: 300,
estimatedRowSize: 30,
estimatedColumnSize: 100,
items: [],
scrollTop: 100,
rowHeightGetter: function () {
return 30;
},
columnWidthGetter: function () {
return 100;
}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| items | 子组件数组 | array | — | [ ] |
| overflowX | 是否显示横向滚动条| boolean | true,false | true |
| overflowY | 是否显示纵向滚动条 | boolean | true,false | true |
| overscanColumnCount| 超出可视范围区域预加载多少列 | number|— | 0 |
| overscanRowCount| 超出可视范围区域预加载多少行 | number | — | 0 |
| width | 行宽,必设 |number| — | — |
| height | 列宽,必设 | number | —| — |
| rowHeightGetter| 每格行宽 |number,function | —| function |
| columnWidthGetter| 每格列宽 | number,function |— | function |
| estimatedColumnSize| 预估行宽,columnWidthGetter为function时必设 |number,function |— | function |
| estimatedRowSize | 预估列宽,rowHeightGetter为function时必设 | number,function | —| function |
| scrollLeft | 滚动条相对于左边的偏移 | number | — | 0 |
| scrollTop | 滚动条相对于顶部的偏移 | number | —|0 |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setScrollLeft | 设置滚动条相对于左边的偏移 | scrollLeft|
| setScrollTop | 设置滚动条相对于顶部的偏移 | scrollTop |
| setOverflowX | 设置是否显示横向滚动条 | b |
| setOverflowY | 设置是否显示横向滚动条 | b|
| getScrollLeft | 获取滚动条相对于左边的偏移 | —|
| getScrollTop | 获取滚动条相对于顶部的偏移 | — |
| getMaxScrollLeft | 获取滚动条相对于左边的最大偏移 | — |
| getMaxScrollTop | 获取滚动条相对于顶部的最大偏移 |—|
| setEstimatedColumnSize | 设置列宽 |width|
| setEstimatedRowSize | 设置行宽 | height |
| restore | 还原列表设置 | — |
| populate | 刷新列表 | items |
## 事件
| 事件 | 说明 | 回调参数
| :------ |:------------- |:----------|
|BI.GridView.EVENT_SCROLL| 滚动时触发的事件 | {scrollLeft: scrollLeft, scrollTop: scrollTop} |
---

51
docs/_book/core/abstract/virtual_group.md

@ -1,51 +0,0 @@
# bi.virtual_group
## 优化过的buttonGroup,删除看不见的元素 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/9pd0dct0/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.virtual_group",
width: 500,
height: 300,
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
layouts: [{
type: "bi.vertical"
}, {
type: "bi.center_adapt",
}],
items:[]
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| items | 子组件数组 | array | — | [ ] |
| layouts | 布局 | array | — | [{type: "bi.center",hgap: 0,vgap: 0}] |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setValue | 设置value值 | value,可以是单个值也可以是个数组 |
| getValue | 获取被选中的值 |—|
| prependItems | 内部前插入 | items |
| addItems | 内部后插入 | items |
| populate | 刷新列表 | items |
| render | 渲染列表 | —|
---

52
docs/_book/core/abstract/virtual_list.md

@ -1,52 +0,0 @@
# bi.virtual_list
## 看不见的元素全部删除的list,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/L995LrL9/)
{% common %}
```javascript
BI.createWidget({
type: "bi.virtual_list",
element:"body",
items: BI.map([{value: "xxxx"}], function (i, item) {
return BI.extend({}, item, {
type: "bi.label",
height: 30,
text: (i + 1) + "." + item.text,
});
})
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| items | 子组件数组 | array | — | [ ] |
| blockSize | 滚动加载的个数 | number | — | 10 |
| overscanHeight | 超出可视范围区域的高度 | number | — | 100 |
| scrollTop | 滚动条相对于顶部的偏移 | number | — | 0 |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| render | 渲染列表 | —|
| mounted | 组件挂载 | —|
| restore | 还原列表设置 | — |
| populate | 刷新列表 | items |
| destroyed | 销毁组件 | —|
---

46
docs/_book/core/basic_button.md

@ -1,46 +0,0 @@
# bi.basic_button
## 一般的button父级,基类[BI.Single](/core/single.md)
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| value | 组件value值 | string | —| null|
| stopEvent | 阻止事件 |boolean | true,false | false |
| stopPropagation | 阻止冒泡 | boolean | true,false| false |
| selected | button的选中状态 | boolean | true,false |false |
| once | 点击一次选中有效,再点无效 | boolean | true,false | false|
| forceSelected | 点击即选中, 选中了就不会被取消,与once的区别是forceSelected不影响事件的触发| boolean | true,false| false|
| forceNotSelected | 无论怎么点击都不会被选中 | boolean| true,false | false|
| disableSelected | 使能选中| boolean | true,false| false|
| shadow | 是否显示阴影 | boolean| true,false| false|
| isShadowShowingOnSelected| 选中状态下是否显示阴影|boolean| true,false | false|
| trigger | 被选元素要触发的事件 | string | mousedown, mouseup, click, dblclick, lclick | null|
| handler | 点击事件回调 | function | —| BI.emptyFn |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| bindEvent | 绑定事件| —|
| beforeClick | 点击事件之前 | —|
| doClick | 点击事件 | — |
| handle | 返回该对象 | —|
| hover | hover事件| —|
| dishover | 取消hover事件| —|
|setSelected | 设置选中的文本| b|
| isSelected | 是否被选中| —|
| isOnce | 是否只允许点击一次| —|
| isForceSelected| 判断是否点击即选中| —|
| isForceNotSelected| 判断是否怎么点击都不会被选中|—|
| isDisableSelected| 判断是否让选中|—|
| setText| 设置文本值|—|
| getText| 获取文本值|—|
| empty| 清空组件|—|
| destroy| 销毁组件|—|
---

88
docs/_book/core/combination/bi.combo.md

@ -1,88 +0,0 @@
# bi.combo
## combo,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/wxykkjou/)
{% common %}
```javascript
BI.createWidget({
type: "bi.combo",
element: "body",
adjustLength: 2,
el: {
type: "bi.button",
text: "测试",
height: 25
},
popup: {}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| el | 自定义下拉框trigger | object | — |{ }|
| trigger | 下拉列表的弹出方式 | string | click,hover | "click" |
| adjustLength | 弹出列表和trigger的距离 | number | — | 0 |
| toggle | 切换状态 | boolean | true,false | true |
| direction | 弹出列表和trigger的位置关系 | string | top | bottom | left | right | top,left | top,right | bottom,left | bottom,right | "bottom"|
| isDefaultInit | 是否默认初始化子节点 |boolean | true,false | false |
| destroyWhenHide | 隐藏弹窗层是否销毁 | boolean | true,false | false |
| isNeedAdjustHeight | 是否需要高度调整 | boolean | true,false | true |
| isNeedAdjustWidth | 是否需要宽度调整 | boolean | true,false | true |
| stopEvent | 是否阻止事件 | boolean | true,false | false |
| stopPropagation | 阻止事件冒泡 | boolean | true,false | false |
| adjustXOffset | 调整横向偏移 | number | — | 0 |
| adjustYOffset |调整纵向偏移 | number | — | 0 |
| hideChecker | 是否隐藏弹出层检测 | function | — | —|
| offsetStyle | 弹出层显示位置 | string | left,right,center | "left,right,center"|
| popup | 弹出层 | object | — | { }|
| comboClass | combo类 | string | — | "bi-combo-popup" |
| hoverClass | hover类 | string | — | "bi-combo-hover" |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| adjustWidth | 调整宽度 | —|
| adjustHeight | 调整高度 | —|
| resetListHeight | 重置列表高度 | height |
| resetListWidth | 重置列表宽度 | width |
| populate | 刷新列表 | items |
| setValue |设置combo value值| v |
| getValue | 获取combo value值 | —|
| isViewVisible | 弹窗层是否可见 | —|
| showView | 显示弹出层 | —|
| hideView | 隐藏弹出层 |—|
| getView | 获取弹出层 | —|
| getPopupPosition | 获取弹出层的位置 | —|
| toggle | 开启或者隐藏弹出层 | —|
| destroy | 销毁组件 | —|
## 事件
| 名称 | 说明 |
| :------ |:------------- |
|BI.Combo.EVENT_TRIGGER_CHANGE | trigger发生改变触发 |
|BI.Combo.EVENT_CHANGE | 弹出层点击触发 |
|BI.Combo.EVENT_EXPAND | 下拉框展开触发 |
|BI.Combo.EVENT_COLLAPSE | 下拉框收起触发
|BI.Combo.EVENT_AFTER_INIT | 下拉框初始化后触发 |
|BI.Combo.EVENT_BEFORE_POPUPVIEW | 下拉列表弹出前触发 |
|BI.Combo.EVENT_AFTER_POPUPVIEW | 下拉列表弹出后触发 |
|BI.Combo.EVENT_BEFORE_HIDEVIEW | 下拉列表收起前触发 |
|BI.Combo.EVENT_AFTER_HIDEVIEW | 下拉列表收起后触发 |
---

88
docs/_book/core/combination/bi.expander.md

@ -1,88 +0,0 @@
# bi.expander
## 某个可以展开的节点,基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/2xavqk4k/)
{% common %}
```javascript
BI.createWidget({
type: "bi.expander",
element: "#wrapper",
el: {
type: "bi.icon_text_node",
cls: "pull-right-ha-font",
height: 25,
text: "Expander"
},
popup: {
items: [{
type: "bi.single_select_item",
height: 25,
text: "项目1",
value: 1
}, {
type: "bi.single_select_item",
height: 25,
text: "项目2",
value: 2
}]
}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| el | 自定义下拉框trigger | object | — |{ }|
| trigger | 下拉列表的弹出方式 | string | click,hover | "click" |
| adjustLength | 弹出列表和trigger的距离 | number | — | 0 |
| toggle | 切换状态 | boolean | true,false | true |
| direction | 弹出列表和trigger的位置关系 | string | top | bottom | left | right | top,left | top,right | bottom,left | bottom,right | "bottom"|
| isDefaultInit | 是否默认初始化子节点 |boolean | true,false | false |
| popup | 弹出层 | object | — | { }|
| expanderClass | 展开类 | string | —| "bi-expander-popup" |
| hoverClass | hover类| string | — | "bi-expander-hover" |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| populate | 刷新列表 | items |
| setValue | 设置combo value值| v |
| getValue | 获取combo value值 | —|
| isViewVisible | 弹窗层是否可见 | —|
| showView | 显示弹出层| —|
| hideView | 隐藏弹出层| —|
| getView | 获取弹出层| —|
| getAllLeaves | 获取所有的叶子节点 | —|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
| isExpanded | 节点是否展开 | — |
| destroy | 销毁组件| — |
## 事件
| 名称 | 说明 |
| :------ |:------------- |
|BI.Expander.EVENT_TRIGGER_CHANGE | trigger发生改变触发 |
|BI.Expander.EVENT_CHANGE | 弹出层点击触发 |
|BI.Expander.EVENT_EXPAND | Expander展开触发 |
|BI.Expander.EVENT_COLLAPSE | Expander收起触发
|BI.Expander.EVENT_AFTER_INIT | Expander初始化后触发 |
|BI.Expander.EVENT_BEFORE_POPUPVIEW | 下拉列表弹出前触发 |
|BI.Expander.EVENT_AFTER_POPUPVIEW | 下拉列表弹出后触发 |
|BI.Expander.EVENT_BEFORE_HIDEVIEW | 下拉列表收起前触发 |
|BI.Expander.EVENT_AFTER_HIDEVIEW | 下拉列表收起后触发 |
---

64
docs/_book/core/combination/group_combo.md

@ -1,64 +0,0 @@
# bi.combo_group
## 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/x32ue8xv/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.combo_group",
el: {
type: "bi.icon_text_icon_item",
text: "2010年",
value: 2010,
height: 25,
iconCls: "close-ha-font"
},
children: [{
type: "bi.single_select_item",
height: 25,
text: "一月",
value: 11
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| childern | 子组件 | array | — | [ ] |
| popup | 弹出层 | object | — |{el: {type: "bi.button_tree",chooseType: 0,layouts: [{type: "bi.vertical"}]}}|
| isDefaultInit | 是否默认初始化子节点 |boolean | true,false | false |
| isNeedAdjustHeight | 是否需要高度调整 | boolean | true,false | false |
| isNeedAdjustWidth | 是否需要宽度调整 | boolean | true,false | false |
| el | 自定义下拉框trigger | object | — |{type: "bi.text_button", text: "", value: ""}|
| trigger | 下拉列表的弹出方式 | string | click,hover | "click" |
| adjustLength | 弹出列表和trigger的距离 | number | — | 0 |
| direction | 弹出列表和trigger的位置关系 | string | top | bottom | left | right | top,left | top,right | bottom,left | bottom,right | "bottom"|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| populate | 刷新列表 | items |
| setValue | 设置combo value值| v |
| getValue | 获取combo value值 | — |
---

83
docs/_book/core/combination/loader.md

@ -1,83 +0,0 @@
# bi.loader
## 加载控件,[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/qgLtctnx/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.loader",
itemsCreator: function(options, populate) {
populate(BI.map(BI.map(BI.makeArray(3, null), function(idx, value){
return {
text: faker.name.findName(),
value: BI.UUID()
};
}), function(i, v) {
return BI.extend(v, {
type: "bi.single_select_item",
height: 25
})
}))
},
hasNext: function(option) {
return option.count < 10;
}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| direction | combo弹出层位置 | string | top,bottom,left,right,(top,left),(top,right),(bottom,left),(bottom,right) | "top"|
| isDefaultInit | 是否默认初始化子数据 |boolean | true,false | true |
| logic | 布局逻辑 | object | —| {dynamic:true,scrolly:true} |
| items| 子组件 | array | — | []|
| itemsCreator | 子组件构造器 | function | — | — |
| onLoaded | 加载中 | function | — | — |
| count | 是否显示总页数 | boolean| true,false|boolean|
| prev | 上一页 | boolean | true,false | boolean |
| next | 下一页 | boolean | true,false | boolean |
| hasPrev | 判断是否有上一页 | function | — | — |
| hasNext | 判断是否有下一页 | function | — | — |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| hasNext | 判断是否有下一页 | — |
| prependItems | 内部前插入 | items |
| addItems | 内部后插入 | items |
| populate | 刷新列表 | items |
| setNotSelectedValue| 设置未被选中的值 | value,可以是单个值也可以是个数组|
| setValue | 设置value值 | value,可以是单个值也可以是个数组 |
| getNotSelectedValue | 获取没有被选中的值 | —|
| getValue | 获取被选中的值 |—|
| getAllButtons | 获取所有button |—|
| getAllLeaves | 获取所有的叶子节点 | —|
| getSelectedButtons | 获取所有被选中的元素 | —|
| getNotSelectedButtons | 获取所有未被选中的元素 | —|
| getIndexByValue | 根据value值获取value在数组中的索引 | value|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
| empty| 清空组件|—|
| destroy| 销毁组件|—|
---

78
docs/_book/core/combination/navigation.md

@ -1,78 +0,0 @@
# bi.navigation
## 导航栏控件,[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/ubsren48/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.navigation",
tab: {
height: 30,
items: [{
once: false,
text: "后退",
value: -1
}, {
once: false,
text: "前进",
value: 1
}]
},
cardCreator: function(v) {
return BI.createWidget({
type: "bi.label",
cls: "layout-bg" + BI.random(1, 8),
text: "第" + v + "页"
})
}
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| direction | 控件位置 | string | top,bottom,left,right,custom | "bottom"|
| single | 是否为单页 | boolean | true,false | true |
| defaultShowIndex | 是否默认显示 |boolean | true,false | true |
| tab | tab页元素 | boolean | true,false | true |
| logic | 布局逻辑 | object | — | {dynamic:true} |
| cardCreator | 面板构造器 | function | — | v |
| afterCardCreated | 面板构造之后 | function | — | — |
| afterCardShow | 面板显示之后 | function | —| — |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| render | 渲染组件 | — |
| mounted | 挂载组件 | —|
| afterCardCreated | 创建卡导航页页之后 | v |
| afterCardShow | 导航页展示之后 | v |
| setSelect | 设置选中的index | v |
| getSelect | 获取选中的index| —|
| getSelectedCard | 获取选中的导航页| —|
| populate | 刷新列表 | items |
| setValue | 设置value值 | value |
| getValue | 获取被选中的值 |—|
| empty| 清空组件|—|
| destroy| 销毁组件|—|
---

102
docs/_book/core/combination/searcher.md

@ -1,102 +0,0 @@
# bi.searcher
## 搜索逻辑控件,[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/k6s24et1/)
{% common %}
```javascript
BI.createWidget({
type: "bi.searcher",
element:"#wrapper",
adapter: {
getItems: function () {
return [{
type: "bi.label",
value: "张三"
}]
}
},
popup: {
type: "bi.button_group",
cls: "bi-border",
items: items,
layouts: [{
type: "bi.vertical"
}],
},
masker: false
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| hgap | 效果相当于容器左右padding值 | number | —| 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | —| 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | —| 0 |
| bgap | 效果相当于容器bottom-padding值 | number | —| 0 |
| chooseType | 选择类型 | const | | CHOOSE_TYPE_SINGLE |
| isDefaultInit | 是否默认初始化子节点 |boolean | true,false | false |
| isAutoSearch | 是否自动搜索 |boolean | true,false | true |
| isAutoSync | 是否自动同步数据, 即是否保持搜索面板和adapter面板状态值的统一 |boolean | true,false | true |
| onSearch | isAutoSearch为false时启用 | function(op.callback) | — | —|
| el | 开启弹出层的元素 | object | — | {type: "bi.search_editor"}|
| popup | 弹出层 | object | — |{type: "bi.searcher_view"}|
| adapter | 弹出层显示的位置元素 | object | —| null|
| masker | masker层 | object | — | {offset: {}}|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| populate | 刷新列表 | result, searchResult, keyword |
| setValue | 设置value值 | value |
| getValue | 获取被选中的值 |—|
| empty| 清空组件|—|
| destroy| 销毁组件|—|
| adapter | 搜索列表位置 | — |
| doSearch | 开始搜索 | — |
| stopSearch | 停止搜索 | —|
| isSearching | 是否正在搜索 | —|
| isViewVisible | 组件是否可见 | —|
| getView | 获取搜索列表栏 | —|
| hasMatched | 是否匹配 | —|
| adjustHeight | 调整高度 | —|
| adjustView| 调整搜索列表栏| —|
| getKeyword | 获取搜索关键词| —|
| getKeywords | 获取搜索关键词数组| —|
## 事件方法
| 事件名称| 说明| 回调参数 |
| :------ |:------------- | :-----
| EVENT_START | 开始搜索 | —|
| EVENT_STOP | 停止搜索 | —|
| EVENT_PAUSE | 暂停搜索 | —|
| EVENT_SEARCHING | 搜索中| —|
| EVENT_AFTER_INIT | 初始化之后 | —|
## 事件
| 事件 | 说明 |
| :------ |:------------- |
|BI.Searcher.EVENT_CHANGE | 搜索结果面板发生改变触发 |
|BI.Searcher.EVENT_START | 开始搜索触发 |
|BI.Searcher.EVENT_STOP | 停止搜索触发(搜索框为空) |
|BI.Searcher.EVENT_PAUSE | 搜索暂停触发(搜索文本以空白字符结尾) |
|BI.Searcher.EVENT_SEARCHING | 正在搜索时触发 |
|BI.Searcher.EVENT_AFTER_INIT | 搜索结果面板初始化完成后触发 |
---

83
docs/_book/core/combination/switcher.md

@ -1,83 +0,0 @@
# bi.switcher
## 切换显示或隐藏面板,[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/4sj60ap0/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.switcher",
el: {
type: "bi.button",
height: 25,
text: "Switcher"
},
popup: {
},
adapter: {
}
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| trigger | 下拉列表的弹出方式 | string | click,hover | "click" |
| toggle | 切换状态 | boolean | true,false | true |
| direction | 面板显示的位置 | string | — | BI.Direction.Top |
| el | 自定义下拉框trigger | object | — | { }|
| popup | 弹出层 | object | — |{ }|
| adapter | 弹出层的位置 | object | — | null|
| masker | masker层 | obejct | — | { }|
| switcherClass | 切换类 | string| —| "bi-switcher-popup" |
| hoverClass | hover类 | string | — | "bi-switcher-hover" |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| setValue | 设置value值 | value |
| getValue | 获取被选中的值 |—|
| empty| 清空组件|—|
| destroy| 销毁组件|—|
| populate | 刷新列表 | items |
| isViewVisible | 弹窗层是否可见 | —|
| showView | 显示弹出层 | —|
| hideView | 隐藏弹出层|—|
| getView | 获取弹出层|—|
| getAllLeaves | 获取所有的叶子节点 | —|
| getNodeById | 根据id获取节点 | id |
| getNodeByValue | 根据value值获取节点 | value |
| isExpanded | 节点是否展开 |— |
| setAdapter | 设置弹出层显示的位置元素|adapter|
| adjustView| 调整弹出层显示的位置元素 |—|
## 事件方法
| 事件名称| 说明| 回调参数 |
| :------ |:------------- | :-----
| EVENT_EXPAND | 面板展开 | —|
| EVENT_COLLAPSE | 面板收起 | —|
| EVENT_TRIGGER_CHANGE | 面板切换 | —|
| EVENT_AFTER_INIT | 初始化之后 | —|
| EVENT_BEFORE_POPUPVIEW | 面板显示之前| —|
| EVENT_AFTER_POPUPVIEW | 面板显示之后| —|
| EVENT_BEFORE_HIDEVIEW | 面板隐藏之前| —|
| EVENT_AFTER_HIDEVIEW | 面板隐藏之后 | —|
---

84
docs/_book/core/combination/tab.md

@ -1,84 +0,0 @@
# bi.switcher
## 切换显示或隐藏面板,[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/pdo5s8pq/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.tab",
tab: {
type: "bi.button_group",
height: 30,
items: [{
text: "Tab1",
value: 1,
width: 50
}, {
text: "Tab2",
value: 2,
width: 50
}]
},
cardCreator: function(v) {
switch (v) {
case 1:
return BI.createWidget({
type: "bi.label",
cls: "bi-card",
text: "面板1"
})
case 2:
return BI.createWidget({
type: "bi.label",
cls: "bi-card",
text: "面板2"
})
}
}
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| direction | 控件位置 | string | top,bottom,left,right,custom | "bottom"|
| single | 是否为单页 | boolean | true,false | false |
| defaultShowIndex | 是否默认显示tab页 | boolean | true,false | false |
| tab | tab标签页 | object | — | { } |
| logic | 布局逻辑 | object | — | {dynamic:false} |
| cardCreator | 面板构造器| function | — | function (v) {return BI.createWidget();} |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| render | 渲染组件 | — |
| mounted | 挂载组件 | —|
| removeTab | 移除tab面板页 | cardname |
| getTab | 获取tab面板页 | v |
| setSelect | 设置选中的index | v |
| getSelect | 获取选中的index| —|
| getSelectedTab | 获取选中的tab面板页 | —|
| populate | 刷新列表 | items |
| setValue | 设置value值 | value |
| getValue | 获取被选中的值 |—|
| empty| 清空组件|—|
| destroy| 销毁组件|—|
---

63
docs/_book/core/layer/layer_float_box.md

@ -1,63 +0,0 @@
# bi.float_box
## floatBox弹出层,[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/72gp1n0p/)
{% common %}
```javascript
var id = BI.UUID();
BI.createWidget({
element: "#wrapper",
type: "bi.text_button",
text: "点击弹出FloatBox",
width: 200,
height: 80,
handler: function() {
BI.Popovers.remove(id);
BI.Popovers.create(id, new BI.BarPopoverSection()).open(id);
}
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| width | 弹出层宽度 | number | — | 600 |
| height | 弹出层高度 | number | — | 500 |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| populate | 刷新列表 | sectionProvider |
| destroyed| 销毁组件|—|
| show | 显示 | —|
| hide | 隐藏 | —|
| open | 打开弹出层 | —|
| close| 关闭弹出层 | —|
| setZindex | 设置z-index| z-index |
## 事件方法
| 事件名称| 说明| 回调参数 |
| :------ |:------------- | :-----
| EVENT_FLOAT_BOX_CLOSED | 关闭弹出层 | —|
| EVENT_FLOAT_BOX_CLOSED | 打开弹出层 | —|
---

76
docs/_book/core/layer/layer_popup.md

@ -1,76 +0,0 @@
# bi.popup_view
## 下拉框弹出层, zIndex在1000w,[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/x95pg143/)
{% common %}
```javascript
BI.createWidget({
element: "#wrapper",
type: "bi.popup_view",
el: {
type: "bi.button_group",
items: [{
text: "aaa",
value: "aaa"
}, {
text: "bbb",
value: "bbb"
}],
layouts: [{
type: "bi.vertical"
}]
}
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| maxWidth | 弹出层最大宽度 | number/string | — | "auto" |
| minWidth | 弹出层最小宽度 | number | — | 100 |
| maxHeight | 弹出层最大高度 | number/string | — | — |
| minHeight | 弹出层最小高度 | number | — | 25 |
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | —| 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | —| 0 |
| tgap | 效果相当于容器top-padding值 | number | —| 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| direction| 工具栏的方向| const | 参考button_group | BI.Direction.Top |
| stopEvent | 是否停止mousedown、mouseup事件 | boolean | true,false | false |
| stopPropagation | 是否停止mousedown、mouseup向上冒泡 | boolean | true,false | false |
| tabs | 导航栏 | array | — | [] |
| logic | 布局逻辑| object | — | {dynamic:true} |
| tools | 自定义工具栏 |boolean | true,false | false |
| buttons | toolbar栏 | array | — | [] |
| el | 子组件 | object | — |{ type: "bi.button_group",items: [], chooseType: 0,behaviors: {},layouts: [{type: "bi.vertical"}]} |
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| populate | 刷新列表 | items |
| resetWidth | 重置宽度 | width |
| resetHeight | 重置高度 | height|
| setValue | 设置value 值 | value |
| getValue| 获取value值 | —|
| setZindex | 设置z-index| z-index |
| getView | 获取弹出层 | —|
---

54
docs/_book/core/layer/layer_searcher.md

@ -1,54 +0,0 @@
# bi.searcher_view
## 搜索面板, 基类[BI.Widget](/core/widget.md)
{% method %}
[source](https://jsfiddle.net/fineui/qkfns6wm/)
{% common %}
```javascript
var searcher = BI.createWidget({
element: "#wrapper",
type: "bi.searcher_view",
});
searcher.populate([{
text: "aba",
value: "aba"
},{
text: "acc",
value: "acc"
}], [{
text: "a",
value: "a"
}], "a");
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :-----| :----|:----
| tipText | title文本 | string | — | BI.i18nText("BI-No_Select") |
| chooseType | 选择类型 | const | 参考button_group | BI.Selection.Single |
| matcher | 完全匹配的构造器 | object | — | {type: "bi.button_group",behaviors: { redmark: function () { return true;} },items: [], layouts: [{ type: "bi.vertical"}]} |
| searcher | 搜索到的元素 | object| — | {type: "bi.button_group",behaviors: {redmark: function () {return true;}}, items: [], layouts: [{ type: "bi.vertical" }]}|
## 对外方法
| 名称 | 说明 | 回调参数
| :------ |:------------- | :-----
| populate | 刷新列表 | searchResult, matchResult, keyword |
| setValue | 设置value 值 | value |
| getValue| 获取value值 | —|
| empty | 清空组件 | —|
| hasMatched | 是否有匹配的元素 | —|
---

54
docs/_book/core/layout/border.md

@ -1,54 +0,0 @@
# bi.border
#### 上下的高度固定/左右的宽度固定,中间的高度/宽度自适应
{% method %}
[source](https://jsfiddle.net/fineui/qtdsdegp/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.border',
element: "#wrapper",
items: {
north: {
el: {type: "bi.label"},
height: 30,
top: 20,
left: 20,
right: 20
},
south: {
el: {type: "bi.label"},
height: 50,
bottom: 20,
left: 20,
right: 20
},
west: {
el: {type: "bi.label"},
width: 200,
left: 20
},
east: {
el: {type: "bi.label"},
width: 300,
right: 20
},
center: {el: {type: "bi.label"}}
}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| items | 子控件对象 | object | north,east,west,south,center | [ ] |
---

47
docs/_book/core/layout/center.md

@ -1,47 +0,0 @@
# bi.center
#### 水平和垂直方向都居中容器, 非自适应,用于宽度高度固定的面板
{% method %}
[source](https://jsfiddle.net/fineui/8fd2nvkm/)
{% common %}
```javascript
BI.createWidget({
type: "bi.center",
element: "#wrapper",
items: [{
type: "bi.label",
text: "Center 1,这里虽然设置label的高度30,但是最终影响高度的是center布局",
cls: "layout-bg1",
whiteSpace: "normal"
},{
type: "bi.label",
text: "Center 2,为了演示label是占满整个的,用了一个whiteSpace:normal",
cls: "layout-bg2",
whiteSpace: "normal"
}],
hgap: 20,
vgap: 20
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
---

47
docs/_book/core/layout/center_adapt.md

@ -1,47 +0,0 @@
# bi.center_adapt
#### 自适应左右垂直居中布局
{% method %}
[source](https://jsfiddle.net/fineui/7bsxw7u5/)
{% common %}
```javascript
BI.createWidget({
type: "bi.center_adapt",
element: "#wrapper",
hgap: 10,
items: [{
type: "bi.label",
text: "Center Adapt 1",
cls: "layout-bg1",
height: 30
}, {
type: "bi.label",
text: "Center Adapt 2",
cls: "layout-bg2",
height: 30
}]
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| columnSize | 每列宽度所组成的数组 | array | — | [ ] |
---

48
docs/_book/core/layout/float_center.md

@ -1,48 +0,0 @@
# bi.float_center
#### 浮动布局实现的居中容器
{% method %}
[source](https://jsfiddle.net/fineui/1vgn555m/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.float_center',
element: "#wrapper",
items: [{
type: "bi.label",
text: "floatCenter与center的不同在于,它可以控制最小宽度和最大宽度",
cls: "layout-bg1",
whiteSpace: "normal"
}, {
type: "bi.label",
text: "floatCenter与center的不同在于,它可以控制最小宽度和最大宽度",
cls: "layout-bg2",
whiteSpace: "normal"
}],
height: 300,
hgap: 20,
vgap: 20
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
---

75
docs/_book/core/layout/flow.md

@ -1,75 +0,0 @@
# bi.flow
#### 靠左/右对齐的自由浮动布局
{% method %}
[source](https://jsfiddle.net/fineui/c761a856/)
{% common %}
```javascript
BI.createWidget({
type: "bi.center_adapt",
element: "#wrapper",
items: [{
type: "bi.left",
items: [{
type: "bi.label",
height: 30,
text: "Left-1",
cls: "layout-bg1",
hgap: 20
}, {
type: "bi.label",
height: 30,
text: "Left-2",
cls: "layout-bg2",
hgap: 20
}],
hgap: 20,
vgap: 20
}, {
type: "bi.right",
items: [{
type: "bi.label",
height: 30,
text: "Right-1",
cls: "layout-bg3",
hgap: 20
}, {
type: "bi.label",
height: 30,
text: "Right-2",
cls: "layout-bg4",
hgap: 20
}],
hgap: 20,
vgap: 20
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| items | 子控件数组 | array | — | — |
---

71
docs/_book/core/layout/grid.md

@ -1,71 +0,0 @@
# bi.grid
#### 网格布局
{% method %}
[source](https://jsfiddle.net/fineui/1gwjbpL6/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.grid',
element: "#wrapper",
columns: 2,
rows: 2,
items: [{
column: 0,
row: 0,
el: {
type: "bi.label",
text: "column-0, row-0",
cls: "layout-bg1"
}
}, {
column: 1,
row: 0,
el: {
type: "bi.label",
text: "column-1, row-0",
cls: "layout-bg2"
}
} {
column: 0,
row: 1,
el: {
type: "bi.label",
text: "column-0, row-1",
cls: "layout-bg5"
}
}, {
column: 1,
row: 1,
el: {
type: "bi.label",
text: "column-1, row-1",
cls: "layout-bg6"
}
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| columns | 列数 | number | — | null |
| rows | 行数 | number | — | null |
| items | 子控件数组 | array | — | [] |
---

51
docs/_book/core/layout/horizontal.md

@ -1,51 +0,0 @@
# bi.horizontal
#### 水平流式布局
{% method %}
[source](https://jsfiddle.net/fineui/oj7y7q3o/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.horizontal',
element: "#wrapper",
items: [{
type: "bi.text_button",
cls: "layout-bg1",
text: "这里设置了lgap,rgap,tgap,bgap",
height: 30,
width: 200
}, {
type: "bi.text_button",
cls: "layout-bg2",
text: "这里设置了lgap,rgap,tgap,bgap",
height: 30,
width: 200
}]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| columnSize | 每列宽度所组成的数组 | array | — | [ ] |
| verticalAlign | 元素的垂直对齐方式 | string | 参考相关css属性 | "middle" |
| scrollx | 设置水平方向是否有滚动条 | boolean | true,false | true |
---

52
docs/_book/core/layout/horizontal_adapt.md

@ -1,52 +0,0 @@
# bi.horizontal_adapt
#### 自适应左右居中布局
{% method %}
[source](https://jsfiddle.net/fineui/Lgobog42/)
{% common %}
```javascript
BI.createWidget({
type: "bi.horizontal_adapt",
element: "#wrapper",
vgap: 10,
items: [{
type: "bi.label",
text: "Horizontal Adapt左右自适应",
cls: "layout-bg1",
width: 300,
height: 30
}, {
type: "bi.label",
text: "Horizontal Adapt左右自适应",
cls: "layout-bg2",
//width: 300,
height: 30
}]
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| columnSize | 每列宽度所组成的数组 | array | — | [ ] |
| verticalAlign | 元素的垂直对齐方式 | const | 参考相关css属性 | BI.VerticalAlign.Middle |
---

49
docs/_book/core/layout/horizontal_auto.md

@ -1,49 +0,0 @@
# bi.horizontal_auto
#### 水平方向居中自适应容器
{% method %}
[source](https://jsfiddle.net/fineui/ej2j8umg/)
{% common %}
```javascript
BI.createWidget({
type: "bi.horizontal_auto",
element: "#wrapper",
vgap: 10,
items: [{
type: "bi.label",
text: "Horizontal Auto左右自适应",
cls: "layout-bg1",
width: 300,
height: 30
}, {
type: "bi.label",
text: "Horizontal Auto左右自适应",
cls: "layout-bg2",
width: 300,
height: 30
}]
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
---

44
docs/_book/core/layout/horizontal_float.md

@ -1,44 +0,0 @@
# bi.horizontal_float
#### 浮动的水平居中布局
{% method %}
[source](https://jsfiddle.net/fineui/91rd0zpe/)
{% common %}
```javascript
BI.createWidget({
type: "bi.horizontal_float",
element: "#wrapper",
vgap: 10,
items: [{
type: "bi.label",
text: "Horizontal Float左右自适应",
cls: "layout-bg1",
width: 200,
height:30
}]
})
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number | — | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | — | 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| items | 子控件数组 | array | — |[ ] |
---

64
docs/_book/core/layout/htape.md

@ -1,64 +0,0 @@
# bi.htape
#### 水平tape布局,两列定宽,一列自适应
{% method %}
[source](https://jsfiddle.net/fineui/ry7Lnhgw/)
{% common %}
```javascript
BI.createWidget({
type: "bi.htape",
element: "#wrapper",
items : [
{
width: 100,
el : {
type : 'bi.label',
text : '1',
cls: "layout-bg1"
}
}, {
width: 200,
el : {
type : 'bi.label',
text : '2',
cls: "layout-bg2"
}
}, {
width: 'fill',
el : {
type : 'bi.label',
text : '3',
cls: "layout-bg3"
}
}
]
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| hgap | 效果相当于容器左右padding值 | number | — | 0 |
| vgap | 效果相当于容器上下padding值 | number | — | 0 |
| lgap | 效果相当于容器left-padding值 | number |— | 0 |
| rgap | 效果相当于容器right-padding值 | number | — | 0 |
| tgap | 效果相当于容器top-padding值 | number | —| 0 |
| bgap | 效果相当于容器bottom-padding值 | number | — | 0 |
| items | 子控件数组 | array | — | [{width: 100,el: {type: 'bi.button', text: 'button1'}},{width: 'fill',el: {type: 'bi.button', text: 'button2'}},{width: 200,el: {type: 'bi.button', text: 'button3'}}] |
---

55
docs/_book/core/layout/left_right_vertical_adapt.md

@ -1,55 +0,0 @@
# bi.left_right_vertical_adapt
#### 左右分离,垂直方向居中容器
{% method %}
[source](https://jsfiddle.net/fineui/2udhep9z/)
{% common %}
```javascript
BI.createWidget({
type: 'bi.left_right_vertical_adapt',
element: "#wrapper",
lhgap: 10,
rhgap: 10,
items: {
left: [{
type: "bi.label",
text: "左边的垂直居中",
cls: "layout-bg1",
width: 100,
height: 30
}],
right: [{
type: "bi.label",
text: "右边的垂直居中",
cls: "layout-bg1",
width: 100,
height: 30
}]
}
});
```
{% endmethod %}
## API
##### 基础属性
| 参数 | 说明 | 类型 | 可选值 | 默认值
| :------ |:------------- | :----- | :----|:----
| lhgap | 左边容器左右padding值 | number | — | 0 |
| lrgap | 左边容器right-padding值 | number | — | 0 |
| llgap | 左边容器left-padding值 | number | — | 0 |
| rhgap | 右边容器左右padding值 | number | — | 0 |
| rrgap | 右边容器right-padding值 | number | — | 0 |
| rhgap | 右边容器left-padding值 | number | — | 0 |
| items | 子控件数组 | array | — | [ ] |
---

37
docs/_book/core/layout/table.md

@ -1,37 +0,0 @@
# bi.table
### table作为一个列表集合存在,继承BI.Widget
{% method %}
[source](https://jsfiddle.net/fineui/8t2en619/)
{% common %}
```javascript
BI.createWidget({
element: "body",
type: "bi.table",
items: [],
columnSize: [100, "fill", 200],
rowSize: [10, 30, 50, 70, 90, 110, 130],
hgap: 20,
vgap: 10
});
```
{% endmethod %}
## 参数设置
| 参数 | 说明 | 类型 | 默认值 |
| ---------- | --------- | ------------ | ---------------------------------------- |
| scrolly | 是否出现滚动条 | boolean | true |
| columnSize | 列项宽度 | array/number | [200, 200, 'fill'] |
| rowSize | 行高 | array/number | 30 |
| hgap | 内部元素间纵向距离 | number | 0 |
| vgap | 内部元素间横向距离 | number | 0 |
| items | 子项 | array | [{width: 100,el: {type: 'bi.button', text: 'button1'}},{width: 'fill',el: {type: 'bi.button', text: 'button2'}},{width: 200,el: {type: 'bi.button', text: 'button3'}}] |
## 方法
| 方法名 | 说明 | 用法 |
| :------- | ------ | ---------------- |
| addItem | 增加内容 | addItem(arr) |
| populate | 更换新的内容 | poplulate(items) |

38
docs/_book/core/layout/td.md

@ -1,38 +0,0 @@
# bi.td
### 单元格控件,继承BI.Layout
{% method %}
[source](https://jsfiddle.net/fineui/v4jrz6a3/)
{% common %}
```javascript
BI.createWidget({
type: "bi.td",
element: 'body',
columnSize: [20, 20, 'fill'],
items: []
});
```
{% endmethod %}
##参数
| 参数 | 说明 | 类型 | 默认值 |
| ---------- | ---- | ------ | ---------------------------------------- |
| columnSize | 列宽 | array | [200, 200, 200] |
| hgap | 纵向间隙 | number | 0 |
| vgap | 横向间隙 | number | 0 |
| items | 内容项 | array | [[{el: {text: 'label1'}},{ el: {text: 'label2'},{ el: {text: 'label3'} |
## 方法
| 方法名 | 说明 | 用法 |
| -------- | ------ | ---------------- |
| addItem | 增加内容 | addItem(arr) |
| populate | 更换新的内容 | poplulate(items) |

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save