Customize splash view for mini programs

2024-05-16 07:13

When you open a mini program for the very first time, download and unzip the resource bundle. This is a time-consuming operation so you will see a splash view indicating that the mini program is trying to load. See below the default splash view of Griver:

Griver enables the customization of the splash view by exposing a protocol named GRVSplashViewDelegate.

Sample code

copy
let config = IAPConnectInitConfig()
let extensionDelegate = GRVExtensionDelegate()
extensionDelegate.uiProvider.splashViewDelegate = DemoSplashViewDelegate()
config.riverExtensionDelegate = extensionDelegate

copy
@interface DemoSplashViewDelegate : NSObject <GRVSplashViewDelegate>

@end

@implementation DemoSplashViewDelegate

- (UIView *)createSplashViewWithCloseAppAction:(void (^)(void))closeAppAction {
    DemoSplashView *splashView = [[DemoSplashView alloc] init];
    splashView.closeAction = closeAppAction;
    return splashView;
}

- (void)splashView:(UIView *)splashView updateLoadingInfo:(GRVSplashViewInfo *)info {
    DemoSplashView *defaultSplashView = (id)splashView;
    [defaultSplashView updateWith:info];
}

- (void)splashView:(UIView *)splashView showErrorMessage:(NSString *)message code:(NSString *)code {
    DemoSplashView *defaultSplashView = (id)splashView;
    [defaultSplashView showErrorMessage:message code:code];
}

- (void)exitSplashView:(UIView *)splashView {
    [splashView removeFromSuperview];
}

@end

For the full demo and the implementation detail of DemoSplashView, refer to the GriverDemo project.

Sample

This is the demo splash view from the GriverDemo project. Here the view is very simple and it shows only the name of the mini program.

Detail

There are four methods to implement GRVSplashViewDelegate. See below for a detailed explanation of the protocol.

copy
@protocol GRVSplashViewDelegate <NSObject>

/// This method is called when Griver needs to create a splash view.
/// The returned UIView will be added as a subview to Griver's view hierachy.
/// Please save and execute the closeAppAction block if you want to abort the loading process and exit.
/// @param closeAppAction The close action to be saved.
- (UIView *)createSplashViewWithCloseAppAction:(void(^)(void))closeAppAction;

/// This is called for Griver to notify your delegate to update the view with the given info.
/// @param splashView Your splash view.
/// @param info The info model with mini program meta data.
- (void)splashView:(UIView *)splashView updateLoadingInfo:(GRVSplashViewInfo *)info;

/// This is called for Griver to notify your delegate when an error is encountered.
/// @param splashView Your splash view.
/// @param message The error message to be shown.
/// @param code The error code to be shown. 
- (void)splashView:(UIView *)splashView showErrorMessage:(NSString *)message code:(NSString *)code;

/// This is called for Griver to notify your delegate to hide the splash view.
/// You may simply call [splashView removeFromSuperview].
/// @param splashView Your splash view.
- (void)exitSplashView:(UIView *)splashView;

@end

copy
@interface GRVSplashViewInfo : NSObject

@property (nonatomic, copy) NSString *appId;
@property (nonatomic, copy) NSString *appName;
@property (nonatomic, copy) NSString *iconUrl;
@property (nonatomic, copy) NSString *desc;
@property (nonatomic, copy) NSString *slogan;

@end