Mini Program Loading Page Style Config

1. Effect show

FinClip mini program SDK supports personalized configuration of loading pages and error pages. Among them:

• Loading page means: when launching the mini program, if the mini program is not downloaded to the device, the mini program container will start the loading page to prompt the user to wait, and when the mini program is installed to the device, the loading page will close and jump to the mini program. When users open the mini program for the first time, or after the mini program version update, the loading page will stay relatively long
• The error page is the page displayed to the user when the mini program fails to load or generates other unknown errors.

The specific UI effect can be seen in the following figure:

2. Coverage

This setting is implemented by the App, you can configure the view of loading page and error page, once set, all the mini programs in the App will be implemented according to this effect.

3. iOS setup method

3.1 Implementing custom loading pages

For iOS mini programs, the SDK supports developers to customize the content of the loading page, you can configure it as follows: 1. Modify the style of the loading page in the subclass inherited from FATBaseLoadingView.

Code examples are as follows:

@interface LoadingView : FATBaseLoadingView
@end
@implementation LoadingView
- (instancetype)initWithFrame:(CGRect)frame {
    if ([super initWithFrame:frame]) {
        self.backgroundColor = [UIColor greenColor];
        self.loadingView.padding = 20;
        self.loadingView.dotView.backgroundColor = [UIColor blackColor];
        self.loadingView.animation.duration = 5;
        self.titleLabel.textColor = [UIColor redColor];
    }
    return self;
}
@end

2.Set the baseLoadingViewClass property of the FATConfig object to the class name of the custom loading page.

FATConfig *config = [FATConfig configWithStoreConfigs:storeConfigs];
config.baseLoadingViewClass = @"LoadingView";
[[FATClient sharedClient] initWithConfig:config error:nil];

3.2 Implementing a custom loading failure page

The implementation is similar to the custom loading page, the specific steps are as follows: 1. Modify the style of the loading failure page in the subclass inherited from FATBaseLoadFailedView.

@interface LoadFailedView : FATBaseLoadFailedView
@end
@implementation LoadFailedView
- (instancetype)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        self.errorLabel.textColor = [UIColor redColor];
    }
    return self;
}
- (void)layoutSubviews {
    [super layoutSubviews];
    CGFloat bottom = self.fat_height;
    self.errorImageView.fat_bottom = bottom - 110;
    self.errorLabel.fat_top = self.errorImageView.fat_bottom + 30;
    self.detailLabel.fat_top = self.errorLabel.fat_bottom + 15;
}
@end

2.Set the baseLoadingViewClass property of the FATConfig object to the class name of the custom loading failure page.

FATConfig *config = [FATConfig configWithStoreConfigs:storeConfigs];
config.baseLoadFailedViewClass = @"LoadFailedView";
[[FATClient sharedClient] initWithConfig:config error:nil];