Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
d8b3c32a
D
Docs
项目概览
OpenHarmony
/
Docs
12 个月 前同步成功
通知
159
Star
292
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看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
d8b3c32a
编写于
7月 13, 2023
作者:
O
openharmony_ci
提交者:
Gitee
7月 13, 2023
浏览文件
操作
浏览文件
下载
差异文件
!20450 [新需求]: 【SafeArea】补充文档
Merge pull request !20450 from zhaoxinyu/safeArea
上级
52ee24df
2b3ff186
变更
5
显示空白变更内容
内联
并排
Showing
5 changed file
with
94 addition
and
0 deletion
+94
-0
zh-cn/application-dev/reference/arkui-ts/Readme-CN.md
zh-cn/application-dev/reference/arkui-ts/Readme-CN.md
+1
-0
zh-cn/application-dev/reference/arkui-ts/figures/expandSafeArea1.png
...cation-dev/reference/arkui-ts/figures/expandSafeArea1.png
+0
-0
zh-cn/application-dev/reference/arkui-ts/figures/expandSafeArea2.png
...cation-dev/reference/arkui-ts/figures/expandSafeArea2.png
+0
-0
zh-cn/application-dev/reference/arkui-ts/ts-types.md
zh-cn/application-dev/reference/arkui-ts/ts-types.md
+20
-0
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-expand-safe-area.md
...ence/arkui-ts/ts-universal-attributes-expand-safe-area.md
+73
-0
未找到文件。
zh-cn/application-dev/reference/arkui-ts/Readme-CN.md
浏览文件 @
d8b3c32a
...
...
@@ -51,6 +51,7 @@
-
[
隐私遮罩
](
ts-universal-attributes-obscured.md
)
-
[
文本通用
](
ts-universal-attributes-text-style.md
)
-
[
拖拽控制
](
ts-universal-attributes-drag-drop.md
)
-
[
安全区域
](
ts-universal-attributes-expand-safe-area.md
)
-
手势处理
-
[
绑定手势方法
](
ts-gesture-settings.md
)
-
基础手势
...
...
zh-cn/application-dev/reference/arkui-ts/figures/expandSafeArea1.png
0 → 100644
浏览文件 @
d8b3c32a
221.1 KB
zh-cn/application-dev/reference/arkui-ts/figures/expandSafeArea2.png
0 → 100644
浏览文件 @
d8b3c32a
148.9 KB
zh-cn/application-dev/reference/arkui-ts/ts-types.md
浏览文件 @
d8b3c32a
...
...
@@ -319,3 +319,23 @@ Swiper组件动画相关信息集合。
| currentOffset | number | Swiper当前显示元素在主轴方向上,相对于Swiper起始位置的位移。单位VP,默认值为0.|
| targetOffset | number | Swiper动画目标元素在主轴方向上,相对于Swiper起始位置的位移。单位VP,默认值为0.|
| velocity | number | Swiper离手动画开始时的离手速度。单位VP/S,默认值为0.|
## SafeAreaType<sup>10+</sup>
扩展安全区域的枚举类型。
| 名称 | 描述 |
| -------- | ------------------------------------------ |
| SYSTEM | 系统默认非安全区域,包括状态栏、导航栏。 |
| CUTOUT | 设备的非安全区域,例如刘海屏或挖孔屏区域。 |
| KEYBOARD | 软键盘区域。 |
## SafeAreaEdge<sup>10+</sup>
扩展安全区域的方向。
| 名称 | 描述 |
| ------ | ---------- |
| TOP | 上方区域。 |
| BOTTOM | 下方区域。 |
| START | 前部区域。 |
| END | 尾部区域。 |
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-expand-safe-area.md
0 → 100644
浏览文件 @
d8b3c32a
# 安全区域
通过expandSafeArea属性支持组件扩展其安全区域。
> **说明:**
>
> 从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数 | 参数描述 |
| -------------- | ----------------------------- | --------------------------------------- |
| expandSafeArea | type?: Array
<
[
SafeAreaType
](
ts-types.md#safeareatype10
)
>
,
<br
/>
edges?: Array
<
[
SafeAreaEdge
](
ts-types.md#safeareaedge10
)
>
| 控制组件扩展其安全区域。
<br
/>
默认值:
<br
/>
type: [SafeAreaType.SYSTEM, SafeAreaType.CUTOUT, SafeAreaType.KEYBOARD],
<br
/>
edges: [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM, SafeAreaEdge.START, SafeAreaEdge.END]
<br
/>
扩展至所有非安全区域。
<br
/>
type: 非必填,配置扩展安全区域的类型。
<br
/>
edges: 非必填,配置扩展安全区域的方向。 |
## 示例
### 示例1
```
// xxx.ets
@Entry
@Component
struct SafeAreaExample1 {
@State text: string = ''
controller: TextInputController = new TextInputController()
build() {
Row() {
Column()
.height('100%').width('100%')
.backgroundImage($r('app.media.bg')).backgroundImageSize(ImageSize.Cover)
.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
}.height('100%')
}
}
```
![
expandSafeArea1
](
figures/expandSafeArea1.png
)
### 示例2
```
@Entry
@Component
struct SafeAreaExample {
@State text: string = ''
controller: TextInputController = new TextInputController()
build() {
Row() {
Stack() {
Column()
.height('100%').width('100%')
.backgroundImage($r('app.media.bg')).backgroundImageSize(ImageSize.Cover)
.expandSafeArea([SafeAreaType.KEYBOARD, SafeAreaType.SYSTEM])
Column() {
Button('Set caretPosition 1')
.onClick(() => {
this.controller.caretPosition(1)
})
TextInput({ text: this.text, placeholder: 'input your word...', controller: this.controller })
.placeholderFont({ size: 14, weight: 400 })
.width(320).height(40).offset({y: 120})
.fontSize(14).fontColor(Color.Black)
.backgroundColor(Color.White)
}.width('100%').alignItems(HorizontalAlign.Center)
}
}.height('100%')
}
}
```
![
expandSafeArea2
](
figures/expandSafeArea2.png
)
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录