Defina a página de carregamento da interface do usuário

1. Exibição de efeito

O SDK do applet PhizClip suporta a configuração personalizada de páginas de carregamento e páginas de erro. Entre eles:

• Página de carregamento significa: ao lançar o applet, se o applet não estiver baixado no dispositivo, o contêiner do applet iniciará a página de carregamento para indicar ao usuário que aguarde, e quando o applet for instalado no dispositivo, a página de carregamento será fechada e o applet será iniciado. Quando os usuários abrem o applet pela primeira vez, ou após a atualização da versão do applet, a página de carregamento permanecerá relativamente por um tempo
• A página de erro é a página exibida ao usuário quando o applet falha ao carregar ou gera outros erros desconhecidos.

O efeito visual específico pode ser visto na figura a seguir:

2. Cobertura

Essa configuração é implementada pelo aplicativo. Você pode configurar a visualização da página de carregamento e da página de erro. Uma vez definida, todos os applets no aplicativo serão implementados de acordo com esse efeito

3. Método de configuração do iOS

3.1 Implementando páginas de carregamento personalizado

Para applets no iOS, o SDK oferece suporte aos desenvolvedores para personalizar o conteúdo da página de carregamento. Você pode configurá-lo da seguinte forma: 1.Modifique o estilo da página de carregamento na subclasse herdada de FATBaseLoadingView

Exemplos de código estão apresentados a seguir:

@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.Defina a propriedade baseLoadingViewClass do objeto FATConfig com o nome da classe da página de carregamento personalizada.

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

3.2 Implementando uma página de falha de carregamento personalizada

A implementação é semelhante à página de carregamento personalizada, os passos específicos são os seguintes: 1.Modificar o estilo da página de falha de carregamento na subclasse herdada de 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.Configure a propriedade baseLoadingViewClass do objeto FATConfig com o nome da classe da página personalizada de falha de carregamento

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

4. Método de configuração do Android

O SDK disponibiliza uma classe abstrata chamada IFinAppletLoadingPage, da qual os desenvolvedores podem herdar para implementar sua própria visualização de página de carregamento e página de falha, e configurar a classe de implementação durante a inicialização do SDK

4.1 Descrição do método abstrato IFinAppletLoadingPage

/**
 * Layout ID of the applet in loading
 */
abstract fun getLoadingLayoutRes(): Int

/**
 * Layout ID for applet load failure
 */
abstract fun getFailureLayoutRes(): Int

/**
 * Applet load failure callback
 *
 * @param msg   Error message
 */
@Deprecated( "No more callbacks since version 2.36.3, please use onLoadingFailure(title: String, msg: String)" )
abstract fun onLoadingFailure(msg: String)

/**
 * Applet load failure callback
 *
 * @param title Wrong title
 * @param msg   Error message
 */
abstract fun onLoadingFailure(title: String, msg: String)

/**
 * Update the information about the applet, the parameters are the basic information of the applet, it will call back several times,
 * May be empty at the initial callback (e.g. the applet is launched for the first time and basic information has not been downloaded),
 * Developers are required to perform their own nulling.
 *
 * @param appTitle      app name
 * @param appAvatarUrl  app icon link
 */
abstract fun onUpdate(appTitle: String, appAvatarUrl: String)

Esta classe fornece duas instâncias de layout:

• FailureLayout

  O layout do arquivo da página de erro retornado pelo método getFailureLayoutRes

• LoadingLayout

  Corresponde ao arquivo de layout da página de carregamento retornado pelo método getLoadingLayoutRes

4.2 Exemplo de implementação completa de uma página de carregamento personalizada:

Nota

Como o SDK utiliza internamente técnicas de reflexão para instanciar a classe de implementação, a classe de implementação da página de carregamento deve conter apenas o parâmetro Context no construtor.

Exemplos são os seguintes:

class CustomLoadingPage constructor(context: Context) : IFinAppletLoadingPage(context) {

    override fun getFailureLayoutRes(): Int {
        // Error page layout resource file
        return R.layout.layout_applet_failure
    }

    override fun getLoadingLayoutRes(): Int {
        // Load page layout resource file
        return R.layout.layout_applet_loading
    }

    override fun onLoadingFailure(msg: String) {
        // This method is deprecated, please use the following onLoadingFailure(title: String, msg: String)
    }

    override fun onLoadingFailure(title: String, msg: String) {
        // Error page error message body
        failureLayout.findViewById<TextView>(R.id.tvLoadingFailedTitle).text = title
        failureLayout.findViewById<TextView>(R.id.tvLoadingFailedMsg).text = msg
    }

    override fun onUpdate(appTitle: String, appAvatarUrl: String) {
        // Loading page applet name
        loadingLayout.findViewById<TextView>(R.id.tvTitle).text = appTitle
        // Loading page applet icon
        ImageLoader.get(context).load(appAvatarUrl, object : DrawableCallback {
            override fun onLoadFailure() {

            }

            override fun onLoadSuccess(r: Drawable) {
                loadingLayout.findViewById<RoundedImageView>(R.id.ivAvatar).setImageDrawable(r)
            }
        })
    }
}

4.3 Configurando a página de carregamento durante a inicialização do SDK

val uiConfig = FinAppConfig.UIConfig()
// Configuring custom loading pages
uiConfig.setLoadingLayoutCls(CustomLoadingPage::class.java)

val config = FinAppConfig.Builder()
        // Other configuration items omitted
        .setUiConfig(uiConfig)
        .build()

FinAppClient.init(application, config, object : FinCallback<Any?> {
    override fun onSuccess(result: Any?) {

    }

    override fun onError(code: Int, error: String) {

    }

    override fun onProgress(status: Int, error: String) {
    }
})