实现Weex在iOS上的HUD扩展

Weex SDK给实现了toast，即提示语。但是没有hud转圈来提示加载中的状态。下面简单实现一个hud的扩展。Weex官网也提供了增加扩展的方法，地址http://weex.apache.org/cn/references/advanced/extend-to-ios.html。在Xcode工程中，新建WXHudModule类，继承WXModuleProtocol。

//hud扩展

@interface WXHudModule : NSObject<WXModuleProtocol>

@end

在WXHudModule.m中，定义hud的显示(show)和隐藏(hide)方法，并加宏WX_EXPORT_METHOD, 它可以被weex识别，添加@synthesized weexInstance，每个moudle对象被绑定到一个指定的实例上。

#import "WXHudModule.h"
#import "KTools.h"

@implementation WXHudModule

@synthesize weexInstance;

WX_EXPORT_METHOD(@selector(show))
WX_EXPORT_METHOD(@selector(hide))


/*
显示hud
 */
- (void)show
{
    [KTools showhud:YES];
}

/*
 隐藏hud
 */
-(void)hide
{
    [KTools showhud:NO];
}

@end

#import "KTools.h"
@implementation KTools

+(void)showmsg:(NSString*)msg
{
    [MBManager showBriefAlert:msg];
}

+(void)showhud:(BOOL)flag
{
    if(flag)
    {
        [MBManager showLoading];
    }
    else
    {
        [MBManager hideAlert];
    }
}
@end

最后在WXSDKEngine.m中注册这个module

[self registerModule:@"hud" withClass:NSClassFromString(@"WXHudModule")];

@"hud"就是可以在weex的js工程中可以引用的模块名。

WXSDKEngine.m中的_registerDefaultModules类方法（如下）。注册的都是扩展模块，比如navigator、storage等。withClass：中的类名，就是其扩展实现的类。

+ (void)_registerDefaultModules
{
    [self registerModule:@"dom" withClass:NSClassFromString(@"WXDomModule")];
    [self registerModule:@"navigator" withClass:NSClassFromString(@"WXNavigatorModule")];
    [self registerModule:@"stream" withClass:NSClassFromString(@"WXStreamModule")];
    [self registerModule:@"animation" withClass:NSClassFromString(@"WXAnimationModule")];
    [self registerModule:@"modal" withClass:NSClassFromString(@"WXModalUIModule")];
    [self registerModule:@"webview" withClass:NSClassFromString(@"WXWebViewModule")];
    [self registerModule:@"instanceWrap" withClass:NSClassFromString(@"WXInstanceWrap")];
    [self registerModule:@"timer" withClass:NSClassFromString(@"WXTimerModule")];
    [self registerModule:@"storage" withClass:NSClassFromString(@"WXStorageModule")];
    [self registerModule:@"clipboard" withClass:NSClassFromString(@"WXClipboardModule")];
    [self registerModule:@"globalEvent" withClass:NSClassFromString(@"WXGlobalEventModule")];
    [self registerModule:@"canvas" withClass:NSClassFromString(@"WXCanvasModule")];
    [self registerModule:@"picker" withClass:NSClassFromString(@"WXPickerModule")];
    [self registerModule:@"meta" withClass:NSClassFromString(@"WXMetaModule")];
    [self registerModule:@"webSocket" withClass:NSClassFromString(@"WXWebSocketModule")];
    [self registerModule:@"voice-over" withClass:NSClassFromString(@"WXVoiceOverModule")];
    [self registerModule:@"hud" withClass:NSClassFromString(@"WXHudModule")];
}

使用：

在weex的js工程中，写一个div按钮，点击显示hud。

const hud = weex.requireModule('hud');//引用hud模块
                hud.show();//显示hud
                //hud.hide();//隐藏hud