diff --git a/README.en.md b/README.en.md deleted file mode 100644 index f9283ad1147c266ab4d0da8fb07dc800c3e4e647..0000000000000000000000000000000000000000 --- a/README.en.md +++ /dev/null @@ -1,36 +0,0 @@ -# WebApplicationJump - -#### Description -{**When you're done, you can delete the content in this README and update the file with details for others getting started with your repository**} - -#### Software Architecture -Software architecture description - -#### Installation - -1. xxxx -2. xxxx -3. xxxx - -#### Instructions - -1. xxxx -2. xxxx -3. xxxx - -#### Contribution - -1. Fork the repository -2. Create Feat_xxx branch -3. Commit your code -4. Create Pull Request - - -#### Gitee Feature - -1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md -2. Gitee blog [blog.gitee.com](https://blog.gitee.com) -3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore) -4. The most valuable open source project [GVP](https://gitee.com/gvp) -5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help) -6. The most popular members [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/) diff --git a/README_EN.md b/README_EN.md new file mode 100644 index 0000000000000000000000000000000000000000..b05908a374ca13ae9480bd47c1b9f5aeef821f3b --- /dev/null +++ b/README_EN.md @@ -0,0 +1,53 @@ +# Jumping Between Webs and Applications + +## Overview + +Based on the application startup capabilities, this sample implements scenarios such as jumping between the web page and ArkTS page, jumping to applications and details page in AppGallery from the web page. + +## Preview +The following figure shows the running effect on a mobile phone. + + + + +## Project Directory + +``` +├──entry/src/main/ets // Code area +│ ├──common +│ │ ├──Logger.ets // Logger +│ | └──Constants.ets // Constants +│ ├──entryability +│ | └──EntryAbility.ets +│ ├──entrybackupability +│ | └──EntryBackupAbility.ets +│ └──pages +│ ├──Index.ets // Entry page +│ └──OriginPage.ets // Origin page +└──entry/src/main/resources // App resource directory +``` + +## How to Implement + +To start a native page from a web page, you need to intercept page loading using the interceptor **onLoadIntercept** of the **Web** component and use the routing capability of the **Navigation** component. + +To start another web page from a web page, you only need to configure the **a** tag with the **href** property on the frontend. + +To start a third-party application from the web page, you need to intercept the page loading using **onLoadIntercept** of the **Web** component and then execute the custom startup logic. Before starting the third-party application, you need to set the **exported** property of the **module.json5** file of the third-party application to **true**. In addition, you need to configure **entities** and **actions** in the **skills** property. Use the implicit startup mode in the application and configure the parameters of the **Want** type. The **action** and **entities** parameters specify the actions and entities of the application to be started respectively. Then, use **startAbility** to start the application. In this way, the application can be started without specifying the bundle name. To start the third-party application successfully, you need to install **PulledUpApplication** in the **dependence** directory. You can also download this project and set the startup parameters to start a third-party application. + +To start a system application from the web page, you need to intercept the page loading using **onLoadIntercept**. Then, you can set the parameters of **Want** to the configuration of the corresponding system application, and use **startAbility** to start the system application. In addition, the system application can also be started using the **Picker** and APIs provided by the system in a specific scenario. + +To jump from a web page to the details page in AppGallery, you need to intercept the page loading using **onLoadIntercept** and then use the AppGallery recommendation function of Store Kit. This function provides the **loadProduct** API to load the details page on AppGallery. + +To start an application on another device from the web page, you need to intercept the page loading using **onLoadIntercept**, use **getAvailableDeviceListSync** to obtain the list of trusted devices, and set the **deviceId** parameter of **want**. In this case, note that you need to log in to the same HUAWEI ID on multiple devices, connect to the same Wi-Fi network, and enable Bluetooth. + +## Required Permissions + +* **DISTRIBUTED_DATASYNC**, which allows data to be exchanged between devices. + +## Constraints + +1. The sample app is supported only on Huawei phones running the standard system. +2. The HarmonyOS version must be HarmonyOS NEXT Developer Beta1 or later. +3. The DevEco Studio version must be DevEco Studio NEXT Developer Beta1 or later. +4. The HarmonyOS SDK version must be HarmonyOS NEXT Developer Beta1 or later. diff --git a/dependence/PulledUpApplication/entry/src/main/ets/pages/test.json5 b/dependence/PulledUpApplication/entry/src/main/ets/pages/test.json5 deleted file mode 100644 index e442601637dd61888902f7350d9b43c6a00de3d6..0000000000000000000000000000000000000000 --- a/dependence/PulledUpApplication/entry/src/main/ets/pages/test.json5 +++ /dev/null @@ -1,31 +0,0 @@ -{ - "module": { - // ... - "abilities": [ - { - // ... - "skills": [ - { - "entities": [ - // ... - "entity.system.browsable" - ], - "actions": [ - // ... - "ohos.want.action.viewData", - ], - "uris": [ - { - "scheme": "appScheme", // scheme可以自定义 - "host": "www.test.com", // host须配置关联的域名 - "port": "80", // port可选 - "path": "path1" // path可选,为了避免匹配到多个应用,建议配置该字段 - } - ] - } - ] - } - ], - // ... - } -} \ No newline at end of file diff --git a/dependence/PulledUpApplication/entry/src/main/module.json5 b/dependence/PulledUpApplication/entry/src/main/module.json5 index bd9e2fdf74acc29932420bca4363324fcf9895d2..2d6965f3b53f5d88b80491517c5ad4f463112e2e 100644 --- a/dependence/PulledUpApplication/entry/src/main/module.json5 +++ b/dependence/PulledUpApplication/entry/src/main/module.json5 @@ -24,12 +24,21 @@ "skills": [ { "entities": [ + "entity.system.browsable", "entity.system.home", "entity.system.default" ], "actions": [ "action.system.home", "ohos.want.action.viewData", + ], + "uris": [ + { + "scheme": "appScheme", + "host": "www.test.com", + "port": "80", + "path": "path1" + } ] } ] diff --git a/entry/src/main/ets/common/Constants.ets b/entry/src/main/ets/common/Constants.ets index 9359fb52f0b775ca9aa19d2c922a205e2bcbcce6..dfe64f568cae7f9e83cf3ae0522e18a34dc68b6f 100644 --- a/entry/src/main/ets/common/Constants.ets +++ b/entry/src/main/ets/common/Constants.ets @@ -38,7 +38,6 @@ export class Constants { * Web page router chinese name. */ static readonly WEB_PAGE_CHINESE: string = 'Web页面'; - /** * Original web page link. */ @@ -48,4 +47,8 @@ export class Constants { * Original web page link. */ static readonly WEB_PAGE_ADDRESS: string = 'resource://rawfile/index1.html'; + + static readonly SYSTEM_LANGUAGE_KEY: string = 'systemLanguage'; + static readonly CHINESE_LANGUAGE: string = 'zh-Hans-CN'; + static readonly ENGLISH_LANGUAGE: string = 'en-Latn-CN'; } \ No newline at end of file diff --git a/entry/src/main/ets/entryability/EntryAbility.ets b/entry/src/main/ets/entryability/EntryAbility.ets index aff72cacf93d162fcb5b936ca6b49fef5955a079..4d51dbd0d15479604343a3b2d09369b8438c901f 100644 --- a/entry/src/main/ets/entryability/EntryAbility.ets +++ b/entry/src/main/ets/entryability/EntryAbility.ets @@ -13,14 +13,25 @@ * limitations under the License. */ -import { abilityAccessCtrl, AbilityConstant, bundleManager, Permissions, UIAbility, Want } from '@kit.AbilityKit'; +import { + abilityAccessCtrl, + AbilityConstant, + bundleManager, + Configuration, + Permissions, + UIAbility, + Want +} from '@kit.AbilityKit'; import { hilog } from '@kit.PerformanceAnalysisKit'; import { window } from '@kit.ArkUI'; +import { Constants } from '../common/Constants'; export default class EntryAbility extends UIAbility { onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void { this.checkPermissions(); hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate'); + AppStorage.setOrCreate(Constants.SYSTEM_LANGUAGE_KEY, this.context.config.language); + console.log(`language is ${this.context.config.language}`) } onDestroy(): void { @@ -55,6 +66,13 @@ export default class EntryAbility extends UIAbility { hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onBackground'); } + onConfigurationUpdate(newConfig: Configuration): void { + if (AppStorage.get(Constants.SYSTEM_LANGUAGE_KEY) !== newConfig.language) { + AppStorage.setOrCreate(Constants.SYSTEM_LANGUAGE_KEY, newConfig.language) + + } + } + async checkPermissions(): Promise { const permissions: Array = ["ohos.permission.DISTRIBUTED_DATASYNC"]; diff --git a/entry/src/main/ets/pages/Index.ets b/entry/src/main/ets/pages/Index.ets index 8ef2b903be5434c994e869b2014ff5582b5061b9..27770c5ba62d73b7a8c8aa9cad20853caad20ce0 100644 --- a/entry/src/main/ets/pages/Index.ets +++ b/entry/src/main/ets/pages/Index.ets @@ -23,10 +23,13 @@ import { OriginPage } from './OriginPage'; import { Constants } from '../common/Constants'; import { Logger } from '../common/Logger'; +const regex = /^resource:\/\//; + @Entry @Component struct Index { @Provide navPathStack: NavPathStack = new NavPathStack(); + @StorageProp(Constants.SYSTEM_LANGUAGE_KEY) la: string = '' private controller: WebviewController = new webview.WebviewController(); private context = getContext(this) as common.UIAbilityContext; private functionsMap: Map void> = new Map(); @@ -112,7 +115,7 @@ struct Index { let remoteDeviceId = this.getRemoteDeviceId(); if (!remoteDeviceId) { promptAction.showToast({ - message: "未发现周边设备,请检查后重试!", + message: $r('app.string.not_found_toast'), duration: 2000 }) return; @@ -134,7 +137,7 @@ struct Index { Navigation(this.navPathStack) { Column() { Web({ - src: $rawfile('index.html'), + src: $rawfile(this.la == Constants.ENGLISH_LANGUAGE ? 'index_en.html' : 'index_cn.html'), controller: this.controller }) .zoomAccess(false) @@ -142,7 +145,7 @@ struct Index { const url: string = event.data.getRequestUrl(); const callFunc = this.functionsMap.get(url) as () => void; callFunc && callFunc(); - return !(url === Constants.ORIGIN_WEB_PAGE_LINK || url === Constants.WEB_PAGE_ADDRESS); + return !regex.test(url); }) } } diff --git a/entry/src/main/ets/pages/OriginPage.ets b/entry/src/main/ets/pages/OriginPage.ets index dd0dd059ff21f32973b962e9029fe0acad22b839..e16de57edc72a18f116559ed5ce3a02540240255 100644 --- a/entry/src/main/ets/pages/OriginPage.ets +++ b/entry/src/main/ets/pages/OriginPage.ets @@ -18,6 +18,7 @@ import { Constants } from '../common/Constants'; @Component export struct OriginPage { @Consume('navPathStack') navPathStack: NavPathStack; + @StorageProp(Constants.SYSTEM_LANGUAGE_KEY) la: string = ''; build() { NavDestination() { @@ -38,6 +39,6 @@ export struct OriginPage { bottom: $r('app.float.space_bottom') }) } - .title(Constants.ORIGIN_PAGE_CHINESE) + .title(this.la = Constants.ENGLISH_LANGUAGE ? Constants.ORIGIN_PAGE : Constants.ORIGIN_PAGE_CHINESE) } } \ No newline at end of file diff --git a/entry/src/main/resources/base/element/string.json b/entry/src/main/resources/base/element/string.json index 53380c5a8df702bbd379fea87bf4f8079853ab48..7340b85ede8c3388f1c3eb343bacaaf8c67c761b 100644 --- a/entry/src/main/resources/base/element/string.json +++ b/entry/src/main/resources/base/element/string.json @@ -10,15 +10,23 @@ }, { "name": "EntryAbility_label", - "value": "Web应用拉起" + "value": "WebPullUp" }, { "name": "back_to_web_page", - "value": "跳转回Web页面" + "value": "return to the web page" }, { "name": "distributed_permission", "value": "Used to pull up applications on other devices." + }, + { + "name": "original_page", + "value": "ArkTS Page" + }, + { + "name": "not_found_toast", + "value": "No peripherals found, please check and try again!" } ] } \ No newline at end of file diff --git a/entry/src/main/resources/en_US/element/string.json b/entry/src/main/resources/en_US/element/string.json index 31896f588d4b050adee064086577dba6f508d6a0..7340b85ede8c3388f1c3eb343bacaaf8c67c761b 100644 --- a/entry/src/main/resources/en_US/element/string.json +++ b/entry/src/main/resources/en_US/element/string.json @@ -19,6 +19,14 @@ { "name": "distributed_permission", "value": "Used to pull up applications on other devices." + }, + { + "name": "original_page", + "value": "ArkTS Page" + }, + { + "name": "not_found_toast", + "value": "No peripherals found, please check and try again!" } ] } \ No newline at end of file diff --git a/entry/src/main/resources/rawfile/css/styles.css b/entry/src/main/resources/rawfile/css/styles.css new file mode 100644 index 0000000000000000000000000000000000000000..f6c2fe165095ac0f1f70cb4bc2a22b13c8ef0e4b --- /dev/null +++ b/entry/src/main/resources/rawfile/css/styles.css @@ -0,0 +1,61 @@ +* { + margin: 0; + padding: 0; +} + +.web_page_demo { + width: 100vw; + height: 100vh; + display: flex; + flex-direction: column; + justify-content: space-between; + align-items: center; +} + +.title { + width: calc(100% - 48px); + color: rgba(23, 9, 9, 0.9); + font-family: 鸿蒙黑体; + font-size: 30px; + font-weight: 700; + line-height: 40px; + letter-spacing: 0px; + text-align: left; + margin-top: 64px; +} + +ul { + width: calc(100% - 48px); + display: flex; + flex-direction: column; + margin-bottom: 16px; + list-style: none; +} + +ul li { + width: 100%; + height: 40px; + border-radius: 20px; + background: rgb(10, 89, 247); + margin-bottom: 12px; + text-align: center; +} + +.function_item { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + color: rgb(255, 255, 255); + text-decoration: none; + font-family: "鸿蒙黑体"; + font-size: 16px; + font-weight: 500; + line-height: 22px; + letter-spacing: 0px; +} + +ul li:last-child { + margin-bottom: 0px; +} \ No newline at end of file diff --git a/entry/src/main/resources/rawfile/css/styles1.css b/entry/src/main/resources/rawfile/css/styles1.css new file mode 100644 index 0000000000000000000000000000000000000000..ee4e621b3f8148812dfd2b937bb45d137f09d5cc --- /dev/null +++ b/entry/src/main/resources/rawfile/css/styles1.css @@ -0,0 +1,81 @@ +* { + margin: 0; + padding: 0; +} + +.web_page_demo { + width: 100%; + height: 100vh; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: center; +} + +.header { + width: calc(100% - 32px); + height: 56px; + display: flex; + flex-direction: row; + justify-content: flex-start; + align-items: center; +} + +.header .back { + width: 40px; + height: 40px; + border-radius: 20px; + background: rgba(0, 0, 0, 0.05); + margin-right: 8px; + display: flex; + justify-content: center; + align-items: center; +} + +.header .back img { + width: 24px; + height: 24px; +} + +.header span { + height: 26px; + color: rgba(0, 0, 0, 0.9); + font-family: 鸿蒙黑体; + font-size: 20px; + font-weight: 700; + line-height: 26px; + letter-spacing: 0px; + text-align: left; +} + +.title { + color: rgba(0, 0, 0, 0.9); + font-family: "鸿蒙黑体"; + font-size: 24px; + font-weight: 700; + line-height: 22px; + letter-spacing: 0px; + text-align: center; + margin-top: 72px; +} + +a { + margin-top: auto; + width: calc(100% - 48px); + height: 40px; + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + border-radius: 20px; + background: rgb(10, 89, 247); + text-decoration: none; + color: rgb(255, 255, 255); + font-family: "鸿蒙黑体"; + font-size: 16px; + font-weight: 500; + line-height: 22px; + letter-spacing: 0px; + text-align: center; + margin-bottom: 16px; +} \ No newline at end of file diff --git a/entry/src/main/resources/rawfile/index1.html b/entry/src/main/resources/rawfile/index1.html deleted file mode 100644 index 75e53f515f2fb55335693fef626ec4f2ab67f367..0000000000000000000000000000000000000000 --- a/entry/src/main/resources/rawfile/index1.html +++ /dev/null @@ -1,104 +0,0 @@ - - - - - - Document - - - -
-
-
- -
- - Web 页面 -
-
Hello Web
- 跳转回Web页面 -
- - - diff --git a/entry/src/main/resources/rawfile/index1_cn.html b/entry/src/main/resources/rawfile/index1_cn.html new file mode 100644 index 0000000000000000000000000000000000000000..b2bef50c772c2fa241dffd3b936e36cc8fd1b2e3 --- /dev/null +++ b/entry/src/main/resources/rawfile/index1_cn.html @@ -0,0 +1,30 @@ + + + + + + Document + + + + +
+
+
+ +
+ + Web 页面 +
+
Hello Web
+ 跳转回Web页面 +
+ + + diff --git a/entry/src/main/resources/rawfile/index1_en.html b/entry/src/main/resources/rawfile/index1_en.html new file mode 100644 index 0000000000000000000000000000000000000000..211cdee9d6cd59726f134dd8235f2ae162b5d44e --- /dev/null +++ b/entry/src/main/resources/rawfile/index1_en.html @@ -0,0 +1,29 @@ + + + + + + Document + + + +
+
+
+ +
+ + Web Page +
+
Hello Web
+ Navigate back to the Web page +
+ + + diff --git a/entry/src/main/resources/rawfile/index.html b/entry/src/main/resources/rawfile/index_cn.html similarity index 43% rename from entry/src/main/resources/rawfile/index.html rename to entry/src/main/resources/rawfile/index_cn.html index 56425e50a93ef4a1dfc8a2475456def71cb83d5d..f72d09ccef82ea00ccebbfd66ef1d435fe7ca4bc 100644 --- a/entry/src/main/resources/rawfile/index.html +++ b/entry/src/main/resources/rawfile/index_cn.html @@ -4,70 +4,8 @@ Document + -
@@ -77,7 +15,7 @@ 跳转到原生页面
  • - 跳转到Web页面 + 跳转到Web页面
  • 拉起三方应用 diff --git a/entry/src/main/resources/rawfile/index_en.html b/entry/src/main/resources/rawfile/index_en.html new file mode 100644 index 0000000000000000000000000000000000000000..f5969d848b1379263df1fda03bd1b4fdff7651a6 --- /dev/null +++ b/entry/src/main/resources/rawfile/index_en.html @@ -0,0 +1,36 @@ + + + + + + Document + + + + + + + + diff --git a/entry/src/main/resources/rawfile/ic_back.png b/entry/src/main/resources/rawfile/statics/ic_back.png similarity index 100% rename from entry/src/main/resources/rawfile/ic_back.png rename to entry/src/main/resources/rawfile/statics/ic_back.png diff --git a/entry/src/main/resources/zh_CN/element/string.json b/entry/src/main/resources/zh_CN/element/string.json index d86041316994b63aa8f7df36ceab597a1aae0940..592138a78d93df8bcf0be9f64de718c0eb90143f 100644 --- a/entry/src/main/resources/zh_CN/element/string.json +++ b/entry/src/main/resources/zh_CN/element/string.json @@ -19,6 +19,14 @@ { "name": "distributed_permission", "value": "用于拉起其他设备上的应用" + }, + { + "name": "original_page", + "value": "原生页面" + }, + { + "name": "not_found_toast", + "value": "未发现周边设备,请检查后重试!" } ] } \ No newline at end of file diff --git a/screenshots/device/phone_EN.png b/screenshots/device/phone_EN.png new file mode 100644 index 0000000000000000000000000000000000000000..c96185e96ba3f4795e6f6d0af8d7b97b865fb03b Binary files /dev/null and b/screenshots/device/phone_EN.png differ