基于原生能力的跨应用跳转

"module": { 
  "querySchemes": [ 
  "payapp", 
  ], 
}
1.
2.
3.
4.
5.

"abilities": [ 
{ 
  "skills": [ 
  { 
    "entities": [ 
    "entity.system.home" 
    ], 
    "actions": [ 
    "action.system.home" 
    ], 
    "uris": [ 
    { 
      "scheme": 'payapp' 
    } 
    ], 
  } 
  ] 
} 
]
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.

// payapp:// 后的字段可以自定义，需要由被拉起方应用进行处理 
let paylink = 'payapp://startpay?apppid=123456&page=xxx/pay&query=10'; 
let paydata = bundleManager.canOpenLink(paylink); 
if (paydata) { 
  let want: Want = { 
    uri: paylink 
  }; 
  let context = getContext(this) as common.UIAbilityContext; 
  context.startAbility(want, (error: BusinessError) => { 
    console.error(`error.code = ${error.code}`); 
  }); 
} else { 
  this.pageInfos.pushPath({ name: 'PayWeb' }) 
}
//PayWeb 
import web_webview from '@ohos.web.webview'; 
import business_error from '@ohos.base'; 
 
@Component 
export struct PayWebInfo { 
  @Consume('pageInfos') pageInfos: NavPathStack; 
  webviewController: web_webview.WebviewController = new web_webview.WebviewController(); 
 
  aboutToAppear() { 
    try { 
      this.webviewController.loadUrl($rawfile("pay.html")); 
    } catch (error) { 
      let e: business_error.BusinessError = error as business_error.BusinessError; 
      console.error(`ErrorCode: ${e.code},  Message: ${e.message}`); 
    } 
  } 
 
  build() { 
    NavDestination() { 
      Column() { 
        Web({ src: $rawfile("pay.html"), controller: this.webviewController }) 
      }.width('100%').height('100%') 
    }.hideTitleBar(true) 
  } 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.

//定义一个接口接收want传入的数据 
interface StartParm { 
  bundleName?: string 
  uriResult: uri.URI 
  started: boolean 
} 
//将want数据存入 
function parseStartWant(want: Want): StartParm | undefined { 
  if (want.uri) { 
    let startParam: StartParm = { 
      bundleName: want.bundleName, 
      uriResult: new uri.URI(want.uri), 
      started: false 
    } 
    return startParam 
  } else { 
    return undefined 
  } 
} 
​ 
export default class EntryAbility extends UIAbility { 
  startParam?: StartParm 
  ​ 
  // 冷热启动均执行，用于跳转支付页面 
  action() { 
    if (this.startParam && !this.startParam.started) { 
      this.startParam.started = true 
      let pageInfos = AppStorage.get<NavPathStack>("pageInfos") as NavPathStack; 
      //判断支付页面是否存在 
      let data =pageInfos.getIndexByName('PayPage') 
      if ( data.length == 0 ) { 
        pageInfos.pushPath({ name: 'PayPage' }) 
      }else  { 
        pageInfos.removeByName('PayPage') 
        pageInfos.pushPath({ name: 'PayPage' }) 
      } 
    } 
  } 
  ​ 
  onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void { 
    this.startParam = parseStartWant(want) 
    //本Demo通过AppStorage将传入的数据展示在页面上，例如消费应用，消费金额等 
    AppStorage.setOrCreate<StartParm>("Param",this.startParam ); 
  } 
  ​ 
  onNewWant(want: Want, launchParam: AbilityConstant.LaunchParam): void { 
    this.startParam = parseStartWant(want) 
    //数据处理同onCreate 
    AppStorage.setOrCreate<StartParm>("Param",this.startParam ); 
    //跳转支付页面 
    this.action() 
  } 
 
  onWindowStageCreate(windowStage: window.WindowStage): void { 
    windowStage.loadContent('pages/Index', (err) => { 
      if (err.code) { 
        hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? ''); 
        return; 
      } 
      //由于时序问题，需要使用setTimeout保证页面压栈的顺序 
      setTimeout(()=>{ 
        //跳转支付页面 
        this.action() 
      }) 
    }); 
  } 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.

"module": { 
  ... 
  "querySchemes": [ 
  "bank1", 
  ... 
  "bank9" 
  ] 
}
1.
2.
3.
4.
5.
6.
7.
8.

private payApps: PayApp[] = [ 
  new PayApp('银行1', $r("app.media.startIcon"), 'bank1://xx?xx'), 
  ... 
  new PayApp('银行9', $r("app.media.startIcon"), 'bank9://xx?xx'), 
]
1.
2.
3.
4.
5.

Button("跳转支付列表") 
  .onClick(() => { 
    if (this.dialogController != null) { 
      this.dialogController.open() 
    } 
  })
1.
2.
3.
4.
5.
6.

@State egDivider: DividerTmp = new DividerTmp(1, 10, 10, '# ffe9f0f0') 
​ 
//增加一个类方便定义分割线属性 
class DividerTmp { 
  strokeWidth: Length = 1           //分割线宽度 
  startMargin: Length = 10          //分割线距离左端长度 
  endMargin: Length = 10            //分割线距离右端长度 
  color: ResourceColor = '# ffe9f0f0'//分割线颜色 
  ​ 
  constructor(strokeWidth: Length, startMargin: Length, endMargin: Length, color: ResourceColor) { 
    this.strokeWidth = strokeWidth 
    this.startMargin = startMargin 
    this.endMargin = endMargin 
    this.color = color 
  } 
} 
​ 
//自定义弹窗 
dialogController: CustomDialogController | null = new CustomDialogController({ 
  builder: CustomDialogExample({ 
    payApps: this.payApps, 
    egDivider: this.egDivider 
  }), 
})
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.

//每行app的信息 
class PayApp { 
  name: string; 
  icon: Resource; 
  link: string; 
  installed: boolean = false 
  ... 
} 
​ 
@CustomDialog 
struct CustomDialogExample { 
  @Prop payApps: PayApp[] 
  @Prop egDivider: DividerTmp 
  controller?: CustomDialogController 
 
  aboutToAppear(): void { 
    for (let item of this.payApps) { 
      item.installed = bundleManager.canOpenLink(item.link) 
    } 
    this.payApps = this.payApps.filter((app) => app.installed) 
  } 
  ​ 
  build() { 
    Column() { 
      ... 
      List() { 
        ForEach(this.payApps, (item: PayApp) => { 
          ListItem() { 
            Row() { 
              Image(item.icon).width(25).height(25).margin(10) 
              Text(item.name).fontSize(20) 
            } 
            .onClick(() => { 
              let context = getContext() as common.UIAbilityContext 
              context.startAbility({ uri: item.link }) 
            }) 
            .justifyContent(FlexAlign.Start) 
          } 
        }, (item: PayApp) => item.name.toString()) 
      } 
    } 
  } 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.