Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
47a97167
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看板
提交
47a97167
编写于
7月 10, 2023
作者:
H
HelloCrease
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update docs
Signed-off-by:
N
HelloCrease
<
lian15@huawei.com
>
上级
d6155871
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
8 addition
and
42 deletion
+8
-42
zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001250492613.gif
...ference/arkui-ts/figures/zh-cn_image_0000001250492613.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
+8
-42
未找到文件。
zh-cn/application-dev/reference/arkui-ts/figures/zh-cn_image_0000001250492613.gif
查看替换文件 @
d6155871
浏览文件 @
47a97167
189.2 KB
|
W:
|
H:
57.5 KB
|
W:
|
H:
2-up
Swipe
Onion skin
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
浏览文件 @
47a97167
...
...
@@ -50,7 +50,7 @@ Image(src: string | PixelMap | Resource)
| syncLoad
<sup>
8+
</sup>
| boolean | 设置是否同步加载图片,默认是异步加载。同步加载时阻塞UI线程,不会显示占位图。
<br/>
默认值:false
<br/>
从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| copyOption
<sup>
9+
</sup>
|
[
CopyOptions
](
ts-appendix-enums.md#copyoptions9
)
| 设置图片是否可复制(SVG图片不支持复制)。
<br/>
当copyOption设置为非CopyOptions.None时,支持使用长按、鼠标右击、快捷组合键'CTRL+C'等方式进行复制。
<br/>
默认值:CopyOptions.None
<br/>
该接口支持在ArkTS卡片中使用。 |
| colorFilter
<sup>
9+
</sup>
|
[
ColorFilter
](
ts-types.md#colorfilter9
)
| 给图像设置颜色滤镜效果。
<br/>
该接口支持在ArkTS卡片中使用。 |
| draggable
<sup>
9+
</sup>
| boolean
| 设置默认拖拽效果。(不能和
[
onDragStart
](
ts-universal-events-drag-drop.md
)
事件同时使用。)
<br/>
默认值:false |
| draggable
<sup>
9+
</sup>
| boolean
| 设置默认拖拽效果。(不能和
[
onDragStart
](
ts-universal-events-drag-drop.md
)
事件同时使用。)
<br/>
默认值:false |
> **说明:**
>
...
...
@@ -97,61 +97,27 @@ Image(src: string | PixelMap | Resource)
@
Entry
@
Component
struct
ImageExample1
{
private
on
:
string
=
'
www.example.com
'
@
State
src
:
string
=
this
.
on
build
()
{
Column
()
{
Flex
({
direction
:
FlexDirection
.
Column
,
alignItems
:
ItemAlign
.
Start
})
{
Text
(
'
default
'
).
fontSize
(
16
).
fontColor
(
0xcccccc
).
height
(
30
)
Row
({
space
:
5
})
{
Image
(
$r
(
'
app.media.
ic
_png
'
))
Image
(
$r
(
'
app.media.
example
_png
'
))
.
width
(
110
).
height
(
110
).
border
({
width
:
1
})
.
overlay
(
'
png
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
Image
(
$r
(
'
app.media.
ic
_gif
'
))
Image
(
$r
(
'
app.media.
example
_gif
'
))
.
width
(
110
).
height
(
110
).
border
({
width
:
1
})
.
overlay
(
'
gif
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
Image
(
$r
(
'
app.media.ic_svg
'
))
.
width
(
110
).
height
(
110
).
border
({
width
:
1
})
.
overlay
(
'
svg
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
}
Row
({
space
:
5
})
{
Image
(
$r
(
'
app.media.
img_example
'
))
Image
(
$r
(
'
app.media.
example_svg
'
))
.
width
(
110
).
height
(
110
).
border
({
width
:
1
})
.
overlay
(
'
jp
g
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
Image
(
this
.
src
)
.
overlay
(
'
sv
g
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
Image
(
$r
(
'
app.media.example_jpg
'
)
)
.
width
(
110
).
height
(
110
).
border
({
width
:
1
})
.
overlay
(
'
network
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
.
overlay
(
'
jpg
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
}.
margin
({
top
:
25
,
bottom
:
10
})
}
Flex
({
direction
:
FlexDirection
.
Column
,
alignItems
:
ItemAlign
.
Start
})
{
Text
(
'
objectFit
'
).
fontSize
(
16
).
fontColor
(
0xcccccc
).
height
(
30
)
Row
({
space
:
5
})
{
Image
(
$r
(
'
app.media.img_example
'
))
.
border
({
width
:
1
})
.
objectFit
(
ImageFit
.
None
).
width
(
110
).
height
(
110
)
.
overlay
(
'
None
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
Image
(
$r
(
'
app.media.img_example
'
))
.
border
({
width
:
1
})
.
objectFit
(
ImageFit
.
Fill
).
width
(
110
).
height
(
110
)
.
overlay
(
'
Fill
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
Image
(
$r
(
'
app.media.img_example
'
))
.
border
({
width
:
1
})
.
objectFit
(
ImageFit
.
Cover
).
width
(
110
).
height
(
110
)
.
overlay
(
'
Cover
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
}
Row
({
space
:
5
})
{
Image
(
$r
(
'
app.media.img_example_w250
'
))
.
border
({
width
:
1
})
.
objectFit
(
ImageFit
.
Contain
).
width
(
110
).
height
(
110
)
.
overlay
(
'
Contain
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
Image
(
$r
(
'
app.media.img_example_w250
'
))
.
border
({
width
:
1
})
.
objectFit
(
ImageFit
.
ScaleDown
).
width
(
110
).
height
(
110
)
.
overlay
(
'
ScaleDown
'
,
{
align
:
Alignment
.
Bottom
,
offset
:
{
x
:
0
,
y
:
20
}
})
}.
margin
({
top
:
25
})
}
}.
height
(
320
).
width
(
360
).
padding
({
right
:
10
,
top
:
10
})
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录