Weex-iOS 摇一摇功能

Weex-iOS 摇一摇功能

需求：
Weex+Vue开发混合App。项目需求中，有一个页面，需要用到摇一摇功能，来进行业务交互。由于Weex 三方插件资料比较少，这边没有找到Weex调用移动端的摇一摇weex插件，所以直接就使用Weex内置组件来和原生进行交互了。

开发思路

需要对Android和iOS分别进行原生开发，然后通过Weex的内置组件globalEvent来监听持久性事件。
Weex globalEvent官方文档 Weex globalEvent
好了，不多说了，直接上代码。

iOS代码

第一步：上代码
直接在WeexDemo工程中的WXDemoViewController.h文件中稍作修改。
代码修改如下：
修改从，注释：//设置震动 SX标记 处开始。
注释了，WeexDemo工程中，摇一摇功能自带实现的隐藏和显示导航栏的代码部分。

#pragma mark -
#pragma mark - UIResponder support motion
#pragma mark -
#pragma mark 摇动开始 SX标记
-(void) motionBegan:(UIEventSubtype)motion withEvent:(UIEvent *)event
{
}

-(void) motionCancelled:(UIEventSubtype)motion withEvent:(UIEvent *)event
{
}

-(void) motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event
{
//    static BOOL shakeMarker = YES;
    if (motion == UIEventSubtypeMotionShake) {
//        if (shakeMarker) {
//            [self addNaviationBar];
//            shakeMarker = NO;
//        }else {
//            [self removeNaviationBar];
//            shakeMarker = YES;
//        }
        //设置震动 SX标记
        AudioServicesPlaySystemSound(kSystemSoundID_Vibrate);
        [self.instance fireGlobalEvent:@"shakephone" params:@{@"shake":@"shakeios"}];
//        WeexInstance  instance
    }
}

第二步：导入头文件

#import 

同时，将AudioToolbox包添加到工程中。

Weex项目中，vue相关代码

在相对应的业务代码.vue文件中。比如：books.vue
使用Weex的内置组件，globalEvent,如果没看懂代码，可以参考官方资料。

1)定义变量

var sxglobalEvent = weex.requireModule('globalEvent');

2）methods: {}中的函数，addListtenerShakePhone，添加全局监听事件。并在监听中，处理监听到的时间处理。比如，我这边，监听到摇一摇，就调用shakephone()方法。至于shakephone()方法体中，就是我们处理的业务代码了。比如摇一摇签到，摇一摇获取定位等。

[Weex globalEvent官方文档](http://weex.apache.org/cn/references/modules/globalevent.html)

API 注册全局事件
addEventListener(String eventName, String callback)

参数说明：
eventName {string}：需要监听的事件名称。
callback {Function}：触发事件后的回调函数。

addListtenerShakePhone(){
          sxglobalEvent.addEventListener('shakephone',e => {
                this.shakephone()
            })
      },

3）在mounted()方法中，调用注册方法

mounted() {
    this.addListtenerShakePhone()
  },
 

4）在destroyed(){}中，移除监听。不然页面跳转后，其他页面如果有该事件监听，会导致失效。

destroyed() {
        sxglobalEvent.removeEventListener('shakephone');
  }

好了，代码就是以上一些代码。

我这边参考链接如下：
Weex globalEvent官方文档

iOS仿照微信摇一摇功能实现