使用 Swift 扩展 Weex

Swift和Objective-C使用Swift扩展iOS能力 - 图1 混编

参考完整 例子使用Swift扩展iOS能力 - 图2

使用 Swift 进行 module 扩展

因为 module 暴露 method 是通过Objective-C宏来做的,调用的时候是通过反射,所以Swift扩展 module 通过extensionObjective-C的类。

  • 新建 WXSwiftTestModule.h/mWXSwiftTestModule.swift文件, 在新建Swift文件的时候会提示img选择 Create Bridging Header, 因为我们要在 Swift 中访问 Objective-C 的一些类,正是通过这个 header暴露 OC 的类给 Swift,header 格式为 yourTarget-Bridging-Header.h,我这里创建完header文件名称为:WeexDemo-Bridging-Header.h

  • WXSwiftTestModule.h/m中实现

    • WXSwiftTestModule.h 中
  1. #import <Foundation/Foundation.h>
  2. #import <WeexSDK/WeexSDK.h>
  3. @interface WXSwiftTestModule : NSObject <WXModuleProtocol>
  4. @end
  • WXSwiftTestModule.m 中

WeexDemo-Swift.h 这个文件需要编译一下才可以搜索到,具体的路径

  1. weex/ios/playground/DerivedData/WeexDemo/Build/Intermediates/WeexDemo.build/Debug-iphonesimulator/WeexDemo.build/DerivedSources/WeexDemo-Swift.h

路径具体需要根据自己工程而定

  1. #import "WXSwiftTestModule.h"
  2. #import "WeexDemo-Swift.h" // Swift类和方法 被 `Objective-C` 识别需要导入
  3. @implementation WXSwiftTestModule
  4. #pragma clang diagnostic push //关闭unknow selector的warrning
  5. #pragma clang diagnostic ignored "-Wundeclared-selector"
  6. WX_EXPORT_METHOD(@selector(printSome:callback:)) //Swift 中定义的方法,XCode 转换成的最终的方法名称,在`WeexDemo-Swift.h`里面查看
  7. #pragma clang diagnostic pop
  8. @end
  • Swift 中实现扩展 OC 的类 WXSwiftTestModule,增加了一个方法,这个方法就是我们要暴露出来,在 js 中可以调到的

    • WXSwiftTestModule.swift
  1. import Foundation
  2. public extension WXSwiftTestModule {
  3. public func printSome(someThing:String, callback:WXModuleCallback) {
  4. print(someThing)
  5. callback(someThing)
  6. }
  7. }

WXSwiftTestModuleWXModuleCallback 因为是 OC 的,需要在 WeexDemo-Bridging-Header 中暴露

  • WeexDemo-Bridging-Header.h中
  1. //
  2. // Use this file to import your target's public headers that you would like to expose to Swift.
  3. //
  4. #import "WXSwiftTestModule.h"
  5. #import "WeexSDK.h"

至此这个使用 Swift 开发的简单的 module 已经完成

module 使用

  • 注册 module
  1. [WXSDKEngine registerModule:@"swifter" withClass:[WXSwiftTestModule class]];
  • 前端脚本中用法
  1. <template>
  2. <text>Swift Module</text>
  3. </template>
  4. <script>
  5. module.exports = {
  6. ready: function() {
  7. var swifter = weex.require('swifter');
  8. swifter.printSome("https://www.taobao.com",function(param){
  9. nativeLog(param);
  10. });
  11. }
  12. };
  13. </script>