• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# 资源分类与访问
2
3应用开发过程中,经常需要用到颜色、字体、间距、图片等资源,在不同的设备或配置中,这些资源的值可能不同。
4
5- 应用资源:借助资源文件能力,开发者在应用中自定义资源,自行管理这些资源在不同的设备或配置中的表现。
6
7- 系统资源:开发者直接使用系统预置的资源定义(即[分层参数](../../design/ux-design/design-resources.md),同一资源ID在设备类型、深浅色等不同配置下有不同的取值)。
8
9## 资源分类
10
11应用开发中使用的各类资源文件,需要放入特定子目录中存储管理。资源目录的示例如下所示,base目录、限定词目录、rawfile目录、resfile目录称为资源目录,element、media、profile称为资源组目录。
12
13> **说明**
14>
15> stage模型多工程情况下,共有的资源文件放到AppScope下的resources目录。
16
17资源目录示例:
18```
19resources
20|---base
21|   |---element
22|   |   |---string.json
23|   |---media
24|   |   |---icon.png
25|   |---profile
26|   |   |---test_profile.json
27|---en_US  // 默认存在的目录,设备语言环境是美式英文时,优先匹配此目录下资源
28|   |---element
29|   |   |---string.json
30|   |---media
31|   |   |---icon.png
32|   |---profile
33|   |   |---test_profile.json
34|---zh_CN  // 默认存在的目录,设备语言环境是简体中文时,优先匹配此目录下资源
35|   |---element
36|   |   |---string.json
37|   |---media
38|   |   |---icon.png
39|   |---profile
40|   |   |---test_profile.json
41|---en_GB-vertical-car-mdpi // 自定义限定词目录示例,由开发者创建
42|   |---element
43|   |   |---string.json
44|   |---media
45|   |   |---icon.png
46|   |---profile
47|   |   |---test_profile.json
48|---rawfile // 其他类型文件,原始文件形式保存,不会被集成到resources.index文件中。文件名可自定义。
49|---resfile // 其他类型文件,原始文件形式保存,不会被集成到resources.index文件中。文件名可自定义。
50```
51### 资源目录
52
53#### base目录
54
55base目录是默认存在的目录,二级子目录element用于存放字符串、颜色、布尔值等基础元素,media、profile存放媒体、动画、布局等资源文件。<br/>
56目录中的资源文件会被编译成二进制文件,并赋予资源文件ID。通过指定资源类型(type)和资源名称(name)引用。
57
58#### 限定词目录
59
60en_US和zh_CN是默认存在的两个限定词目录,其余限定词目录需要开发者根据开发需要自行创建。二级子目录element、media、profile用于存放字符串、颜色、布尔值等基础元素,以及媒体、动画、布局等资源文件。<br/>同样,目录中的资源文件会被编译成二进制文件,并赋予资源文件ID。通过指定资源类型(type)和资源名称(name)来引用。
61
62**限定词目录的命名要求**
63
64限定词目录可以由一个或多个表征应用场景或设备特征的限定词组合而成,包括移动国家码和移动网络码、语言、文字、国家或地区、横竖屏、设备类型、颜色模式和屏幕密度等维度,限定词之间通过下划线(\_)或者中划线(\-)连接。开发者在创建限定词目录时,需要遵守限定词目录的命名规则。
65
66- 限定词的组合顺序:\_移动国家码_移动网络码-语言_文字_国家或地区-横竖屏-设备类型-颜色模式-屏幕密度_。开发者可以根据应用的使用场景和设备特征,选择其中的一类或几类限定词组成目录名称。
67
68- 限定词的连接方式:语言、文字、国家或地区之间采用下划线(\_)连接,移动国家码和移动网络码之间也采用下划线(\_)连接,除此之外的其他限定词之间均采用中划线(-)连接。例如:**zh_Hant_CN**、**zh_CN-car-ldpi**。
69
70- 限定词的取值范围:每类限定词的取值必须符合限定词取值要求表中的条件,如表2。否则,将无法匹配目录中的资源文件。
71
72表2 限定词取值要求
73
74| 限定词类型       | 含义与取值说明                                  |
75| ----------- | ---------------------------------------- |
76| 移动国家码和移动网络码 | 移动国家码(MCC)和移动网络码(MNC)的值取自设备注册的网络。<br/>MCC可与MNC合并使用,使用下划线(_)连接,也可以单独使用。例如:mcc460表示中国,mcc460_mnc00表示中国_中国移动。<br/>详细取值范围,请查阅**ITU-T&nbsp;E.212**(国际电联相关标准)。 |
77| 语言          | 表示设备使用的语言类型,由2~3个小写字母组成。例如:zh表示中文,en表示英语,mai表示迈蒂利语。<br/>详细取值范围,请查阅**ISO&nbsp;639**(ISO制定的语言编码标准)。 |
78| 文字          | 表示设备使用的文字类型,由1个大写字母(首字母)和3个小写字母组成。例如:Hans表示简体中文,Hant表示繁体中文。<br/>详细取值范围,请查阅**ISO&nbsp;15924**(ISO制定的文字编码标准)。 |
79| 国家或地区       | 表示用户所在的国家或地区,由2~3个大写字母或者3个数字组成。例如:CN表示中国,GB表示英国。<br/>详细取值范围,请查阅**ISO&nbsp;3166-1**(ISO制定的国家和地区编码标准)。 |
80| 横竖屏         | 表示设备的屏幕方向,取值如下:<br/>-&nbsp;vertical:竖屏<br/>-&nbsp;horizontal:横屏 |
81| 设备类型        | 表示设备的类型,取值如下:<br/>-&nbsp;car:车机<br/>-&nbsp;tablet:平板<br/>-&nbsp;tv:智慧屏<br/>-&nbsp;wearable:智能穿戴 |
82| 颜色模式        | 表示设备的颜色模式,取值如下:<br/>-&nbsp;dark:深色模式<br/>-&nbsp;light:浅色模式 |
83| 屏幕密度        | 表示设备的屏幕密度(单位为dpi),取值如下:<br/>-&nbsp;sdpi:表示小规模的屏幕密度(Small-scale&nbsp;Dots&nbsp;Per&nbsp;Inch),适用于dpi取值为(0,&nbsp;120]的设备。<br/>-&nbsp;mdpi:表示中规模的屏幕密度(Medium-scale&nbsp;Dots&nbsp;Per&nbsp;Inch),适用于dpi取值为(120,&nbsp;160]的设备。<br/>-&nbsp;ldpi:表示大规模的屏幕密度(Large-scale&nbsp;Dots&nbsp;Per&nbsp;Inch),适用于dpi取值为(160,&nbsp;240]的设备。<br/>-&nbsp;xldpi:表示特大规模的屏幕密度(Extra&nbsp;Large-scale&nbsp;Dots&nbsp;Per&nbsp;Inch),适用于dpi取值为(240,&nbsp;320]的设备。<br/>-&nbsp;xxldpi:表示超大规模的屏幕密度(Extra&nbsp;Extra&nbsp;Large-scale&nbsp;Dots&nbsp;Per&nbsp;Inch),适用于dpi取值为(320,&nbsp;480]的设备。<br/>-&nbsp;xxxldpi:表示超特大规模的屏幕密度(Extra&nbsp;Extra&nbsp;Extra&nbsp;Large-scale&nbsp;Dots&nbsp;Per&nbsp;Inch),适用于dpi取值为(480,&nbsp;640]的设备。 |
84
85#### rawfile目录
86
87支持创建多层子目录,子目录名称可以自定义,文件夹内可以自由放置各类资源文件。<br/>目录中的资源文件会被直接打包进应用,不经过编译,也不会被赋予资源文件ID。通过指定文件路径和文件名引用。
88
89#### resfile目录
90
91支持创建多层子目录,子目录名称可以自定义,文件夹内可以自由放置各类资源文件。<br/>目录中的资源文件会被直接打包进应用,不经过编译,也不会被赋予资源文件ID。应用安装后,resfile资源会被解压到应用沙箱路径,通过Context属性[resourceDir](../reference/apis-ability-kit/js-apis-inner-application-context.md#属性)获取到resfile资源目录后,可通过文件路径访问。
92
93### 资源组目录
94
95资源组目录包括element、media、profile三种类型的资源文件,用于存放特定类型资源。
96
97  表3 资源组目录说明
98
99| 目录类型    | 说明                                     | 资源文件                                     |
100| --------- | ---------------------------------------- | ---------------------------------------- |
101| element | 表示元素资源,以下每一类数据都采用相应的JSON文件来表征(目录下仅支持文件类型)。<br/>-&nbsp;boolean,布尔型<br/>-&nbsp;color,颜色<br/>-&nbsp;float,浮点型,范围是-2^128-2^128<br/>-&nbsp;intarray,整型数组<br/>-&nbsp;integer,整型,范围是-2^31-2^31-1<br/>-&nbsp;pattern,样式(仅支持系统应用使用)<br/>-&nbsp;plural,复数形式<br/>-&nbsp;strarray,字符串数组<br/>-&nbsp;string,字符串 <br/>-&nbsp;theme,主题(仅支持系统应用使用)| element目录中的文件名称建议与下面的文件名保持一致。每个文件中只能包含同一类型的数据。<br/>-&nbsp;boolean.json<br/>-&nbsp;color.json<br/>-&nbsp;float.json<br/>-&nbsp;intarray.json<br/>-&nbsp;integer.json<br/>-&nbsp;pattern.json<br/>-&nbsp;plural.json<br/>-&nbsp;strarray.json<br/>-&nbsp;string.json <br/>-&nbsp;theme.json|
102| media   | 表示媒体资源,包括图片、音频、视频等非文本格式的文件(目录下只支持文件类型)。<br/>图片和音视频的类型说明见表4和表5。              | 文件名可自定义,例如:icon.png。                     |
103| profile  | 表示自定义配置文件,其文件内容可[通过包管理接口](../reference/apis-ability-kit/js-apis-bundleManager.md#bundlemanagergetprofilebyability)获取(目录下只支持文件类型)。       | 文件名可自定义,例如:test_profile.json。           |
104
105**媒体资源类型说明**
106
107表4 图片资源类型说明
108
109| 格式   | 文件后缀名 |
110| ---- | ----- |
111| JPEG | .jpg  |
112| PNG  | .png  |
113| GIF  | .gif  |
114| SVG  | .svg  |
115| WEBP | .webp |
116| BMP  | .bmp  |
117
118表5 音视频资源类型说明
119
120| 格式                                   | 支持的文件类型         |
121| ------------------------------------ | --------------- |
122| H.264 AVC |.3gp |
123| Baseline Profile (BP) | .mp4   |
124
125**资源文件示例**
126
127color.json文件的内容如下:
128
129```json
130{
131    "color": [
132        {
133            "name": "color_hello",
134            "value": "#ffff0000"
135        },
136        {
137            "name": "color_world",
138            "value": "#ff0000ff"
139        }
140    ]
141}
142```
143
144float.json文件的内容如下:
145
146```json
147{
148    "float":[
149        {
150            "name":"font_hello",
151            "value":"28.0fp"
152        },
153	{
154            "name":"font_world",
155            "value":"20.0fp"
156        }
157    ]
158}
159```
160
161string.json文件的内容如下:
162
163```json
164{
165    "string":[
166        {
167            "name":"string_hello",
168            "value":"Hello"
169        },
170	{
171            "name":"string_world",
172            "value":"World"
173        },
174	{
175            "name":"message_arrive",
176            "value":"We will arrive at %s."
177        }
178    ]
179}
180```
181
182plural.json文件的内容如下:
183
184```json
185{
186    "plural":[
187        {
188            "name":"eat_apple",
189            "value":[
190                {
191                    "quantity":"one",
192                    "value":"%d apple"
193                },
194                {
195                    "quantity":"other",
196                    "value":"%d apples"
197                }
198            ]
199        }
200    ]
201}
202```
203
204## 创建资源目录和资源文件
205
206在resources目录下,可按照限定词目录命名规则,以及资源组目录支持的文件类型和说明,创建资源目录和资源组目录,添加特定类型资源。DevEco Studio支持同时创建资源目录和资源文件,也支持单独创建资源目录或资源文件。
207
208### 创建资源目录和资源文件
209
210在resources目录右键菜单选择“New > Resource File”,可同时创建资源目录和资源文件,文件默认创建在base目录的对应资源组。如果选择了限定词,则会按照命名规范自动生成限定词和资源组目录,并将文件创建在限定词目录中。
211
212图中File name为需要创建的文件名。Resource type为资源组类型,默认是element。Root Element为资源类型。Avaliable qualifiers为供选择的限定词目录,通过右边的小箭头可添加或者删除。<br/>创建的目录名自动生成,格式固定为“限定词.资源组”,例如:创建一个限定词为dark的element目录,自动生成的目录名称为“dark.element”。
213
214  ![create-resource-file-1](figures/create-resource-file-1.png)
215
216### 创建资源目录
217
218在resources目录右键菜单选择“New > Resource Directory”,可创建资源目录,默认创建的是base目录。如果选择了限定词,则会按照命名规范自动生成限定词和资源组目录。确定限定词后,选择资源组类型,当前资源组类型支持Element、Media、Profile三种,创建后生成资源目录。
219
220  ![create-resource-file-2](figures/create-resource-file-2.png)
221
222### 创建资源文件
223
224在资源目录(element、media、profile)的右键菜单选择“New > XXX Resource File”,即可创建对应资源组目录的资源文件。例如,在element目录下可新建Element Resource File。
225
226  ![create-resource-file-3](figures/create-resource-file-3.png)
227
228## 资源访问
229
230### 应用资源
231
232#### 单HAP包资源
233
234 - 通过```"$r"```或```"$rawfile"```引用资源。<br/>对于“color”、“float”、“string”、“plural”、“media”、“profile”等类型的资源,通过```"$r('app.type.name')"```形式引用。其中,app为resources目录中定义的资源;type为资源类型或资源的存放位置;name为资源名,开发者定义资源时确定。<br/>对于rawfile目录资源,通过```"$rawfile('filename')"```形式引用。其中,filename为rawfile目录下文件的相对路径,文件名需要包含后缀,路径开头不可以"/"开头。
235
236  > **说明:**
237  >
238  > rawfile的native的访问方式请参考[Rawfile开发指导](../napi/rawfile-guidelines.md)。
239
240  [资源组目录](#资源组目录)下的“资源文件示例”显示了.json文件内容,包含color.json文件、string.json文件和plural.json文件,访问应用资源时需先了解.json文件的使用规范。<br/>资源的具体使用方法如下:
241
242```ts
243Text('Hello')
244  .fontColor($r('sys.color.ohos_id_color_emphasize'))
245  .fontSize($r('sys.float.ohos_id_text_size_headline1'))
246  .fontFamily($r('sys.string.ohos_id_text_font_family_medium'))
247  .backgroundColor($r('sys.color.ohos_id_color_palette_aux1'))
248
249Image($r('sys.media.ohos_app_icon'))
250  .border({
251    color: $r('sys.color.ohos_id_color_palette_aux1'),
252    radius: $r('sys.float.ohos_id_corner_radius_button'), width: 2
253  })
254  .margin({
255    top: $r('sys.float.ohos_id_elements_margin_horizontal_m'),
256    bottom: $r('sys.float.ohos_id_elements_margin_horizontal_l')
257  })
258  .height(200)
259  .width(300)
260```
261
262- 通过本应用上下文获取ResourceManager后,调用不同[资源管理接口](../reference/apis-localization-kit/js-apis-resource-manager.md)访问不同资源。<br/>例如:getContext.resourceManager.getStringByNameSync('app.string.XXX') 可获取字符串资源;getContext.resourceManager.getRawFd('rawfilepath') 可获取Rawfile所在hap包的descriptor信息,访问rawfile文件时需{fd, offset, length}一起使用。
263
264#### 跨HAP/HSP包资源
265
266##### bundle不同,跨bundle访问(仅支持系统应用使用)
267
268- 通过createModuleContext(bundleName, moduleName)接口创建对应HAP/HSP包的上下文,获取resourceManager对象后,调用不同[资源管理接口](../reference/apis-localization-kit/js-apis-resource-manager.md)访问不同资源。<br/>例如:getContext.createModuleContext(bundleName, moduleName).resourceManager.getStringByNameSync('app.string.XXX')。
269
270##### bundle相同,跨module访问
271
272- 通过createModuleContext(moduleName)接口创建同应用中不同module的上下文,获取resourceManager对象后,调用不同接口访问不同资源。<br/>例如:getContext.createModuleContext(moduleName).resourceManager.getStringByNameSync('app.string.XXX')。
273
274
275### 系统资源
276
277除了自定义资源,开发者也可以使用系统中预定义的资源,统一应用的视觉风格。可以查看[应用UX设计中关于资源的介绍](../../design/ux-design/design-resources.md),获取支持的系统资源ID及其在不同配置下的取值。
278
279在开发过程中,分层参数的用法与资源限定词基本一致。对于系统资源,可以通过```“$r('sys.type.resource_id')”```的形式引用。其中,sys为系统资源;type为资源类型,取值包括“color”、“float”、“string”、“media”;resource_id为资源id。
280
281> **说明:**
282>
283> - 仅声明式开发范式支持使用系统资源。
284>
285> - 对于系统预置应用,建议使用系统资源;对于三方应用,可以根据需要选择使用系统资源或自定义应用资源。
286>
287> - 界面加载的系统资源字体进行显示时,可以在配置中system/etc/fontconfig.json文件查看。默认字体为HarmonyOS Sans。
288
289```ts
290Text('Hello')
291  .fontColor($r('sys.color.ohos_id_color_emphasize'))
292  .fontSize($r('sys.float.ohos_id_text_size_headline1'))
293  .fontFamily($r('sys.string.ohos_id_text_font_family_medium'))
294  .backgroundColor($r('sys.color.ohos_id_color_palette_aux1'))
295
296Image($r('sys.media.ohos_app_icon'))
297  .border({
298    color: $r('sys.color.ohos_id_color_palette_aux1'),
299    radius: $r('sys.float.ohos_id_corner_radius_button'), width: 2
300  })
301  .margin({
302    top: $r('sys.float.ohos_id_elements_margin_horizontal_m'),
303    bottom: $r('sys.float.ohos_id_elements_margin_horizontal_l')
304  })
305  .height(200)
306  .width(300)
307```
308
309## 资源匹配
310
311应用使用某资源时,系统会根据当前设备状态优先从相匹配的限定词目录中寻找该资源。只有当resources目录中没有与设备状态匹配的限定词目录,或者在限定词目录中找不到该资源时,才会去base目录中查找。rawfile是原始文件目录,不会根据设备状态去匹配不同的资源。
312
313**限定词目录与设备状态的匹配规则**
314
315- 在为设备匹配对应的资源文件时,限定词目录匹配的优先级从高到低依次为:移动国家码和移动网络码 > 区域(可选组合:语言、语言_文字、语言_国家或地区、语言_文字_国家或地区)> 横竖屏 > 设备类型 > 颜色模式 > 屏幕密度。
316
317- 如果限定词目录中包含移动国家码和移动网络码、语言、文字、横竖屏、设备类型、颜色模式限定词,则对应限定词的取值必须与当前的设备状态完全一致,该目录才能够参与设备的资源匹配。例如,限定词目录“zh_CN-car-ldpi”不能参与“en_US”设备的资源匹配。
318
319应用界面加载资源规则,更多请参考国际化和本地化文档。
320
321**overlay机制**
322
323overylay是一种资源替换机制,针对不同品牌、产品的显示风格,开发者可以在不重新打包业务逻辑hap的情况下,通过配置和使用overlay资源包,实现应用界面风格变换。
324
325- 动态overlay使用方式
326
3271、对应的overlay资源包需要放在对应应用安装路径下。如应用com.example.overlay的安装路径:data/app/el1/bundle/public/com.example.overlay/。
328
3292、应用通过[addResource(path)](../reference/apis-localization-kit/js-apis-resource-manager.md#addresource10),实现资源覆盖;通过[removeResource(path)](../reference/apis-localization-kit/js-apis-resource-manager.md#removeresource10),实现overlay删除。overlay资源路径需经过元能力的getContext().BundleCodeDir获取此应用对应的沙箱根目录,由应用的沙箱根目录+overlay的hsp名称组成。如:let path = getContext().bundleCodeDir + "hsp名",其对应沙箱路径为:/data/storage/el1/bundle/enter-release-signed.hsp330
331- 静态overlay配置方式
332
333在IDE中创建应用工程时,module的配置文件module.json5中包含targetModuleName和targetPriority字段时,该module将会在安装阶段被识别为overlay特征的module。overlay特征的module一般是为设备上存在的非overlay特征的module提供覆盖的资源文件,以便于targetModuleName指向的module在运行阶段可以使用overlay资源文件展示不同的颜色,标签,主题等等。
334
335该功能默认使能,其使能及去使能请参考[包管理接口](../reference/apis-ability-kit/js-apis-overlay.md)。
336
337## 相关实例
338
339针对访问应用资源,有以下相关实例可供参考:
340
341- [资源管理(ArkTS)(API10)](https://gitee.com/openharmony/applications_app_samples/tree/master/code/BasicFeature/Resource/ResourceManager)