Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
07ad39ec
D
Docs
项目概览
OpenHarmony
/
Docs
1 年多 前同步成功
通知
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看板
未验证
提交
07ad39ec
编写于
11月 23, 2022
作者:
O
openharmony_ci
提交者:
Gitee
11月 23, 2022
浏览文件
操作
浏览文件
下载
差异文件
!11547 修改routeType枚举值描述
Merge pull request !11547 from 田雨/master
上级
bbc278c1
3bad8efb
变更
11
展开全部
隐藏空白更改
内联
并排
Showing
11 changed file
with
207 addition
and
117 deletion
+207
-117
zh-cn/application-dev/reference/arkui-js/figures/zh-cn_image_0000001152588538.gif
...ference/arkui-js/figures/zh-cn_image_0000001152588538.gif
+0
-0
zh-cn/application-dev/reference/arkui-js/figures/zh-cn_image_0000001152588538.png
...ference/arkui-js/figures/zh-cn_image_0000001152588538.png
+0
-0
zh-cn/application-dev/reference/arkui-js/js-components-basic-select.md
...tion-dev/reference/arkui-js/js-components-basic-select.md
+48
-19
zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001219744183.gif
...ference/arkui-ts/figures/zh-cn_image_0000001219744183.gif
+0
-0
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
...ation-dev/reference/arkui-ts/ts-basic-components-image.md
+54
-0
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-richtext.md
...on-dev/reference/arkui-ts/ts-basic-components-richtext.md
+1
-0
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md
...ion-dev/reference/arkui-ts/ts-components-canvas-lottie.md
+89
-89
zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md
...n/application-dev/reference/arkui-ts/ts-container-grid.md
+7
-2
zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
...cation-dev/reference/arkui-ts/ts-motion-path-animation.md
+1
-1
zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md
...on-dev/reference/arkui-ts/ts-page-transition-animation.md
+6
-5
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-focus.md
...n-dev/reference/arkui-ts/ts-universal-attributes-focus.md
+1
-1
未找到文件。
zh-cn/application-dev/reference/arkui-js/figures/zh-cn_image_0000001152588538.gif
0 → 100644
浏览文件 @
07ad39ec
111.9 KB
zh-cn/application-dev/reference/arkui-js/figures/zh-cn_image_0000001152588538.png
已删除
100644 → 0
浏览文件 @
bbc278c1
13.9 KB
zh-cn/application-dev/reference/arkui-js/js-components-basic-select.md
浏览文件 @
07ad39ec
...
...
@@ -49,36 +49,65 @@
```
html
<!-- xxx.hml -->
<div
class=
"container"
>
<select
@
change=
"changeFruit"
>
<option
value=
"bananaValue"
>
Banana
</option>
<option
value=
"appleValue"
selected=
"true"
>
Apple
</option>
<option
value=
"pearValue"
>
Pear
</option>
</select>
<select
@
change=
"onChange"
>
<option
for=
"{{ array }}"
value=
"{{ $item.value }}"
>
{{ $item.name }}
</option>
</select>
</div>
```
```
css
/* xxx.css */
.container
{
display
:
flex
;
justify-content
:
center
;
align-items
:
center
;
display
:
flex
;
justify-content
:
center
;
align-items
:
center
;
width
:
100%
;
height
:
100%
;
}
```
```
js
//
×××
.js
//
xxx
.js
export
default
{
changeFruit
(
e
){
console
.
log
(
"
newValue:
"
+
e
.
newValue
)
}
data
:
{
array
:
[
{
"
value
"
:
"
下拉选项0
"
,
"
name
"
:
"
选项0
"
},
{
"
value
"
:
"
下拉选项1
"
,
"
name
"
:
"
选项1
"
},
{
"
value
"
:
"
下拉选项2
"
,
"
name
"
:
"
选项2
"
},
{
"
value
"
:
"
下拉选项3
"
,
"
name
"
:
"
选项3
"
},
]
},
getData
()
{
let
other
=
[
{
"
value
"
:
"
下拉选项a
"
,
"
name
"
:
"
选项a
"
},
{
"
value
"
:
"
下拉选项b
"
,
"
name
"
:
"
选项b
"
},
{
"
value
"
:
"
下拉选项c
"
,
"
name
"
:
"
选项c
"
},
{
"
value
"
:
"
下拉选项d
"
,
"
name
"
:
"
选项d
"
},
]
return
other
},
onChange
()
{
this
.
array
=
this
.
getData
()
}
}
```
![
zh-cn_image_0000001152588538
](
figures/zh-cn_image_0000001152588538.png
)
\ No newline at end of file
![
zh-cn_image_0000001152588538
](
figures/zh-cn_image_0000001152588538.gif
)
\ No newline at end of file
zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001219744183.gif
查看替换文件 @
bbc278c1
浏览文件 @
07ad39ec
856.8 KB
|
W:
|
H:
145.8 KB
|
W:
|
H:
2-up
Swipe
Onion skin
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
浏览文件 @
07ad39ec
...
...
@@ -349,3 +349,57 @@ struct ImageExample3 {
```
![
zh-cn_image_0000001205972610
](
figures/zh-cn_image_0000001205972610.gif
)
### 渲染沙箱路径图片
```
ts
import
fileio
from
'
@ohos.fileio
'
import
context
from
'
@ohos.application.context
'
@
Entry
@
Component
struct
LoadImageExample
{
@
State
resourcesPath
:
string
=
''
@
State
sandboxPath
:
string
=
''
context
:
context
.
AbilityContext
aboutToAppear
()
{
this
.
context
=
getContext
(
this
)
as
context
.
AbilityContext
}
build
()
{
Column
()
{
Button
(
'
读取沙箱图片
'
)
.
margin
({
bottom
:
10
,
top
:
10
})
.
onClick
(()
=>
{
this
.
sandboxPath
=
this
.
context
.
getApplicationContext
().
filesDir
+
'
/icon.png
'
console
.
log
(
`读取沙箱图片=========>
${
this
.
sandboxPath
}
`
)
let
fd
=
fileio
.
openSync
(
this
.
sandboxPath
,
0o100
,
0o666
)
console
.
log
(
`create file========>
${
fd
}
`
)
let
srcPath
=
this
.
context
.
bundleCodeDir
+
'
/entry/resources/base/media/icon.png
'
console
.
log
(
'
mySrcpath
'
+
srcPath
)
fileio
.
copyFileSync
(
srcPath
,
this
.
sandboxPath
)
// 复制图片到沙箱路径
this
.
sandboxPath
=
'
file://
'
+
this
.
context
.
getApplicationContext
().
filesDir
+
'
/icon.png
'
})
Button
(
'
读取资源图片
'
)
.
margin
({
bottom
:
10
})
.
onClick
(()
=>
{
this
.
resourcesPath
=
'
file://
'
+
this
.
context
.
bundleCodeDir
+
'
/entry/resources/base/media/icon.png
'
})
Text
(
`资源图片路径:
${
this
.
resourcesPath
}
`
)
.
fontSize
(
20
)
.
margin
({
bottom
:
10
})
Image
(
this
.
resourcesPath
)
.
width
(
100
)
.
height
(
100
)
Text
(
`沙箱图片路径:
${
this
.
sandboxPath
}
`
)
.
fontSize
(
20
)
.
margin
({
bottom
:
10
})
Image
(
this
.
sandboxPath
)
.
width
(
100
)
.
height
(
100
)
}
.
width
(
'
100%
'
).
height
(
'
100%
'
)
}
}
```
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-richtext.md
浏览文件 @
07ad39ec
...
...
@@ -39,6 +39,7 @@ RichText(content:string)
|
\<
p>
\<
/p> | 定义段落。 |
\<
p>这是一个段落
\<
/p> |
|
\<
br/> | 插入一个简单的换行符。 |
\<
p>这是一个段落
\<
br/>这是换行段落
\<
/p> |
|
\<
hr/> | 定义HTML页面中的主题变化(比如话题的转移),并显示为一条水平线。 |
\<
p>这个一个段落
\<
/p>
\<
hr/>
\<
p>这是一个段落
\<
/p> |
|
\<
image>
\<
/image> | 用来定义图片。 |
\<
image src="file:///data/storage/el1/bundle/entry/resources/rawfile/icon.png">
\<
/image> |
|
\<
div>
\<
/div> | 常用于组合块级元素,以便通过CSS来对这些元素进行格式化。 |
\<
div style='color:#0000FF'>
\<
h3>这是一个在div元素中的标题。
\<
/h3>
\<
/div> |
|
\<
i>
\<
/i> | 定义与文本中其余部分不同的部分,并把这部分文本呈现为斜体文本。 |
\<
i>这是一个斜体
\<
/i> |
|
\<
u>
\<
/u> | 定义与常规文本风格不同的文本,像拼写错误的单词或者汉语中的专有名词,应尽量避免使用
\<
u>为文本加下划线,用户会把它混淆为一个超链接。 |
\<
p>
\<
u>这是带有下划线的段落
\<
/u>
\<
/p> |
...
...
zh-cn/application-dev/reference/arkui-ts/ts-components-canvas-lottie.md
浏览文件 @
07ad39ec
此差异已折叠。
点击以展开。
zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md
浏览文件 @
07ad39ec
...
...
@@ -66,7 +66,7 @@ Grid只展示固定行列数的元素,其余元素不展示,且Grid不可滚
## GridDirection<sup>8+</sup>枚举说明
| 名称 | 描述 |
| ------ | -------------------------------------- |
| ------ | -------------------------------------- |
| Row | 主轴布局方向沿水平方向布局,即自左往右先填满一行,再去填下一行。 |
| Column | 主轴布局方向沿垂直方向布局,即自上往下先填满一列,再去填下一列。 |
| RowReverse | 主轴布局方向沿水平方向反向布局,即自右往左先填满一行,再去填下一行。 |
...
...
@@ -100,6 +100,7 @@ Grid只展示固定行列数的元素,其余元素不展示,且Grid不可滚
@
Component
struct
GridExample
{
@
State
Number
:
String
[]
=
[
'
0
'
,
'
1
'
,
'
2
'
,
'
3
'
,
'
4
'
]
scroller
:
Scroller
=
new
Scroller
()
build
()
{
Column
({
space
:
5
})
{
...
...
@@ -126,7 +127,7 @@ struct GridExample {
.
height
(
300
)
Text
(
'
scroll
'
).
fontColor
(
0xCCCCCC
).
fontSize
(
9
).
width
(
'
90%
'
)
Grid
()
{
Grid
(
this
.
scroller
)
{
ForEach
(
this
.
Number
,
(
day
:
string
)
=>
{
ForEach
(
this
.
Number
,
(
day
:
string
)
=>
{
GridItem
()
{
...
...
@@ -149,6 +150,10 @@ struct GridExample {
.
width
(
'
90%
'
)
.
backgroundColor
(
0xFAEEE0
)
.
height
(
300
)
Button
(
'
next page
'
)
.
onClick
(()
=>
{
// 点击后滑到下一页
this
.
scroller
.
scrollPage
({
next
:
true
})
})
}.
width
(
'
100%
'
).
margin
({
top
:
5
})
}
}
...
...
zh-cn/application-dev/reference/arkui-ts/ts-motion-path-animation.md
浏览文件 @
07ad39ec
...
...
@@ -11,7 +11,7 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| motionPath | {
<br/>
path:
string,
<br/>
from?:
number,
<br/>
to?:
number,
<br/>
rotatable?:
boolean
<br/>
}
<br/>
**说明:**
<br/>
path中支持使用start和end进行起点和终点的替代,如:
<br/>
'Mstart.x
start.y
L50
50
Lend.x
end.y
Z'| {
<br/>
'',
<br/>
0.0,
<br/>
1.0,
<br/>
false
<br/>
} | 设置组件的运动路径,入参说明如下:
<br/>
-
path:位移动画的运动路径,使用svg路径字符串。
<br/>
-
from:运动路径的起点,默认为0.0。
<br/>
-
to:运动路径的终点,默认为1.0。
<br/>
-
rotatable:是否跟随路径进行旋转。 |
| motionPath | {
<br/>
path:
string,
<br/>
from?:
number,
<br/>
to?:
number,
<br/>
rotatable?:
boolean
<br/>
}
<br/>
**说明:**
<br/>
path中支持使用start和end进行起点和终点的替代,如:
<br/>
'Mstart.x
start.y
L50
50
Lend.x
end.y
Z'
,更多说明请参考
[
绘制路径
](
../../ui/ui-js-components-svg-path.md
)
。
| {
<br/>
'',
<br/>
0.0,
<br/>
1.0,
<br/>
false
<br/>
} | 设置组件的运动路径,入参说明如下:
<br/>
-
path:位移动画的运动路径,使用svg路径字符串。
<br/>
-
from:运动路径的起点,默认为0.0。
<br/>
-
to:运动路径的终点,默认为1.0。
<br/>
-
rotatable:是否跟随路径进行旋转。 |
## 示例
...
...
zh-cn/application-dev/reference/arkui-ts/ts-page-transition-animation.md
浏览文件 @
07ad39ec
...
...
@@ -5,20 +5,21 @@
> **说明:**
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
>
| 名称 | 参数 | 参数描述 |
| ------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| PageTransitionEnter | {
<br/>
type
: RouteType,
<br/>
duration: number,
<br/>
curve:
[
Curve
](
ts-appendix-enums.md#curve
)
\|
string,
<br>
delay: number
<br/>
} | 设置当前页面的自定义入场动效。
<br/>
-
type:不配置时表明pop为push时效果的逆播。
<br/>
-
duration:动画的时长,单位为毫秒。
<br/>
-
curve:动画曲线。string类型的取值支持"ease"、"ease-in"、"ease-out"、"ease-in-out"、"extreme-deceleration"、"fast-out-linear-in"、"fast-out-slow-in"、"friction"、"linear"、"linear-out-slow-in"、"rhythm"、"sharp"、"smooth"。
<br/>
默认值:Curve.Linear
<br/>
-
delay:动画延迟时长,单位为毫秒,默认不延迟播放。 |
| PageTransitionExit | {
<br/>
type
: RouteType,
<br/>
duration: number,
<br/>
curve:
[
Curve
](
ts-appendix-enums.md#curve
)
\|
string,
<br/>
delay: number
<br/>
} | 设置当前页面的自定义退场动效。
<br/>
-
type:不配置时表明pop为push时效果的逆播
<br/>
-
duration:动画的时长,单位为毫秒。
<br/>
-
curve:动画曲线,string类型取值与PageTransitionEnter相同。
<br/>
默认值:Curve.Linear
<br/>
-
delay:动画延迟时长,单位为毫秒,默认不延迟播放。 |
| PageTransitionEnter | {
<br/>
type
?: RouteType,
<br/>
duration?: number,
<br/>
curve?:
[
Curve
](
ts-appendix-enums.md#curve
)
\|
string,
<br>
delay?: number
<br/>
} | 设置当前页面的自定义入场动效。
<br/>
-
type:页面转场效果生效的路由类型。
<br/>
默认值:RouteType.None。
<br/>
**说明:**没有匹配时使用系统默认的页面转场效果(根据设备可能会有差异),如需禁用系统默认页面转场效果,可以指定duration为0。
<br/>
-
duration:动画的时长,单位为毫秒。
<br/>
-
curve:动画曲线。string类型的取值支持"ease"、"ease-in"、"ease-out"、"ease-in-out"、"extreme-deceleration"、"fast-out-linear-in"、"fast-out-slow-in"、"friction"、"linear"、"linear-out-slow-in"、"rhythm"、"sharp"、"smooth"。
<br/>
默认值:Curve.Linear
<br/>
-
delay:动画延迟时长,单位为毫秒,默认不延迟播放。 |
| PageTransitionExit | {
<br/>
type
?: RouteType,
<br/>
duration?: number,
<br/>
curve?:
[
Curve
](
ts-appendix-enums.md#curve
)
\|
string,
<br/>
delay?: number
<br/>
} | 设置当前页面的自定义退场动效。
<br/>
-
type:页面转场效果生效的路由类型。
<br/>
默认值:RouteType.None。
<br/>
**说明:**没有匹配时使用系统默认的页面转场效果(根据设备可能会有差异),如需禁用系统默认页面转场效果,可以指定duration为0。
<br/>
-
duration:动画的时长,单位为毫秒。
<br/>
-
curve:动画曲线,string类型取值与PageTransitionEnter相同。
<br/>
默认值:Curve.Linear
<br/>
-
delay:动画延迟时长,单位为毫秒,默认不延迟播放。 |
## RouteType枚举说明
| 名称 | 描述 |
| ---- | ------------------------------------------------------------ |
| Pop | 重定向指定页面。
PageA跳转到PageB时,PageA为Exit+Push,PageB为Enter+Push
。 |
| Push | 跳转到下一页面。Page
B返回至PageA时,PageA为Enter+Pop,PageB为Exit+Pop
。 |
| None | 页面未重定向。
|
| Pop | 重定向指定页面。
从PageB回退到之前的页面PageA。对于PageB,指定RouteType为None或者Pop的PageTransitionExit组件样式生效,对于PageA,指定RouteType为None或者Pop的PageTransitionEnter组件样式生效
。 |
| Push | 跳转到下一页面。Page
A跳转到下一个新的界面PageB。对于PageA,指定RouteType为None或者Push的PageTransitionExit组件样式生效,对于PageB,指定RouteType为None或者Push的PageTransitionEnter组件样式生效
。 |
| None | 页面未重定向。
如Push和Pop描述中RouteType为None的情形,即页面进场时PageTransitionEnter的转场效果生效;退场时PageTransitionExit的转场效果生效。
|
## 属性
...
...
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-focus.md
浏览文件 @
07ad39ec
...
...
@@ -11,7 +11,7 @@
|
**名称**
|
**参数类型**
|
**描述**
|
| -------------------- | -------- | ---------------------------------------- |
| focusable | boolean | 设置当前组件是否可以获焦。
<br/>
**说明:**
<br/>
存在默认交互逻辑的组件例如Button、TextInput等,默认即为可获焦,Text、Image等组件则默认状态为不可获焦。
|
| focusable | boolean | 设置当前组件是否可以获焦。
<br/>
**说明:**
<br/>
存在默认交互逻辑的组件例如Button、TextInput等,默认即为可获焦,Text、Image等组件则默认状态为不可获焦。
不可获焦状态下,无法触发
[
焦点事件
](
ts-universal-focus-event.md
)
。
|
| tabIndex
<sup>
9+
<sup>
| number | 自定义组件tab键走焦能力,走焦顺序为:tabIndex大于0的组件依次递增走焦, tabIndex等于0的组件按组件树先后顺序走焦。
<br
/>
- tabIndex >= 0:表示元素是可聚焦的,并且可以通过tab键走焦来访问到该元素,tabIndex值越小,则优先获焦;反之,则后获焦。如果多个元素拥有相同的tabIndex,按照元素在当前组件树中的先后顺序获焦
<br
/>
- tabIndex
<
0(
通常是tabIndex =
-1):表示元素是可聚焦的,但是不能通过tab键走焦来访问到该元素。<br/
>
默认值:0 |
| defaultFocus
<sup>
9+
<sup>
| boolean | 设置当前组件是否为当前页面上的默认焦点,仅在初次创建的页面第一次进入时生效。
<br/>
默认值:false |
| groupDefaultFocus
<sup>
9+
<sup>
| boolean | 设置当前组件是否为当前组件所在容器获焦时的默认焦点,仅在初次创建容器节点第一次获焦时生效。
<br/>
默认值:false
<br/>
**说明:**
必须与tabIndex联合使用,当某个容器设置了tabIndex,且容器内某子组件设置了groupDefaultFocus,当该容器首次获焦时,会自动将焦点转移至该组件上。
<br/>
|
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录