0
  • 聊天消息
  • 系統(tǒng)消息
  • 評論與回復(fù)
登錄后你可以
  • 下載海量資料
  • 學(xué)習(xí)在線課程
  • 觀看技術(shù)視頻
  • 寫文章/發(fā)帖/加入社區(qū)
會員中心
創(chuàng)作中心

完善資料讓更多小伙伴認識你,還能領(lǐng)取20積分哦,立即完善>

3天內(nèi)不再提示

鴻蒙OS開發(fā):【一次開發(fā),多端部署】應(yīng)用(資源使用)

jf_46214456 ? 來源:jf_46214456 ? 作者:jf_46214456 ? 2024-05-21 15:43 ? 次閱讀

資源使用

在頁面開發(fā)過程中,經(jīng)常需要用到顏色、字體、間距、圖片等資源,在不同的設(shè)備或配置中,這些資源的值可能不同。有兩種方式處理:

  • [應(yīng)用資源]:借助資源文件能力,開發(fā)者在應(yīng)用中自定義資源,自行管理這些資源在不同的設(shè)備或配置中的表現(xiàn)。
  • [系統(tǒng)資源]:開發(fā)者直接使用系統(tǒng)預(yù)置的資源定義(即分層參數(shù))。
  • 開發(fā)前請熟悉鴻蒙開發(fā)指導(dǎo)文檔 :[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md]

應(yīng)用資源

資源文件介紹

應(yīng)用開發(fā)中使用的各類自定義資源文件,需要統(tǒng)一存放于應(yīng)用的resources目錄下,便于使用和維護。resources目錄包括兩大類目錄,一類為base目錄與限定詞目錄,另一類為rawfile目錄,其基礎(chǔ)目錄結(jié)構(gòu)如下所示。

resources
|---base  // 默認存在的目錄
|   |---element
|   |   |---string.json
|   |---media
|   |   |---icon.png
|---en_GB-vertical-car-mdpi // 限定詞目錄示例,需要開發(fā)者自行創(chuàng)建   
|   |---element
|   |   |---string.json
|   |---media
|   |   |---icon.png
|---rawfile  // rawfile目錄

base目錄默認存在,而限定詞目錄需要開發(fā)者自行創(chuàng)建,其名稱可以由一個或多個表征應(yīng)用場景或設(shè)備特征的限定詞組合而成。應(yīng)用使用某資源時,系統(tǒng)會根據(jù)當(dāng)前設(shè)備狀態(tài)優(yōu)先從相匹配的限定詞目錄中尋找該資源。只有當(dāng)resources目錄中沒有與設(shè)備狀態(tài)匹配的限定詞目錄,或者在限定詞目錄中找不到該資源時,才會去base目錄中查找。rawfile是原始文件目錄,它不會根據(jù)設(shè)備狀態(tài)去匹配不同的資源,故不在本文的討論范文內(nèi)。

說明:

  • 了解限定詞目錄的命名規(guī)則、創(chuàng)建流程、匹配規(guī)則等,本文不展開介紹。
  • 沒有設(shè)備狀態(tài)匹配的限定詞目錄,或者在限定詞目錄中找不到目標資源時,會繼續(xù)在base目錄中查找。 強烈建議對于所有應(yīng)用自定義資源都在base目錄中定義默認值 ,防止出現(xiàn)找不到資源值的異常場景。
  • 類Web開發(fā)范式的資源文件路徑及資源限定詞的使用與聲明式范式不同。

base目錄與限定詞目錄下面可以創(chuàng)建資源組目錄(包括element、media等),用于存放特定類型的資源文件。

資源組目錄目錄說明資源文件
element表示元素資源,以下每一類數(shù)據(jù)都采用相應(yīng)的JSON文件來表征。 - boolean,布爾型 - color,顏色 - float,浮點型 - intarray,整型數(shù)組 - integer,整型 - pattern,樣式 - plural,復(fù)數(shù)形式 - strarray,字符串?dāng)?shù)組 - string,字符串element目錄中的文件名稱建議與下面的文件名保持一致。每個文件中只能包含同一類型的數(shù)據(jù)。 - boolean.json - color.json - float.json - intarray.json - integer.json - pattern.json - plural.json - strarray.json - string.json
media表示媒體資源,包括圖片、音頻、視頻等非文本格式的文件。文件名可自定義,例如:icon.png。

在element目錄的各個資源文件中,以“name-value”的形式定義資源,如下所示。而在media目錄中,直接以文件名作為name,故開發(fā)者將文件放入media目錄即可,無需再額外定義name。

// color.json 
{
    "color": [
        {
            "name": "color_red",
            "value": "#ffff0000"
        },
        {
            "name": "color_blue",
            "value": "#ff0000ff"
        }
    ]
}

訪問應(yīng)用資源

在工程中,通過 "$r('app.type.name')" 的形式引用應(yīng)用資源。app代表是應(yīng)用內(nèi)resources目錄中定義的資源;type 代表資源類型(或資源的存放位置),可以取 color、float、string、plural和media,name代表資源命名,由開發(fā)者添加資源時確定。

資源分類與訪問

應(yīng)用開發(fā)過程中,經(jīng)常需要用到顏色、字體、間距、圖片等資源,在不同的設(shè)備或配置中,這些資源的值可能不同。

  • 應(yīng)用資源:借助資源文件能力,開發(fā)者在應(yīng)用中自定義資源,自行管理這些資源在不同的設(shè)備或配置中的表現(xiàn)。
  • 系統(tǒng)資源:開發(fā)者直接使用系統(tǒng)預(yù)置的資源定義即[分層參數(shù)],同一資源ID在設(shè)備類型、深淺色等不同配置下有不同的取值)。

資源分類

應(yīng)用開發(fā)中使用的各類資源文件,需要放入特定子目錄中存儲管理。資源目錄的示例如下所示,base目錄、限定詞目錄、rawfile目錄、resfile目錄稱為資源目錄,element、media、profile稱為資源組目錄。

說明

stage模型多工程情況下,共有的資源文件放到AppScope下的resources目錄。

資源目錄示例:

resources
|---base
|   |---element
|   |   |---string.json
|   |---media
|   |   |---icon.png
|   |---profile
|   |   |---test_profile.json
|---en_US  // 默認存在的目錄,設(shè)備語言環(huán)境是美式英文時,優(yōu)先匹配此目錄下資源
|   |---element
|   |   |---string.json
|   |---media
|   |   |---icon.png
|   |---profile
|   |   |---test_profile.json
|---zh_CN  // 默認存在的目錄,設(shè)備語言環(huán)境是簡體中文時,優(yōu)先匹配此目錄下資源
|   |---element
|   |   |---string.json
|   |---media
|   |   |---icon.png
|   |---profile
|   |   |---test_profile.json
|---en_GB-vertical-car-mdpi // 自定義限定詞目錄示例,由開發(fā)者創(chuàng)建
|   |---element
|   |   |---string.json
|   |---media
|   |   |---icon.png
|   |---profile
|   |   |---test_profile.json
|---rawfile // 其他類型文件,原始文件形式保存,不會被集成到resources.index文件中。文件名可自定義。
|---resfile // 其他類型文件,原始文件形式保存,不會被集成到resources.index文件中。文件名可自定義。

資源目錄

base目錄

base目錄是默認存在的目錄,二級子目錄element用于存放字符串、顏色、布爾值等基礎(chǔ)元素,media、profile存放媒體、動畫、布局等資源文件。
目錄中的資源文件會被編譯成二進制文件,并賦予資源文件ID。通過指定資源類型(type)和資源名稱(name)引用。

限定詞目錄

en_US和zh_CN是默認存在的兩個限定詞目錄,其余限定詞目錄需要開發(fā)者根據(jù)開發(fā)需要自行創(chuàng)建。二級子目錄element、media、profile用于存放字符串、顏色、布爾值等基礎(chǔ)元素,以及媒體、動畫、布局等資源文件。
同樣,目錄中的資源文件會被編譯成二進制文件,并賦予資源文件ID。通過指定資源類型(type)和資源名稱(name)來引用。

限定詞目錄的命名要求

限定詞目錄可以由一個或多個表征應(yīng)用場景或設(shè)備特征的限定詞組合而成,包括移動國家碼和移動網(wǎng)絡(luò)碼、語言、文字、國家或地區(qū)、橫豎屏、設(shè)備類型、顏色模式和屏幕密度等維度,限定詞之間通過下劃線(_)或者中劃線(-)連接。開發(fā)者在創(chuàng)建限定詞目錄時,需要遵守限定詞目錄的命名規(guī)則。

  • 限定詞的組合順序: 移動國家碼_移動網(wǎng)絡(luò)碼-語言_文字_國家或地區(qū)-橫豎屏-設(shè)備類型-顏色模式-屏幕密度 。開發(fā)者可以根據(jù)應(yīng)用的使用場景和設(shè)備特征,選擇其中的一類或幾類限定詞組成目錄名稱。
  • 限定詞的連接方式:語言、文字、國家或地區(qū)之間采用下劃線( )連接,移動國家碼和移動網(wǎng)絡(luò)碼之間也采用下劃線( )連接,除此之外的其他限定詞之間均采用中劃線(-)連接。例如: zh_Hant_CNzh_CN-car-ldpi 。
  • 限定詞的取值范圍:每類限定詞的取值必須符合限定詞取值要求表中的條件,如表2。否則,將無法匹配目錄中的資源文件。

表2 限定詞取值要求

限定詞類型含義與取值說明
移動國家碼和移動網(wǎng)絡(luò)碼移動國家碼(MCC)和移動網(wǎng)絡(luò)碼(MNC)的值取自設(shè)備注冊的網(wǎng)絡(luò)。 MCC可與MNC合并使用,使用下劃線(_)連接,也可以單獨使用。例如:mcc460表示中國,mcc460_mnc00表示中國_中國移動。
語言表示設(shè)備使用的語言類型,由2~3個小寫字母組成。例如:zh表示中文,en表示英語,mai表示邁蒂利語。
文字表示設(shè)備使用的文字類型,由1個大寫字母(首字母)和3個小寫字母組成。例如:Hans表示簡體中文,Hant表示繁體中文。
國家或地區(qū)表示用戶所在的國家或地區(qū),由2~3個大寫字母或者3個數(shù)字組成。例如:CN表示中國,GB表示英國。
橫豎屏表示設(shè)備的屏幕方向,取值如下: - vertical:豎屏 - horizontal:橫屏
設(shè)備類型表示設(shè)備的類型,取值如下: - car:車機 - tablet:平板 - tv:智慧屏 - wearable:智能穿戴
顏色模式表示設(shè)備的顏色模式,取值如下: - dark:深色模式 - light:淺色模式
屏幕密度表示設(shè)備的屏幕密度(單位為dpi),取值如下: - sdpi:表示小規(guī)模的屏幕密度(Small-scale Dots Per Inch),適用于dpi取值為(0, 120]的設(shè)備。 - mdpi:表示中規(guī)模的屏幕密度(Medium-scale Dots Per Inch),適用于dpi取值為(120, 160]的設(shè)備。 - ldpi:表示大規(guī)模的屏幕密度(Large-scale Dots Per Inch),適用于dpi取值為(160, 240]的設(shè)備。 - xldpi:表示特大規(guī)模的屏幕密度(Extra Large-scale Dots Per Inch),適用于dpi取值為(240, 320]的設(shè)備。 - xxldpi:表示超大規(guī)模的屏幕密度(Extra Extra Large-scale Dots Per Inch),適用于dpi取值為(320, 480]的設(shè)備。 - xxxldpi:表示超特大規(guī)模的屏幕密度(Extra Extra Extra Large-scale Dots Per Inch),適用于dpi取值為(480, 640]的設(shè)備。

rawfile目錄

支持創(chuàng)建多層子目錄,子目錄名稱可以自定義,文件夾內(nèi)可以自由放置各類資源文件。
目錄中的資源文件會被直接打包進應(yīng)用,不經(jīng)過編譯,也不會被賦予資源文件ID。通過指定文件路徑和文件名引用。

resfile目錄

支持創(chuàng)建多層子目錄,子目錄名稱可以自定義,文件夾內(nèi)可以自由放置各類資源文件。
目錄中的資源文件會被直接打包進應(yīng)用,不經(jīng)過編譯,也不會被賦予資源文件ID。應(yīng)用安裝后,resfile資源會被解壓到應(yīng)用沙箱路徑,通過Context屬性[resourceDir]獲取到resfile資源目錄后,可通過文件路徑訪問。

資源組目錄

資源組目錄包括element、media、profile三種類型的資源文件,用于存放特定類型資源。

表3 資源組目錄說明

目錄類型說明資源文件
element表示元素資源,以下每一類數(shù)據(jù)都采用相應(yīng)的JSON文件來表征(目錄下僅支持文件類型)。 - boolean,布爾型 - color,顏色 - float,浮點型,范圍是-2^128-2^128 - intarray,整型數(shù)組 - integer,整型,范圍是-2^31-2^31-1 - pattern,樣式(僅支持系統(tǒng)應(yīng)用使用) - plural,復(fù)數(shù)形式 - strarray,字符串?dāng)?shù)組 - string,字符串, - theme,主題(僅支持系統(tǒng)應(yīng)用使用)element目錄中的文件名稱建議與下面的文件名保持一致。每個文件中只能包含同一類型的數(shù)據(jù)。 - boolean.json - color.json - float.json - intarray.json - integer.json - pattern.json - plural.json - strarray.json - string.json
media表示媒體資源,包括圖片、音頻、視頻等非文本格式的文件(目錄下只支持文件類型)。 圖片和音視頻的類型說明見表4和表5。文件名可自定義,例如:icon.png。
profile表示自定義配置文件,其文件內(nèi)容可[通過包管理接口]獲?。夸浵轮恢С謏son文件類型)。文件名可自定義,例如:test_profile.json。

媒體資源類型說明

表4 圖片資源類型說明

格式文件后綴名
JPEG.jpg
PNG.png
GIF.gif
SVG.svg
WEBP.webp
BMP.bmp

表5 音視頻資源類型說明

格式支持的文件類型
H.264 AVC.3gp
Baseline Profile (BP).mp4

資源文件示例

color.json文件的內(nèi)容如下:

{
    "color": [
        {
            "name": "color_hello",
            "value": "#ffff0000"
        },
        {
            "name": "color_world",
            "value": "#ff0000ff"
        }
    ]
}

float.json文件的內(nèi)容如下:

{
    "float":[
        {
            "name":"font_hello",
            "value":"28.0fp"
        },
	{
            "name":"font_world",
            "value":"20.0fp"
        }
    ]
}

string.json文件的內(nèi)容如下:

{
    "string":[
        {
            "name":"string_hello",
            "value":"Hello"
        },
	{
            "name":"string_world",
            "value":"World"
        },
	{
            "name":"message_arrive",
            "value":"We will arrive at %1$s."
        },
  {
            "name":"message_notification",
            "value":"Hello, %1$s!,You have %2$d new messages."
  }
    ]
}

plural.json文件的內(nèi)容如下:

{
    "plural":[
        {
            "name":"eat_apple",
            "value":[
                {
                    "quantity":"one",
                    "value":"%d apple"
                },
                {
                    "quantity":"other",
                    "value":"%d apples"
                }
            ]
        }
    ]
}

創(chuàng)建資源目錄和資源文件

在resources目錄下,可按照限定詞目錄命名規(guī)則,以及資源組目錄支持的文件類型和說明,創(chuàng)建資源目錄和資源組目錄,添加特定類型資源。DevEco Studio支持同時創(chuàng)建資源目錄和資源文件,也支持單獨創(chuàng)建資源目錄或資源文件。

創(chuàng)建資源目錄和資源文件

在resources目錄右鍵菜單選擇“New > Resource File”,可同時創(chuàng)建資源目錄和資源文件,文件默認創(chuàng)建在base目錄的對應(yīng)資源組。如果選擇了限定詞,則會按照命名規(guī)范自動生成限定詞和資源組目錄,并將文件創(chuàng)建在限定詞目錄中。

圖中File name為需要創(chuàng)建的文件名。Resource type為資源組類型,默認是element。Root Element為資源類型。Avaliable qualifiers為供選擇的限定詞目錄,通過右邊的小箭頭可添加或者刪除。
創(chuàng)建的目錄名自動生成,格式固定為“限定詞.資源組”,例如:創(chuàng)建一個限定詞為dark的element目錄,自動生成的目錄名稱為“dark.element”。

create-resource-file-1

創(chuàng)建資源目錄

在resources目錄右鍵菜單選擇“New > Resource Directory”,可創(chuàng)建資源目錄,默認創(chuàng)建的是base目錄。如果選擇了限定詞,則會按照命名規(guī)范自動生成限定詞和資源組目錄。確定限定詞后,選擇資源組類型,當(dāng)前資源組類型支持Element、Media、Profile三種,創(chuàng)建后生成資源目錄。

create-resource-file-2

創(chuàng)建資源文件

在資源目錄(element、media、profile)的右鍵菜單選擇“New > XXX Resource File”,即可創(chuàng)建對應(yīng)資源組目錄的資源文件。例如,在element目錄下可新建Element Resource File。

create-resource-file-3

資源可翻譯特性

功能介紹

資源需要翻譯時,可使用attr屬性標記字符串翻譯范圍和翻譯狀態(tài)。attr屬性不參與資源編譯,只標記字符串是否翻譯。

未配置attr屬性,默認需要翻譯。

"attr": {
  "translatable": false|true
  "priority": "code|translate|LT|customer"
}

attr支持屬性

名稱類型說明
translatableboolean標記字符串是否需要翻譯。 true:需要翻譯。 false:不需要翻譯。
prioritystring標記字符串翻譯狀態(tài)。 code:未翻譯。 translate:翻譯未驗證。 LT:翻譯已驗證。 customer:用戶定制字符串。

使用約束

可翻譯特性使能范圍:base目錄下string、strarray、plural類型資源。

resources
|---base
|   |---element
|   |   |---string.json
|   |   |---strarray.json
|   |   |---plural.json

示例

string資源配置attr屬性示例如下:

{
  "string": [
    {
      "name": "string1",
      "value": "1",
      "attr": {
        "translatable": false
      }
    },
    {
      "name": "string2",
      "value": "Hello world!",
      "attr": {
        "translatable": true,
        "priority": "LT"
      }
    }
  ]
}

資源訪問

單HAP包應(yīng)用資源

  • 通過"$r""$rawfile"引用資源。
    對于“color”、“float”、“string”、“plural”、“media”、“profile”等類型的資源,通過"$r('app.type.name')"形式引用。其中,app為resources目錄中定義的資源;type為資源類型或資源的存放位置;name為資源名,開發(fā)者定義資源時確定。
    對于string.json中使用多個占位符的情況,通過$r('app.string.label','aaa','bbb',444)形式引用。
    對于rawfile目錄資源,通過"$rawfile('filename')"形式引用。其中,filename為rawfile目錄下文件的相對路徑,文件名需要包含后綴,路徑開頭不可以"/"開頭。

[資源組目錄]下的“資源文件示例”顯示了.json文件內(nèi)容,包含color.json文件、string.json文件和plural.json文件,訪問應(yīng)用資源時需先了解.json文件的使用規(guī)范。
資源的具體使用方法如下:

Text('Hello')
  .fontColor($r('sys.color.ohos_id_color_emphasize'))
  .fontSize($r('sys.float.ohos_id_text_size_headline1'))
  .fontFamily($r('sys.string.ohos_id_text_font_family_medium'))
  .backgroundColor($r('sys.color.ohos_id_color_palette_aux1'))

  Image($r('sys.media.ohos_app_icon'))
  .border({
    color: $r('sys.color.ohos_id_color_palette_aux1'),
    radius: $r('sys.float.ohos_id_corner_radius_button'), width: 2
  })
  .margin({
    top: $r('sys.float.ohos_id_elements_margin_horizontal_m'),
    bottom: $r('sys.float.ohos_id_elements_margin_horizontal_l')
  })
  .height(200)
  .width(300)
  • 通過本應(yīng)用上下文獲取ResourceManager后,調(diào)用不同[資源管理接口]訪問不同資源。
    例如:getContext.resourceManager.getStringByNameSync('app.string.XXX') 可獲取字符串資源;getContext.resourceManager.getRawFd('rawfilepath') 可獲取Rawfile所在hap包的descriptor信息,訪問rawfile文件時需{fd, offset, length}一起使用。

跨HAP/HSP包應(yīng)用資源

bundle不同,跨bundle訪問(僅支持系統(tǒng)應(yīng)用使用)

  • 通過createModuleContext(bundleName, moduleName)接口創(chuàng)建對應(yīng)HAP/HSP包的上下文,獲取resourceManager對象后,調(diào)用不同[資源管理接口]訪問不同資源。
    例如:getContext.createModuleContext(bundleName, moduleName).resourceManager.getStringByNameSync('app.string.XXX')。

bundle相同,跨module訪問

  • 通過createModuleContext(moduleName)接口創(chuàng)建同應(yīng)用中不同module的上下文,獲取resourceManager對象后,調(diào)用不同接口訪問不同資源。
    例如:getContext.createModuleContext(moduleName).resourceManager.getStringByNameSync('app.string.XXX')。

  • 通過"$r""$rawfile"引用資源。具體操作如下:
    1.這里是列表文本[hsp].type.name獲取資源。其中,hsp為hsp模塊名,type為資源類型,name為資源名稱,示例如下:

    Text($r('[hsp].string.test_string'))
        .fontSize($r('[hsp].float.font_size'))
        .fontColor($r('[hsp].color.font_color'))  
      Image($rawfile('[hsp].icon.png'))
    

    2.使用變量獲取資源。示例如下:

    @Entry
     @Component
     struct Index {
       text: string = '[hsp].string.test_string';
       fontSize: string = '[hsp].float.font_size';
       fontColor: string = '[hsp].color.font_color';
       image: string = '[hsp].media.string';
       rawfile: string = '[hsp].icon.png';
    
       build() {
         Row() {
           Text($r(this.text))
             .fontSize($r(this.fontSize))
             .fontColor($r(this.fontColor))
    
           Image($r(this.image))
    
           Image($rawfile(this.rawfile))
         }
       }
     }
    

    說明

    hsp包名必須寫在[]內(nèi),rawfile下有多層目錄,需要從rawfile下面第一個目錄開始寫,如"$rawfile('[hsp].oneFile/twoFile/icon.png')",使用"$r""$rawfile"跨包訪問HSP包資源無法提供編譯時的資源校驗,需要開發(fā)者自行保證使用資源存在于對應(yīng)包中。

系統(tǒng)資源

除了自定義資源,開發(fā)者也可以使用系統(tǒng)中預(yù)定義的資源,統(tǒng)一應(yīng)用的視覺風(fēng)格。可以查看[應(yīng)用UX設(shè)計中關(guān)于資源的介紹],獲取支持的系統(tǒng)資源ID及其在不同配置下的取值。

在開發(fā)過程中,分層參數(shù)的用法與資源限定詞基本一致。對于系統(tǒng)資源,可以通過“$r('sys.type.resource_id')”的形式引用。其中,sys為系統(tǒng)資源;type為資源類型,取值包括“color”、“float”、“string”、“media”;resource_id為資源id。

說明:

  • 僅聲明式開發(fā)范式支持使用系統(tǒng)資源。
  • 對于系統(tǒng)預(yù)置應(yīng)用,建議使用系統(tǒng)資源;對于三方應(yīng)用,可以根據(jù)需要選擇使用系統(tǒng)資源或自定義應(yīng)用資源。
  • 界面加載的系統(tǒng)資源字體進行顯示時,可以在配置中system/etc/fontconfig.json文件查看。默認字體為HarmonyOS Sans。
Text('Hello')
  .fontColor($r('sys.color.ohos_id_color_emphasize'))
  .fontSize($r('sys.float.ohos_id_text_size_headline1'))
  .fontFamily($r('sys.string.ohos_id_text_font_family_medium'))
  .backgroundColor($r('sys.color.ohos_id_color_palette_aux1'))

Image($r('sys.media.ohos_app_icon'))
  .border({
    color: $r('sys.color.ohos_id_color_palette_aux1'),
    radius: $r('sys.float.ohos_id_corner_radius_button'), width: 2
  })
  .margin({
    top: $r('sys.float.ohos_id_elements_margin_horizontal_m'),
    bottom: $r('sys.float.ohos_id_elements_margin_horizontal_l')
  })
  .height(200)
  .width(300)

資源匹配

應(yīng)用使用某資源時,系統(tǒng)會根據(jù)當(dāng)前設(shè)備狀態(tài)優(yōu)先從相匹配的限定詞目錄中尋找該資源。只有當(dāng)resources目錄中沒有與設(shè)備狀態(tài)匹配的限定詞目錄,或者在限定詞目錄中找不到該資源時,才會去base目錄中查找。rawfile是原始文件目錄,不會根據(jù)設(shè)備狀態(tài)去匹配不同的資源。

限定詞目錄與設(shè)備狀態(tài)的匹配規(guī)則

  • 在為設(shè)備匹配對應(yīng)的資源文件時,限定詞目錄匹配的優(yōu)先級從高到低依次為:移動國家碼和移動網(wǎng)絡(luò)碼 > 區(qū)域(可選組合:語言、語言_文字、語言_國家或地區(qū)、語言_文字_國家或地區(qū))> 橫豎屏 > 設(shè)備類型 > 顏色模式 > 屏幕密度。
  • 如果限定詞目錄中包含移動國家碼和移動網(wǎng)絡(luò)碼、語言、文字、橫豎屏、設(shè)備類型、顏色模式限定詞,則對應(yīng)限定詞的取值必須與當(dāng)前的設(shè)備狀態(tài)完全一致,該目錄才能夠參與設(shè)備的資源匹配。例如,限定詞目錄“zh_CN-car-ldpi”不能參與“en_US”設(shè)備的資源匹配。

應(yīng)用界面加載資源規(guī)則,更多請參考國際化和本地化文檔。

overlay機制

overylay是一種資源替換機制,針對不同品牌、產(chǎn)品的顯示風(fēng)格,開發(fā)者可以在不重新打包業(yè)務(wù)邏輯hap的情況下,通過配置和使用overlay資源包,實現(xiàn)應(yīng)用界面風(fēng)格變換。overlay資源包只包含資源文件、資源索引文件和配置文件。

  • 動態(tài)overlay使用方式

1、對應(yīng)的overlay資源包需要放在對應(yīng)應(yīng)用安裝路徑下,通過hdc install的方式安裝。如應(yīng)用com.example.overlay的安裝路徑:data/app/el1/bundle/public/com.example.overlay/。

2、應(yīng)用通過[addResource(path)],實現(xiàn)資源覆蓋;通過[removeResource(path)],實現(xiàn)overlay刪除。overlay資源路徑需經(jīng)過元能力的getContext().BundleCodeDir獲取此應(yīng)用對應(yīng)的沙箱根目錄,由應(yīng)用的沙箱根目錄+overlay資源包名稱組成。如:let path = getContext().bundleCodeDir + "overlay資源包名稱",其對應(yīng)沙箱路徑為:/data/storage/el1/bundle/overlay資源包名稱。

  • 靜態(tài)overlay配置方式

包內(nèi)overlay資源包中的配置文件module.json5中支持的字段:

"app":{
    "bundleName": "com.example.myapplication.overlay",
    "vendor" : "example",
    "versinCode": "1000000",
    "versionName": "1.0.0.1",
    "icon": "$media:app_icon",
    "label": "$string:app_name",
  },
  "module":{
    "name": "entry_overlay_module_name",
    "type": "shared",
    "description": "$string:entry_overlay_desc",
    "deviceTypes": [
      "default",
      "tablet",
    ],
    "deliverywithInstall": true,

    "targetModuleName": "entry_module_name",
    "targetPriority": 1,
  }
}

包間overlay資源包中的配置文件module.json5中支持的字段,僅對系統(tǒng)應(yīng)用開放:

"app":{
    "bundleName": "com.example.myapplication.overlay",
    "vendor" : "example",
    "versinCode": "1000000",
    "versionName": "1.0.0.1",
    "icon": "$media:app_icon",
    "label": "$string:app_name",
    "targetBundleName": "com.example.myapplication",
    "targetPariority": 1,
  },
  "module":{
    "name": "entry_overlay_module_name",
    "type": "shared",
    "description": "$string:entry_overlay_desc",
    "deviceTypes": [
      "default",
      "tablet",
    ],
    "deliverywithInstall": true,

    "targetModuleName": "entry_module_name",
    "targetPriority": 1,
  }
}

說明:

  • targetBundleName: 字符串類型,指定要overlay的bundleName
  • targetModuleName: 字符串類型,指定要overlay的應(yīng)用中的目標module
  • targetPriority: 整數(shù)類型,指定overlay優(yōu)先級
  • 不支持Ability、ExtensionAbility、Permission等其他字段的配置
  • overlay不支持json類型的圖片配置。

在IDE中創(chuàng)建應(yīng)用工程時,module的配置文件module.json5中包含targetModuleName和targetPriority字段時,該module將會在安裝階段被識別為overlay特征的module。overlay特征的module一般是為設(shè)備上存在的非overlay特征的module提供覆蓋的資源文件,以便于targetModuleName指向的module在運行階段可以使用overlay資源文件展示不同的顏色,標簽,主題等等。

示例

在應(yīng)用的resources目錄下,創(chuàng)建名為tablet的限定詞子目錄,并按照下表所示,在base目錄和tablet限定詞目錄中添加相應(yīng)的資源。

資源名稱資源類型base目錄中資源值限定詞目錄(tablet)中資源值
my_stringstringdefaulttablet
my_colorcolor#ff0000#0000ff
my_floatfloat60vp80vp
my_imagemediamy_image.png(太陽圖標)my_image.png(月亮圖標)

在代碼中通過 "$r('app.type.name')" 的形式使用應(yīng)用資源,并分別在默認設(shè)備和平板上查看代碼的運行效果,可以發(fā)現(xiàn)同一資源在不同設(shè)備上的取值不同。

zh-cn_image_0000001325731389

@Entry
@Component
struct Index {
  build() {
    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
      Text($r("app.string.my_string"))
        .fontSize($r("app.float.my_float"))
        .fontColor($r("app.color.my_color"))
      Image($r("app.media.my_image"))
        .width(100)
        .height(100)
    }
    .width('100%')
    .height('100%')
  }
}

`HarmonyOSOpenHarmony鴻蒙文檔籽料:mau123789v直接拿`

搜狗高速瀏覽器截圖20240326151344.png

系統(tǒng)資源

除了自定義資源,開發(fā)者也可以使用系統(tǒng)中預(yù)定義的資源(即[分層參數(shù)],同一資源ID在設(shè)備類型、深淺色等不同配置下有不同的取值)。

在開發(fā)過程中,分層參數(shù)的用法與資源限定詞基本一致。開發(fā)者可以通過"$r('sys.type.resource_id')"的形式引用系統(tǒng)資源。sys代表是系統(tǒng)資源;type代表資源類型,值可以取color、float、string和media;resource_id代表資源id。

說明:

  • 僅聲明式開發(fā)范式支持使用分層參數(shù),類Web開發(fā)范式不支持。
  • 系統(tǒng)資源可以保證不同團隊開發(fā)出的應(yīng)用有較為一致的視覺風(fēng)格。對于系統(tǒng)預(yù)置應(yīng)用,強烈建議使用系統(tǒng)資源;對于三方應(yīng)用,可以根據(jù)需要選擇使用系統(tǒng)資源或自定義應(yīng)用資源。
  • 可以查看[resources代碼倉]了解系統(tǒng)預(yù)置資源的實現(xiàn),這里的目錄結(jié)構(gòu)與工程中的resources目錄類似,也是通過資源限定詞匹配不同的設(shè)備或設(shè)備狀態(tài)。

審核編輯 黃宇

聲明:本文內(nèi)容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權(quán)轉(zhuǎn)載。文章觀點僅代表作者本人,不代表電子發(fā)燒友網(wǎng)立場。文章及其配圖僅供工程師學(xué)習(xí)之用,如有內(nèi)容侵權(quán)或者其他違規(guī)問題,請聯(lián)系本站處理。 舉報投訴
  • 鴻蒙
    +關(guān)注

    關(guān)注

    56

    文章

    2267

    瀏覽量

    42485
  • 鴻蒙OS
    +關(guān)注

    關(guān)注

    0

    文章

    188

    瀏覽量

    4336
收藏 人收藏

    評論

    相關(guān)推薦

    ?HarmonyOS"一次開發(fā)多端部署"優(yōu)秀實踐——玩機技巧

    的潛在用戶群體。個應(yīng)用要在多類設(shè)備上提供統(tǒng)的內(nèi)容,需要適配不同的屏幕尺寸和硬件,開發(fā)成本較高。"一次開發(fā),
    的頭像 發(fā)表于 08-30 10:25 ?2480次閱讀
    ?HarmonyOS"<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>"優(yōu)秀實踐——玩機技巧

    HarmonyOS開發(fā)案例:【一次開發(fā)多端部署(視頻應(yīng)用)】

    者提供了“一次開發(fā),多端部署”的系統(tǒng)能力,讓開發(fā)者可以基于一次
    的頭像 發(fā)表于 05-11 15:41 ?1070次閱讀
    HarmonyOS<b class='flag-5'>開發(fā)</b>案例:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>(視頻應(yīng)用)】

    HarmonyOS開發(fā)案例:【一次開發(fā),多端部署-音樂專輯】

    基于自適應(yīng)和響應(yīng)式布局,實現(xiàn)一次開發(fā)、多端部署音樂專輯頁面。
    的頭像 發(fā)表于 05-13 16:48 ?555次閱讀
    HarmonyOS<b class='flag-5'>開發(fā)</b>案例:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>-音樂專輯】

    鴻蒙OS開發(fā):【一次開發(fā),多端部署】(天氣應(yīng)用)案例

    本章通過個天氣應(yīng)用,介紹多應(yīng)用的整體開發(fā)過程,包括UX設(shè)計、工程管理及調(diào)試、頁面開發(fā)等。
    的頭像 發(fā)表于 05-15 15:42 ?818次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】(天氣應(yīng)用)案例

    鴻蒙OS開發(fā):【一次開發(fā)多端部署】(多天氣)項目

    本示例展示個天氣應(yīng)用界面,包括首頁、城市管理、添加城市、更新時間彈窗,體現(xiàn)一次開發(fā),多端部署的能力。
    的頭像 發(fā)表于 05-20 14:59 ?688次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】(<b class='flag-5'>一</b>多天氣)項目

    鴻蒙OS開發(fā):【一次開發(fā),多端部署】(音樂專輯主頁)

    本示例使用一次開發(fā)多端部署中介紹的自適應(yīng)布局能力和響應(yīng)式布局能力進行多設(shè)備(或多窗口尺寸)適配,保證應(yīng)用在不同設(shè)備或不同窗口尺寸下可以正常顯示。
    的頭像 發(fā)表于 05-21 14:48 ?554次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】(音樂專輯主頁)

    鴻蒙OS開發(fā):【一次開發(fā)多端部署】(音樂專輯頁面)

    基于自適應(yīng)和響應(yīng)式布局,實現(xiàn)一次開發(fā)、多端部署音樂專輯頁面。
    的頭像 發(fā)表于 05-25 16:21 ?518次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】(音樂專輯頁面)

    鴻蒙OS開發(fā):【一次開發(fā),多端部署】(視頻應(yīng)用)

    者提供了“一次開發(fā),多端部署”的系統(tǒng)能力,讓開發(fā)者可以基于一次
    的頭像 發(fā)表于 05-25 16:29 ?4209次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】(視頻應(yīng)用)

    鴻蒙OS開發(fā):典型頁面場景【一次開發(fā),多端部署】實戰(zhàn)(音樂專輯頁2)

    本示例使用[一次開發(fā)多端部署]中介紹的自適應(yīng)布局能力和響應(yīng)式布局能力進行多設(shè)備(或多窗口尺寸)適配,保證應(yīng)用在不同設(shè)備或不同窗口尺寸下可以正常顯示。
    的頭像 發(fā)表于 05-25 16:47 ?1887次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:典型頁面場景【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】實戰(zhàn)(音樂專輯頁2)

    鴻蒙OS開發(fā):典型頁面場景【一次開發(fā),多端部署】實戰(zhàn)(設(shè)置典型頁面)

    本示例展示了設(shè)置應(yīng)用的典型頁面,其在小窗口和大窗口有不同的顯示效果,體現(xiàn)一次開發(fā)多端部署的能力。
    的頭像 發(fā)表于 05-27 09:36 ?896次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:典型頁面場景【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】實戰(zhàn)(設(shè)置典型頁面)

    HarmonyOS\"一次開發(fā),多端部署\"優(yōu)秀實踐——玩機技巧,碼上起航

    的潛在用戶群體。個應(yīng)用要在多類設(shè)備上提供統(tǒng)的內(nèi)容,需要適配不同的屏幕尺寸和硬件,開發(fā)成本較高。\"一次開發(fā)
    發(fā)表于 08-30 18:14

    華為開發(fā)者大會2021:一次開發(fā) 多端部署

    一次開發(fā) 多端部署使能開發(fā)者從單設(shè)備生態(tài)跨入多設(shè)備生態(tài)!
    的頭像 發(fā)表于 10-22 15:09 ?1569次閱讀
    華為<b class='flag-5'>開發(fā)</b>者大會2021:<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b> <b class='flag-5'>多端</b><b class='flag-5'>部署</b>

    華為開發(fā)者大會2021:軟件部總裁龔體 鴻蒙系統(tǒng) 一次開發(fā) 多端部署 萬物互連

    華為開發(fā)者大會2021:鴻蒙系統(tǒng) 一次開發(fā) 多端部署 萬物互連 在華為
    的頭像 發(fā)表于 10-22 15:09 ?4365次閱讀
    華為<b class='flag-5'>開發(fā)</b>者大會2021:軟件部總裁龔體 <b class='flag-5'>鴻蒙</b>系統(tǒng) <b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b> <b class='flag-5'>多端</b><b class='flag-5'>部署</b> 萬物互連

    鴻蒙OS開發(fā):【一次開發(fā),多端部署】(多設(shè)備自適應(yīng)能力)簡單介紹

    本示例是《一次開發(fā)多端部署》的配套示例代碼,展示了[頁面開發(fā)多能力],包括自適應(yīng)布局、響應(yīng)
    的頭像 發(fā)表于 05-21 14:59 ?1926次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】(多設(shè)備自適應(yīng)能力)簡單介紹

    鴻蒙OS開發(fā):【一次開發(fā),多端部署】( 設(shè)置app頁面)

    本示例展示了設(shè)置應(yīng)用的典型頁面,其在小窗口和大窗口有不同的顯示效果,體現(xiàn)一次開發(fā)多端部署的能力。
    的頭像 發(fā)表于 05-21 14:56 ?689次閱讀
    <b class='flag-5'>鴻蒙</b><b class='flag-5'>OS</b><b class='flag-5'>開發(fā)</b>:【<b class='flag-5'>一次</b><b class='flag-5'>開發(fā)</b>,<b class='flag-5'>多端</b><b class='flag-5'>部署</b>】( 設(shè)置app頁面)