docs: add theme & style docs

This commit is contained in:
Rui-Sun 2024-03-29 17:18:41 +08:00
parent d96fabe9c3
commit b99b2d2f5d
12 changed files with 32 additions and 16 deletions

View File

@ -24,6 +24,7 @@ VTable supports setting various styles for text type data. The following are the
- `underlineOffset`: The distance between underline and text.
- `lineThrough`: Set the dash for the cell text content.
- `textStick`: Set whether the text of the cell has an adsorption effect \[The text can dynamically adjust the position when scrolling]
- `textStickBaseOnAlign`: When the cell text has an adsorption effect [the text can dynamically adjust its position when scrolling], the basis for adsorption is the horizontal alignment of the cell. For example, when `textStickBaseOnAlign` is `true` and `textAlign` is `'center'`, the text will be adsorbed to the horizontal center of the cell; otherwise, it will be adsorbed to the left or right edge of the cell (depending on the scroll position)
- `autoWrapText`: Sets whether cells wrap themselves.
- `lineClamp`: Set the maximum number of rows in a cell, you can set number or'auto ', if set to'auto', it will be automatically calculated

View File

@ -114,6 +114,7 @@ Contains the following configuration items:
### Text adsorption effect
`textStick`: Set whether the text of the cell has an adsorption fruit \[Dynamically adjust the position of the cell content when scrolling]
`textStickBaseOnAlign`: When the cell text has an adsorption effect [the text can dynamically adjust its position when scrolling], the basis for adsorption is the horizontal alignment of the cell. For example, when `textStickBaseOnAlign` is `true` and `textAlign` is `'center'`, the text will be adsorbed to the horizontal center of the cell; otherwise, it will be adsorbed to the left or right edge of the cell (depending on the scroll position) )
### Cell Tag

View File

@ -24,6 +24,7 @@ VTable 支持为文本类型数据设置多样化的样式,以下为文本类
- `underlineOffset`:下划线与文字的间隔距离。
- `lineThrough`:为单元格文本内容设置中划线。
- `textStick`:设置单元格的文本是否带有吸附效果【当滚动时文本可动态调整位置】
- `textStickBaseOnAlign`:当单元格的文本有吸附效果【当滚动时文本可动态调整位置】时,吸附的基准是单元格的水平对齐方式。例如当`textStickBaseOnAlign`为`true`时,`textAlign`为`'center'`时,文本会吸附在单元格的水平中心位置;否则就会吸附在单元格左边缘或右边缘(依据滚动位置决定)
- `autoWrapText`:设置单元格是否自动换行。
- `lineClamp`:设置单元格的最大行数, 可设置 number 或者'auto',如果设置为'auto', 则会自动计算

View File

@ -114,6 +114,7 @@ style 提供了一系列的单元格配置式,简要介绍如下。
### 文本吸附效果
`textStick`:设置元格的文本是否带有吸附果【当滚动时可动态调整单元格内容位置】
`textStickBaseOnAlign`:当单元格的文本有吸附效果【当滚动时文本可动态调整位置】时,吸附的基准是单元格的水平对齐方式。例如当`textStickBaseOnAlign`为`true`时,`textAlign`为`'center'`时,文本会吸附在单元格的水平中心位置;否则就会吸附在单元格左边缘或右边缘(依据滚动位置决定)
### 单元格标记

View File

@ -13,17 +13,17 @@ Specify the column type as 'progressbar', cellType can be omitted and defaults t
isProgressbar = true
) }}
##${prefix} min(number) = 0
##${prefix} min(number|Function) = 0
**Configuration item exclusive to progressbar type**
The minimum value of the progress bar display range
The minimum value of the progress bar display range, support dynamic acquisition through functions
##${prefix} max(number) = 100
##${prefix} max(number|Function) = 100
**Configuration item exclusive to progressbar type**
The maximum value of the progress bar display range
The maximum value of the progress bar display range, support dynamic acquisition through functions
##${prefix} barType(string) = 'default'

View File

@ -113,6 +113,9 @@ Mouse cursor style when hovering over the cell
#${prefix} textStick(boolean)
Set whether the text in the cell has a sticking effect 【Text can dynamically adjust its position when scrolling】
#${prefix} textStickBaseOnAlign(boolean)
When the cell text has an adsorption effect [the text can dynamically adjust its position when scrolling], the basis for adsorption is the horizontal alignment of the cell. For example, when `textStickBaseOnAlign` is `true` and `textAlign` is `'center'`, the text will be adsorbed to the horizontal center of the cell; otherwise, it will be adsorbed to the left or right edge of the cell (depending on the scroll position)
#${prefix} marked(MarkedPropertyDefine)
Set whether the cell has a marked style
{{ use: common-marked(

View File

@ -54,6 +54,9 @@ Or you can directly define a custom theme:
#${prefix} underlayBackgroundColor(string)
The color filled in the canvas outside the table drawing area
#${prefix} cellInnerBorder(boolean)
Whether the cell draws an inner border. If true, the border of the border cell close to the border will be hidden.
#${prefix} bodyStyle(Object)
Body cell style configuration

View File

@ -13,17 +13,17 @@ Specify the column type as 'progressbar', cellType can be omitted with the defau
isProgressbar = true,
) }}
##${prefix} min(number) = 0
##${prefix} min(number|Function) = 0
**progressbar type exclusive configuration item**
The minimum data for the progress bar display range
The minimum data for the progress bar display range, support dynamic acquisition through functions
##${prefix} max(number) = 100
##${prefix} max(number|Function) = 100
**progressbar type exclusive configuration item**
The maximum data for the progress bar display range
The maximum data for the progress bar display range, support dynamic acquisition through functions
##${prefix} barType(string) = 'default'

View File

@ -13,17 +13,17 @@
isProgressbar = true
) }}
##${prefix} min(number) = 0
##${prefix} min(number|Function) = 0
**progressbar 类型专属配置项**
进度条展示范围的最最小数据
进度条展示范围的最最小数据,支持通过函数动态获取
##${prefix} max(number) = 100
##${prefix} max(number|Function) = 100
**progressbar 类型专属配置项**
进度条展示范围的最最小数据
进度条展示范围的最最小数据,支持通过函数动态获取
##${prefix} barType(string) = 'default'

View File

@ -114,6 +114,9 @@
#${prefix} textStick(boolean)
设置单元格的文本是否带有吸附效果【当滚动时文本可动态调整位置】
#${prefix} textStickBaseOnAlign(boolean)
当单元格的文本有吸附效果【当滚动时文本可动态调整位置】时,吸附的基准是单元格的水平对齐方式。例如当`textStickBaseOnAlign`为`true`时,`textAlign`为`'center'`时,文本会吸附在单元格的水平中心位置;否则就会吸附在单元格左边缘或右边缘(依据滚动位置决定)。
#${prefix} marked(MarkedPropertyDefine)
设置单元格是否有标记样式
{{ use: common-marked(

View File

@ -54,6 +54,9 @@ VTable.themes.ARCO.extend({
#${prefix} underlayBackgroundColor(string)
表格绘制范围外的canvas上填充的颜色
#${prefix} cellInnerBorder(boolean)
单元格是否绘制内边框如果为true边界单元格靠近边界的边框会被隐藏
#${prefix} bodyStyle(Object)
body单元格的样式配置

View File

@ -13,17 +13,17 @@
isProgressbar = true,
) }}
##${prefix} min(number) = 0
##${prefix} min(number|Function) = 0
**progressbar 类型专属配置项**
进度条展示范围的最最小数据
进度条展示范围的最最小数据,支持通过函数动态获取
##${prefix} max(number) = 100
##${prefix} max(number|Function) = 100
**progressbar 类型专属配置项**
进度条展示范围的最最小数据
进度条展示范围的最最小数据,支持通过函数动态获取
##${prefix} barType(string) = 'default'