Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
854ceed3
D
Docs
项目概览
OpenHarmony
/
Docs
大约 2 年 前同步成功
通知
161
Star
293
Fork
28
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
D
Docs
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
提交
854ceed3
编写于
7月 25, 2023
作者:
H
HelloCrease
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update docs
Signed-off-by:
N
HelloCrease
<
lian15@huawei.com
>
上级
cf4b2b87
变更
1
显示空白变更内容
内联
并排
Showing
1 changed file
with
25 addition
and
25 deletion
+25
-25
zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md
...n/application-dev/reference/arkui-ts/ts-container-tabs.md
+25
-25
未找到文件。
zh-cn/application-dev/reference/arkui-ts/ts-container-tabs.md
浏览文件 @
854ceed3
...
...
@@ -19,7 +19,7 @@ Tabs(value?: {barPosition?: BarPosition, index?: number, controller?: [TabsContr
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ----------- | --------------------------------- | ---- | ----------------------------------------
--------------------
|
| ----------- | --------------------------------- | ---- | ---------------------------------------- |
| barPosition | BarPosition | 否 | 设置Tabs的页签位置。
<br/>
默认值:BarPosition.Start |
| index | number | 否 | 设置初始页签索引。
<br/>
默认值:0
<br/>
**说明:**
<br/>
设置为小于0的值时按默认值显示。
<br/>
可选值为
[
0, TabContent子节点数量-1]。<br/>设置不同值时,默认生效切换动效,可以设置animationDuration为0关闭动画。<br />从API version 10开始,该参数支持[$$
](
../../quick-start/arkts-two-way-sync.md
)
双向绑定变量。 |
| controller |
[
TabsController
](
#tabscontroller
)
| 否 | 设置Tabs控制器。 |
...
...
@@ -37,22 +37,22 @@ Tabs(value?: {barPosition?: BarPosition, index?: number, controller?: [TabsContr
除支持
[
通用属性
](
ts-universal-attributes-size.md
)
外,还支持以下属性:
| 名称 | 参数类型 | 描述 |
| ------------------------ | ---------------------------------------- | ---------------------------------------- |
| ------------------------
--------
| ---------------------------------------- | ---------------------------------------- |
| vertical | boolean | 设置为false是为横向Tabs,设置为true时为纵向Tabs。
<br/>
默认值:false |
| scrollable | boolean | 设置为true时可以通过滑动页面进行页面切换,为false时不可滑动切换页面。
<br/>
默认值:true |
| barMode | BarMode | TabBar布局模式,具体描述见BarMode枚举说明。
<br/>
默认值:BarMode.Fixed |
| barWidth | number
\|
Length
<sup>
8+
</sup>
| TabBar的宽度值。
<br/>
默认值:
<br/>
未设置带样式的TabBar且vertical属性为false时,默认值为Tabs的宽度。
<br/>
未设置带样式的TabBar且vertical属性为true时,默认值为56vp。
<br/>
设置SubTabbarStyle样式且vertical属性为false时,默认值为Tabs的宽度。
<br/>
设置SubTabbarStyle样式且vertical属性为true时,默认值为56vp。
<br/>
设置BottomTabbarStyle样式且vertical属性为true时,默认值为96vp。
<br/>
设置BottomTabbarStyle样式且vertical属性为false时,默认值为Tabs的宽度。
<br/>
**说明:**
<br/>
设置为小于0或大于Tabs宽度值时,按默认值显示。 |
| barHeight
| number
\|
Length
<sup>
8+
</sup>
| TabBar的高度值。
<br/>
默认值:
<br/>
未设置带样式的TabBar且vertical属性为false时,默认值为56vp。
<br/>
未设置带样式的TabBar且vertical属性为true时,默认值为Tabs的高度。
<br/>
设置SubTabbarStyle样式且vertical属性为false时,默认值为56vp。
<br/>
设置SubTabbarStyle样式且vertical属性为true时,默认值为Tabs的高度。
<br/>
设置BottomTabbarStyle样式且vertical属性为true时,默认值为Tabs的高度。
<br/>
设置BottomTabbarStyle样式且vertical属性为false时,默认值为56vp。
<br/>
**说明:**
<br/>
设置为小于0或大于Tabs高度值时,按默认值显示。
|
| barHeight
| number
\|
Length
<sup>
8+
</sup>
| TabBar的高度值。
<br/>
默认值:
<br/>
未设置带样式的TabBar且vertical属性为false时,默认值为56vp。
<br/>
未设置带样式的TabBar且vertical属性为true时,默认值为Tabs的高度。
<br/>
设置SubTabbarStyle样式且vertical属性为false时,默认值为56vp。
<br/>
设置SubTabbarStyle样式且vertical属性为true时,默认值为Tabs的高度。
<br/>
设置BottomTabbarStyle样式且vertical属性为true时,默认值为Tabs的高度。
<br/>
设置BottomTabbarStyle样式且vertical属性为false时,默认值为56vp。
<br/>
**说明:**
<br/>
设置为小于0或大于Tabs高度值时,按默认值显示。
|
| animationDuration | number | TabContent滑动动画时长。不设置时,点击切换页签无动画,滑动切换有动画;设置时,点击切换和滑动切换都有动画。
<br/>
默认值:300
<br/>
**说明:**
<br/>
设置为小于0或百分比时,按默认值显示。 |
| divider
<sup>
10+
</sup>
|
[
DividerStyle
](
#dividerstyle10对象说明
)
\|
null | 用于设置区分TabBar和TabContent的分割线样式设置分割线样式,默认不显示分割线。
<br/>
DividerStyle: 分割线的样式;
<br/>
null: 不显示分割线。 |
| fadingEdge
<sup>
10+
</sup>
| boolean | 设置页签超过容器宽度时是否渐隐消失。
<br
/>
默认值:true |
| barOverlap
<sup>
10+
</sup>
| boolean | 设置TabBar是否背后变模糊并叠加在TabContent之上。
<br
/>
默认值:false |
| barBackgroundColor
<sup>
10+
</sup>
|
[
ResourceColor
](
ts-types.md#resourcecolor
)
| 设置TabBar的背景颜色。
<br
/>
默认值:透明
|
| barBackgroundColor
<sup>
10+
</sup>
|
[
ResourceColor
](
ts-types.md#resourcecolor
)
| 设置TabBar的背景颜色。
<br
/>
默认值:透明
|
## DividerStyle<sup>10+</sup>对象说明
| 名称 | 参数类型 | 必填 | 描述 |
| ----------- | ---------------------------------------- | ---- | ----------------------------------- |
| ----------- | ---------------------------------------- | ---- | -----------------------------------
-----
|
| strokeWidth |
[
Length
](
ts-types.md#length
)
| 是 | 分割线的线宽(不支持百分比设置)。 |
| color |
[
ResourceColor
](
ts-types.md#resourcecolor
)
| 否 | 分割线的颜色。
<br/>
默认值:#33182431 |
| startMargin |
[
Length
](
ts-types.md#length
)
| 否 | 分割线与侧边栏顶端的距离(不支持百分比设置)。
<br/>
默认值:0.0
<br/>
单位:vp |
...
...
@@ -98,7 +98,7 @@ changeIndex(value: number): void
## 示例
示例1:
### 示例1
```
ts
// xxx.ets
...
...
@@ -163,7 +163,7 @@ struct TabsExample {

示例2:
### 示例2
```
ts
// xxx.ets
...
...
@@ -267,7 +267,7 @@ struct TabsDivider1 {

示例3:
### 示例3
```
ts
// xxx.ets
...
...
@@ -359,7 +359,7 @@ struct TabsOpaque {

示例4:
### 示例4
```
ts
// xxx.ets
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录