Skip to content

Commit

Permalink
update docs
Browse files Browse the repository at this point in the history
  • Loading branch information
xianjimli committed Jan 17, 2019
1 parent d7d0953 commit 96c943f
Show file tree
Hide file tree
Showing 21 changed files with 1,487 additions and 996 deletions.
4 changes: 4 additions & 0 deletions docs/changes.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,8 @@
# 最新动态
* 2019/01/16
* 整理API文档:list\_view/list\_view\_h/list\_view\_item/scroll\_view/scroll\_bar
* 去掉array类,使用darray类代替。

* 2019/01/16
* 增加darray类,逐步替换以前的array类。
* 增加widget pool用于控件的缓存和重复利用,可以通过WITH\_WIDGET\_POOL启用。
Expand Down
56 changes: 26 additions & 30 deletions docs/dots/widget_overview
Original file line number Diff line number Diff line change
Expand Up @@ -11,36 +11,6 @@ digraph G {
width = 0.4
]

edit_t[URL="../manual/edit_t.md"]
image_base_t[URL="../manual/image_base_t.md"]
window_base_t[URL="../manual/window_base_t.md"]
label_t[URL="../manual/label_t.md"]
button_t[URL="../manual/button_t.md"]
color_tile_t[URL="../manual/color_tile_t.md"]
combo_box_item_t[URL="../manual/combo_box_item_t.md"]
slider_t[URL="../manual/slider_t.md"]
progress_bar_t[URL="../manual/progress_bar_t.md"]
app_bar_t[URL="../manual/app_bar_t.md"]
row_t[URL="../manual/row_t.md"]
column_t[URL="../manual/column_t.md"]
grid_t[URL="../manual/grid_t.md"]
grid_item_t[URL="../manual/grid_item_t.md"]
group_box_t[URL="../manual/group_box_t.md"]
view_t[URL="../manual/view_t.md"]
button_group_t[URL="../manual/button_group_t.md"]
dialog_title_t[URL="../manual/dialog_title_t.md"]
dialog_client_t[URL="../manual/dialog_client_t.md"]
window_t[URL="../manual/window_t.md"]
popup_t[URL="../manual/popup_t.md"]
dialog_t[URL="../manual/dialog_t.md"]
calibration_win_t[URL="../manual/calibration_win_t.md"]
system_bar_t[URL="../manual/system_bar_t.md"]
image_t[URL="../manual/image_t.md"]
gif_image_t[URL="../manual/gif_image_t.md"]
svg_image_t[URL="../manual/svg_image_t.md"]
combo_box_t[URL="../manual/combo_box_t.md"]
spin_box_t[URL="../manual/spin_box_t.md"]


edit_t -> widget_t[arrowhead=empty]
image_base_t -> widget_t[arrowhead=empty]
Expand Down Expand Up @@ -75,4 +45,30 @@ digraph G {

combo_box_t -> edit_t[arrowhead=empty]
spin_box_t -> edit_t[arrowhead=empty]

tab_control_t -> widget_t[arrowhead=empty]
tab_button_t -> widget_t[arrowhead=empty]
tab_button_group_t -> widget_t[arrowhead=empty]
group_box_t -> widget_t[arrowhead=empty]
app_bar_t -> widget_t[arrowhead=empty]
canvas_widget_t -> widget_t[arrowhead=empty]
color_picker_t -> widget_t[arrowhead=empty]
guage_t -> widget_t[arrowhead=empty]
guage_pointer_t -> widget_t[arrowhead=empty]
image_animation_t -> widget_t[arrowhead=empty]
image_value_t -> widget_t[arrowhead=empty]
keyboard_t -> widget_t[arrowhead=empty]
progress_circle_t -> widget_t[arrowhead=empty]
rich_text_t -> widget_t[arrowhead=empty]
slide_menu_t -> widget_t[arrowhead=empty]
slide_view_t -> widget_t[arrowhead=empty]
switch_t -> widget_t[arrowhead=empty]
text_selector_t -> widget_t[arrowhead=empty]
time_clock_t -> widget_t[arrowhead=empty]
digit_clock_t -> widget_t[arrowhead=empty]
list_view_t -> widget_t[arrowhead=empty]
list_view_h_t -> widget_t[arrowhead=empty]
list_item_t -> widget_t[arrowhead=empty]
scroll_bar_t -> widget_t[arrowhead=empty]
scroll_view_t -> widget_t[arrowhead=empty]
}
Binary file modified docs/images/widget_overview.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
11 changes: 8 additions & 3 deletions docs/manual.md
Original file line number Diff line number Diff line change
Expand Up @@ -61,9 +61,14 @@
* [slide\_view](manual/slide_view_t.md) 滑动视图控件。
* [svg\_image](manual/svg_image_t.md) SVG图片控件。
* [switch](manual/switch_t.md) 开关控件。
* [text\_selector](manual/text\_selector_t.md) 文本选择器控件。
* [time\_clock](manual/time\_clock_t.md) 模拟时钟控件。
* [digit\_clock](manual/digit\_clock_t.md) 数字时钟控件。
* [text\_selector](manual/text_selector_t.md) 文本选择器控件。
* [time\_clock](manual/time_clock_t.md) 模拟时钟控件。
* [digit\_clock](manual/digit_clock_t.md) 数字时钟控件。
* [list\_view](manual/list_view_t.md) 列表视图控件。
* [list\_view\_h](manual/list_view_h_t.md) 水平列表视图控件。
* [list\_item](manual/list_item_t.md) 列表项控件。
* [scroll\_bar](manual/scroll_bar_t.md) 滚动条控件。
* [scroll\_view](manual/scroll_view_t.md) 滚动视图控件。

### 画布

Expand Down
16 changes: 8 additions & 8 deletions docs/manual/darray_t.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,11 @@

| 名属性称 | 类型 | 说明 |
| -------- | ----- | ------------ |
| <a href="#darray_t_capacity">capacity</a> | uint16\_t | 数组的容量大小。 |
| <a href="#darray_t_capacity">capacity</a> | uint32\_t | 数组的容量大小。 |
| <a href="#darray_t_compare">compare</a> | tk\_compare\_t | 元素比较函数。 |
| <a href="#darray_t_destroy">destroy</a> | tk\_destroy\_t | 元素销毁函数。 |
| <a href="#darray_t_elms">elms</a> | void** | 数组中的元素。 |
| <a href="#darray_t_size">size</a> | uint16\_t | 数组中元素的个数。 |
| <a href="#darray_t_size">size</a> | uint32\_t | 数组中元素的个数。 |
#### darray\_clear 函数
-----------------------

Expand Down Expand Up @@ -109,15 +109,15 @@ int32_t darray_count (darray_t* darray, void* ctx);
* 函数原型:

```
darray_t* darray_create (uint16_t* capacity, tk_destroy_t destroy, tk_compare_t compare);
darray_t* darray_create (uint32_t* capacity, tk_destroy_t destroy, tk_compare_t compare);
```

* 参数说明:

| 参数 | 类型 | 说明 |
| -------- | ----- | --------- |
| 返回值 | darray\_t* | 数组对象。 |
| capacity | uint16\_t* | 数组的初始容量。 |
| capacity | uint32\_t* | 数组的初始容量。 |
| destroy | tk\_destroy\_t | 元素销毁函数。 |
| compare | tk\_compare\_t | 元素比较函数。 |
#### darray\_deinit 函数
Expand Down Expand Up @@ -224,7 +224,7 @@ int darray_find_index (darray_t* darray, void* ctx);
* 函数原型:

```
darray_t* darray_init (darray_t* darray, uint16_t* capacity, tk_destroy_t destroy, tk_compare_t compare);
darray_t* darray_init (darray_t* darray, uint32_t* capacity, tk_destroy_t destroy, tk_compare_t compare);
```

* 参数说明:
Expand All @@ -233,7 +233,7 @@ darray_t* darray_init (darray_t* darray, uint16_t* capacity, tk_destroy_t destro
| -------- | ----- | --------- |
| 返回值 | darray\_t* | 数组对象。 |
| darray | darray\_t* | 数组对象。 |
| capacity | uint16\_t* | 数组的初始容量。 |
| capacity | uint32\_t* | 数组的初始容量。 |
| destroy | tk\_destroy\_t | 元素销毁函数。 |
| compare | tk\_compare\_t | 元素比较函数。 |
#### darray\_pop 函数
Expand Down Expand Up @@ -356,7 +356,7 @@ ret_t darray_remove_index (darray_t* darray, uint32_t index);


* 类型:uint16\_t
* 类型:uint32\_t

| 特性 | 是否支持 |
| -------- | ----- |
Expand Down Expand Up @@ -404,7 +404,7 @@ ret_t darray_remove_index (darray_t* darray, uint32_t index);


* 类型:uint16\_t
* 类型:uint32\_t

| 特性 | 是否支持 |
| -------- | ----- |
Expand Down
47 changes: 46 additions & 1 deletion docs/manual/list_item_t.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,52 @@
### 概述
![image](images/list_item_t_0.png)

list item控件。
列表项控件。

列表项控件是一个简单的容器控件,一般作为列表视图中滚动视图的子控件。

list\_item\_t是[widget\_t](widget_t.md)的子类控件,widget\_t的函数均适用于list\_item\_t控件。

在xml中使用"list\_item"标签创建列表项控件。如:

```xml
<list_view x="0" y="30" w="100%" h="-80" item_height="60">
<scroll_view name="view" x="0" y="0" w="100%" h="100%">
<list_item style="odd" children_layout="default(rows=1,cols=0)">
<image draw_type="icon" w="30" image="earth"/>
<label w="-30" text="1.Hello AWTK !">
<switch x="r:10" y="m" w="60" h="20"/>
</label>
</list_item>
...
</scroll_view>
</list_view>
```

> 更多用法请参考:[list\_view\_m.xml](
https://github.com/zlgopen/awtk/blob/master/demos/assets/raw/ui/list_view_m.xml)

在c代码中使用函数list\_item\_create创建列表项控件。如:

```c
widget_t* list_item = list_item_create(scroll_view, 0, 0, 0, 0);
```

> 列表项控件大小一般由列表控制,不需指定xywh参数。
可以用style来实现可点击或不可点击的效果。如:

```xml
<style name="odd_clickable" border_color="#a0a0a0" border="bottom" text_color="black">
<normal bg_color="#f5f5f5" />
<pressed bg_color="#c0c0c0" />
<over bg_color="#f5f5f5" />
</style>
```

> 更多用法请参考:[theme default](
https://github.com/zlgopen/awtk/blob/master/demos/assets/raw/styles/default.xml#L372)


----------------------------------
### 函数
Expand Down
33 changes: 32 additions & 1 deletion docs/manual/list_view_h_t.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,38 @@
### 概述
![image](images/list_view_h_t_0.png)

水平ListView控件。
水平列表视图控件。

list\_view\_h\_t是[widget\_t](widget_t.md)的子类控件,widget\_t的函数均适用于list\_view\_h\_t控件。

在xml中使用"list\_view\_h"标签创建水平列表视图控件。如:

```xml
<list_view_h x="center" y="10" w="90%" h="100" item_width="200" spacing="5">
<scroll_view name="view" w="100%" h="100%">
<image style="border" draw_type="auto" image="1" text="1"/>
...
</scroll_view>
</list_view_h>
```

> 注意:列表项不是作为列表视图控件的直接子控件,而是作为滚动视图的子控件。

> 更多用法请参考:[list\_view\_h.xml](
https://github.com/zlgopen/awtk/blob/master/demos/assets/raw/ui/list_view_h.xml)

在c代码中使用函数list\_view\_h\_create创建水平列表视图控件。如:

```c
widget_t* list_view = list_view_h_create(win, 0, 0, 0, 0);
```

用代码构造列表视图是比较繁琐的事情,最好用XML来构造。
如果需要动态修改,可以使用widget\_clone来增加列表项,使用widget\_remove\_child来移出列表项。

可用通过style来设置控件的显示风格,如背景颜色和边框颜色等(一般情况不需要)。


----------------------------------
### 函数
Expand Down
48 changes: 47 additions & 1 deletion docs/manual/list_view_t.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,53 @@
### 概述
![image](images/list_view_t_0.png)

ListView控件。
列表视图控件。

列表视图控件是一个可以垂直滚动的列表控件。

如果不需要滚动,可以用view控件配置适当的layout参数作为列表控件。

列表视图中的列表项可以固定高度,也可以使用不同高度。请参考[变高列表项](
https://github.com/zlgopen/awtk/blob/master/demos/assets/raw/ui/list_view_vh.xml)

列表视图控件的中可以有滚动条,也可以没有滚动条。
可以使用移动设备风格的滚动条,也可以使用桌面风格的滚动条。

list\_view\_t是[widget\_t](widget_t.md)的子类控件,widget\_t的函数均适用于list\_view\_t控件。

在xml中使用"list\_view"标签创建列表视图控件。如:

```xml
<list_view x="0" y="30" w="100%" h="-80" item_height="60">
<scroll_view name="view" x="0" y="0" w="100%" h="100%">
<list_item style="odd" children_layout="default(rows=1,cols=0)">
<image draw_type="icon" w="30" image="earth"/>
<label w="-30" text="1.Hello AWTK !">
<switch x="r:10" y="m" w="60" h="20"/>
</label>
</list_item>
...
</scroll_view>
</list_view>
```

> 注意:列表项不是作为列表视图控件的直接子控件,而是作为滚动视图的子控件。

> 更多用法请参考:[list\_view\_m.xml](
https://github.com/zlgopen/awtk/blob/master/demos/assets/raw/ui/list_view_m.xml)

在c代码中使用函数list\_view\_create创建列表视图控件。如:

```c
widget_t* list_view = list_view_create(win, 0, 0, 0, 0);
```

用代码构造列表视图是比较繁琐的事情,最好用XML来构造。
如果需要动态修改,可以使用widget\_clone来增加列表项,使用widget\_remove\_child来移出列表项。

可用通过style来设置控件的显示风格,如背景颜色和边框颜色等(一般情况不需要)。


----------------------------------
### 函数
Expand Down
45 changes: 42 additions & 3 deletions docs/manual/scroll_bar_t.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,43 @@
### 概述
![image](images/scroll_bar_t_0.png)

scroll_bar控件。
滚动条控件。

> 目前只支持垂直滚动。
scroll\_bar\_t是[widget\_t](widget_t.md)的子类控件,widget\_t的函数均适用于scroll\_bar\_t控件。

在xml中使用"scroll\_bar"或"scroll\_bar\_d"或"scroll\_bar\_m"标签创建滚动条控件。如:

```xml
<list_view x="0" y="30" w="100%" h="-80" item_height="60">
<scroll_view name="view" x="0" y="0" w="100%" h="100%">
...
</scroll_view>
<scroll_bar_m name="bar" x="right" y="0" w="6" h="100%" value="0"/>
</list_view>
```

> 更多用法请参考:[list\_view\_m.xml](
https://github.com/zlgopen/awtk/blob/master/demos/assets/raw/ui/list_view_m.xml)

在c代码中使用函数scroll\_bar\_create创建列表项控件。如:

```c
widget_t* scroll_bar = scroll_bar_create(list_view, 0, 0, 0, 0);
```

```xml
<style name="default">
<normal bg_color="#c0c0c0" fg_color="#808080"/>
<over bg_color="#c0c0c0" fg_color="#808080"/>
<pressed bg_color="#c0c0c0" fg_color="#808080"/>
</style>
```

> 更多用法请参考:[theme default](
https://github.com/zlgopen/awtk/blob/master/demos/assets/raw/styles/default.xml#L350)


----------------------------------
### 函数
Expand All @@ -12,7 +48,7 @@
| -------- | ------------ |
| <a href="#scroll_bar_t_scroll_bar_add_delta">scroll\_bar\_add\_delta</a> | 在当前的值上增加一个值,并触发EVT_VALUE_CHANGED事件。 |
| <a href="#scroll_bar_t_scroll_bar_cast">scroll\_bar\_cast</a> | 转换为scroll_bar对象(供脚本语言使用)。 |
| <a href="#scroll_bar_t_scroll_bar_create">scroll\_bar\_create</a> | 创建scroll_bar对象(根据宏WITH_DESKTOP_STYLE决定创建desktop风格还是mobile风格的滚动条) |
| <a href="#scroll_bar_t_scroll_bar_create">scroll\_bar\_create</a> | 创建scroll_bar对象 |
| <a href="#scroll_bar_t_scroll_bar_create_desktop">scroll\_bar\_create\_desktop</a> | 创建desktop风格的scroll_bar对象 |
| <a href="#scroll_bar_t_scroll_bar_create_mobile">scroll\_bar\_create\_mobile</a> | 创建mobile风格的scroll_bar对象 |
| <a href="#scroll_bar_t_scroll_bar_is_mobile">scroll\_bar\_is\_mobile</a> | 判断是否是mobile风格的滚动条。 |
Expand Down Expand Up @@ -78,7 +114,10 @@ widget_t* scroll_bar_cast (widget_t* widget);

* 函数功能:

> <p id="scroll_bar_t_scroll_bar_create"> 创建scroll_bar对象(根据宏WITH_DESKTOP_STYLE决定创建desktop风格还是mobile风格的滚动条)
> <p id="scroll_bar_t_scroll_bar_create"> 创建scroll_bar对象
> 根据宏WITH_DESKTOP_STYLE决定创建desktop风格还是mobile风格的滚动条



Expand Down
Loading

0 comments on commit 96c943f

Please sign in to comment.