Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
57b2d108
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看板
未验证
提交
57b2d108
编写于
6月 27, 2023
作者:
C
Claudia335
提交者:
Gitee
6月 27, 2023
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md.
Signed-off-by:
N
Claudia335
<
gaoweihua2@huawei.com
>
上级
e0c7f7b3
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
3 addition
and
2 deletion
+3
-2
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md
.../reference/arkui-ts/ts-universal-attributes-background.md
+3
-2
未找到文件。
zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md
浏览文件 @
57b2d108
...
@@ -14,7 +14,7 @@
...
@@ -14,7 +14,7 @@
| backgroundImage | src:
[ResourceStr](ts-types.md#resourcestr),
<br/>
repeat?:
[
ImageRepeat
](
ts-appendix-enums.md#imagerepeat
)
| src:图片地址,支持网络图片资源地址和本地图片资源地址和Base64,不支持svg类型的图片。
<br/>
repeat:设置背景图片的重复样式,默认不重复。当设置的背景图片为透明底色图片,且同时设置了backgroundColor时,二者叠加显示,背景颜色在最底部。
<br/>
从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImage | src:
[ResourceStr](ts-types.md#resourcestr),
<br/>
repeat?:
[
ImageRepeat
](
ts-appendix-enums.md#imagerepeat
)
| src:图片地址,支持网络图片资源地址和本地图片资源地址和Base64,不支持svg类型的图片。
<br/>
repeat:设置背景图片的重复样式,默认不重复。当设置的背景图片为透明底色图片,且同时设置了backgroundColor时,二者叠加显示,背景颜色在最底部。
<br/>
从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImageSize | {
<br/>
width?:
[Length](ts-types.md#length),
<br/>
height?:
[Length](ts-types.md#length)
<br/>
}
\|
[
ImageSize
](
ts-appendix-enums.md#imagesize
)
| 设置背景图像的高度和宽度。当输入为{width:
Length,
height:
Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。
<br/>
width和height取值范围:
[
0, +∞)<br/>默认值:ImageSize.Auto<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:** <br/>设置为小于0的值时,按值为0显示。当设置了height未设置width时,width根据图片原始宽高比进行调整。 |
| backgroundImageSize | {
<br/>
width?:
[Length](ts-types.md#length),
<br/>
height?:
[Length](ts-types.md#length)
<br/>
}
\|
[
ImageSize
](
ts-appendix-enums.md#imagesize
)
| 设置背景图像的高度和宽度。当输入为{width:
Length,
height:
Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。
<br/>
width和height取值范围:
[
0, +∞)<br/>默认值:ImageSize.Auto<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:** <br/>设置为小于0的值时,按值为0显示。当设置了height未设置width时,width根据图片原始宽高比进行调整。 |
| backgroundImagePosition | [Position
](
ts-types.md#position8
)
\|
[
Alignment
](
ts-appendix-enums.md#alignment
)
| 设置背景图在组件中显示位置,即相对于组件左上角的坐标。
<br/>
默认值:
<br/>
{
<br/>
x:
0,
<br/>
y:
0
<br/>
}
<br/>
x和y值设置百分比时,偏移量是相对组件自身宽高计算的。
<br/>
从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImagePosition | [Position
](
ts-types.md#position8
)
\|
[
Alignment
](
ts-appendix-enums.md#alignment
)
| 设置背景图在组件中显示位置,即相对于组件左上角的坐标。
<br/>
默认值:
<br/>
{
<br/>
x:
0,
<br/>
y:
0
<br/>
}
<br/>
x和y值设置百分比时,偏移量是相对组件自身宽高计算的。
<br/>
从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundBlurStyle
<sup>
9+
</sup>
| value:
[
BlurStyle
](
ts-appendix-enums.md#blurstyle9
)
,
<br/>
options
<sup>
10+
</sup>
?:
[
BackgroundBlurStyleOptions
](
#backgroundblurstyleoptions10对象说明
)
| 为当前组件提供一种在背景和内容之间的模糊能力。
<br/>
value: 背景模糊样式。模糊样式中封装了模糊半径、蒙版颜色、蒙版透明度、饱和度
四
个参数。
<br/>
options: 可选参数,背景模糊选项。
<br/>
该接口支持在ArkTS卡片中使用。 |
| backgroundBlurStyle
<sup>
9+
</sup>
| value:
[
BlurStyle
](
ts-appendix-enums.md#blurstyle9
)
,
<br/>
options
<sup>
10+
</sup>
?:
[
BackgroundBlurStyleOptions
](
#backgroundblurstyleoptions10对象说明
)
| 为当前组件提供一种在背景和内容之间的模糊能力。
<br/>
value: 背景模糊样式。模糊样式中封装了模糊半径、蒙版颜色、蒙版透明度、饱和度
、亮度五
个参数。
<br/>
options: 可选参数,背景模糊选项。
<br/>
该接口支持在ArkTS卡片中使用。 |
## BackgroundBlurStyleOptions<sup>10+</sup>对象说明
## BackgroundBlurStyleOptions<sup>10+</sup>对象说明
...
@@ -22,6 +22,7 @@
...
@@ -22,6 +22,7 @@
| --------------------------- | ------------------------------------------------------- | ---- | ------------------------------------------------------------ |
| --------------------------- | ------------------------------------------------------- | ---- | ------------------------------------------------------------ |
| colorMode
<sup>
10+
</sup>
|
[
ThemeColorMode
](
ts-appendix-enums.md#themecolormode10
)
| 否 | 背景模糊效果使用的深浅色模式。
<br/>
默认值:ThemeColorMode.System |
| colorMode
<sup>
10+
</sup>
|
[
ThemeColorMode
](
ts-appendix-enums.md#themecolormode10
)
| 否 | 背景模糊效果使用的深浅色模式。
<br/>
默认值:ThemeColorMode.System |
| adaptiveColor
<sup>
10+
</sup>
|
[
AdaptiveColor
](
ts-appendix-enums.md#adaptivecolor10
)
| 否 | 背景模糊效果使用的取色模式。
<br/>
默认值:AdaptiveColor.Default |
| adaptiveColor
<sup>
10+
</sup>
|
[
AdaptiveColor
](
ts-appendix-enums.md#adaptivecolor10
)
| 否 | 背景模糊效果使用的取色模式。
<br/>
默认值:AdaptiveColor.Default |
| scale
<sup>
10+
</sup>
| number | 否 | 背景材质模糊效果程度。此参数为系统接口。
<br/>
默认值:1.0
<br/>
取值范围:[0.0, 1.0]
<br/>
|
## 示例
## 示例
...
@@ -109,7 +110,7 @@ struct BackgroundBlurStyleDemo {
...
@@ -109,7 +110,7 @@ struct BackgroundBlurStyleDemo {
}
}
.
width
(
'
50%
'
)
.
width
(
'
50%
'
)
.
height
(
'
50%
'
)
.
height
(
'
50%
'
)
.
backgroundBlurStyle
(
BlurStyle
.
Thin
,
{
colorMode
:
ThemeColorMode
.
LIGHT
,
adaptiveColor
:
AdaptiveColor
.
DEFAULT
})
.
backgroundBlurStyle
(
BlurStyle
.
Thin
,
{
colorMode
:
ThemeColorMode
.
LIGHT
,
adaptiveColor
:
AdaptiveColor
.
DEFAULT
,
scale
:
1.0
})
.
position
({
x
:
'
15%
'
,
y
:
'
30%
'
})
.
position
({
x
:
'
15%
'
,
y
:
'
30%
'
})
}
}
.
height
(
'
100%
'
)
.
height
(
'
100%
'
)
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录