FinClip为企业提供小程序生态圈技术产品,开发者可在FinClip小程序开发帮助中心找到相关FinClip小程序指引

# 设置小程序权限弹框

# 1. 效果展示

# 2. 设置小程序权限弹框UI样式

# 2.1 覆盖范围

小程序胶囊UI样式修改,需由App实现,一经设置、App内的全部小程序、小游戏、H5应用均将按照本效果实现。

# 2.2 iOS 设置方法

在初始化SDK时,通过FATAuthViewConfig类进行配置:

// 设置小程序名称字体、大小
[FATClient sharedClient].uiConfig.authViewConfig.appletNameFont = [UIFont fontWithName:@"PingFangSC-Regular" size:16];
// 设置小程序名称的浅色颜色(明亮模式)
[FATClient sharedClient].uiConfig.authViewConfig.appletNameLightColor = [UIColor redColor];
// 设置小程序名称的深色颜色(暗黑模式)
[FATClient sharedClient].uiConfig.authViewConfig.appletNameDarkColor = [UIColor blueColor];

具体可配置项说明:

/**
 小程序名称字体大小,默认字体为PingFangSC-Regular,默认大小16
 */
@property (nonatomic, strong) UIFont *appletNameFont;

/**
 小程序名称的浅色颜色(明亮模式),默认#202020
 */
@property (nonatomic, strong) UIColor *appletNameLightColor;

/**
 小程序名称的深色颜色(暗黑模式),默认#D0D0D0
 */
@property (nonatomic, strong) UIColor *appletNameDarkColor;

/**
 隐私协议入口icon(明亮模式),大小:22pt(@2× @3×)
 */
@property (nonatomic, strong) UIImage *agreementLightImage;

/**
 隐私协议入口icon(暗黑模式),大小:22pt(@2× @3×)
 */
@property (nonatomic, strong) UIImage *agreementDarkImage;

/**
 权限标题字体大小,默认字体为PingFangSC-Medium,默认大小17
 备注:权限选项文字字体大小使用该配置项,但字体固定为PingFangSC-Regular
 */
@property (nonatomic, strong) UIFont *authorizeTitleFont;

/**
 权限标题的浅色颜色(明亮模式),默认#202020
 备注:权限选项文字字体颜色使用该配置项
 */
@property (nonatomic, strong) UIColor *authorizeTitleLightColor;

/**
 权限标题的深色颜色(暗黑模式),默认#D0D0D0
 备注:权限选项文字字体颜色使用该配置项
 */
@property (nonatomic, strong) UIColor *authorizeTitleDarkColor;

/**
 权限描述字体大小,默认字体为PingFangSC-Regular,默认大小14
 */
@property (nonatomic, strong) UIFont *authorizeDescriptionFont;

/**
 权限描述的浅色颜色(明亮模式),默认#666666
 */
@property (nonatomic, strong) UIColor *authorizeDescriptionLightColor;

/**
 权限描述的深色颜色(暗黑模式),默认#8C8C8C
 */
@property (nonatomic, strong) UIColor *authorizeDescriptionDarkColor;

/**
 协议标题字体大小,默认字体为PingFangSC-Regular,默认大小16
 */
@property (nonatomic, strong) UIFont *agreementTitleFont;

/**
 协议标题的浅色颜色(明亮模式),默认#202020
 */
@property (nonatomic, strong) UIColor *agreementTitleLightColor;

/**
 协议标题的深色颜色(暗黑模式),默认#D0D0D0
 */
@property (nonatomic, strong) UIColor *agreementTitleDarkColor;

/**
 协议描述字体大小,默认字体为PingFangSC-Regular,默认大小14
 */
@property (nonatomic, strong) UIFont *agreementDescriptionFont;

/**
 协议描述的浅色颜色(明亮模式),默认#202020
 */
@property (nonatomic, strong) UIColor *agreementDescriptionLightColor;

/**
 协议描述的深色颜色(暗黑模式),默认#D0D0D0
 */
@property (nonatomic, strong) UIColor *agreementDescriptionDarkColor;

/**
 权限选项选中时的icon(明亮模式),大小:22pt(@2× @3×)
 */
@property (nonatomic, strong) UIImage *authorizeSelectedLightImage;

/**
 权限选项选中时的icon(暗黑模式),大小:22pt(@2× @3×)
 */
@property (nonatomic, strong) UIImage *authorizeSelectedDarkImage;

/**
 链接的浅色颜色(明亮模式),默认#409EFF
 */
@property (nonatomic, strong) UIColor *linkLightColor;

/**
 链接的深色颜色(暗黑模式),默认#368CE4
 */
@property (nonatomic, strong) UIColor *linkDarkColor;

/**
 同意按钮配置(明亮模式),默认配置如下:
 圆角:4
 默认背景色:#4285F4
 默认描边:#4285F4
 默认文字颜色:#FFFFFF
 按下背景色:#3B77DB
 按下默认描边:#3B77DB
 按下文字颜色:#FFFFFF
 */
@property (nonatomic, strong) FATAuthButtonConfig *allowButtonLightConfig;

/**
 同意按钮配置(暗黑模式),默认配置如下:
 圆角:4
 默认背景色:#4285F4
 默认描边:#4285F4
 默认文字颜色:#FFFFFF
 按下背景色:#5E97F5
 按下默认描边:#5E97F5
 按下文字颜色:#FFFFFF
 */
@property (nonatomic, strong) FATAuthButtonConfig *allowButtonDarkConfig;

/**
 拒绝按钮配置(明亮模式),默认配置如下:
 圆角:4
 默认背景色:#FFFFFF
 默认描边:#E2E2E2
 默认文字颜色:#222222
 按下背景色:#D8D8D8
 按下默认描边:#D8D8D8
 按下文字颜色:#222222
 */
@property (nonatomic, strong) FATAuthButtonConfig *rejectButtonLightConfig;

/**
 拒绝按钮配置(暗黑模式),默认配置如下:
 圆角:4
 默认背景色:#2C2C2C
 默认描边:#2C2C2C
 默认文字颜色:#D0D0D0
 按下背景色:#414141
 按下默认描边:#414141
 按下文字颜色:#D0D0D0
 */
@property (nonatomic, strong) FATAuthButtonConfig *rejectButtonDarkConfig;

# 2.3 Android 设置方法

在初始化SDK时,通过AuthViewConfig类进行配置:

FinAppConfig.UIConfig uiConfig = new FinAppConfig.UIConfig();
AuthViewConfig authViewConfig = new AuthViewConfig();
uiConfig.setAuthViewConfig(authViewConfig);

具体可配置项说明:

/**
 * 授权弹框配置
 */
public static class AuthViewConfig {
    /**
     * 小程序名称字体大小,默认16
     */
    public float appletNameTextSize = 16;

    /**
     * 小程序名称的浅色颜色,默认#222222
     */
    @ColorInt
    public int appletNameLightColor = 0xff222222;

    /**
     * 小程序名称的深色颜色,默认#d0d0d0
     */
    @ColorInt
    public int appletNameDarkColor = 0xffd0d0d0;

    /**
     * 权限标题字体大小,默认17
     */
    public float authorizeTitleTextSize = 17;

    /**
     * 权限标题的浅色颜色,默认#222222
     */
    @ColorInt
    public int authorizeTitleLightColor = 0xff222222;

    /**
     * 权限标题的深色颜色,默认#d0d0d0
     */
    @ColorInt
    public int authorizeTitleDarkColor = 0xffd0d0d0;

    /**
     * 权限描述字体大小,默认14
     */
    public float authorizeDescriptionTextSize = 14;

    /**
     * 权限描述的浅色颜色,默认#666666
     */
    @ColorInt
    public int authorizeDescriptionLightColor = 0xff666666;

    /**
     * 权限描述的深色颜色,默认#5c5c5c
     */
    @ColorInt
    public int authorizeDescriptionDarkColor = 0xff5c5c5c;

    /**
     * 协议选项选中时的浅色icon,大小:22x22dp
     */
    @DrawableRes
    public int authorizeSelectedLightImage = R.drawable.fin_applet_ic_checked;

    /**
     * 协议选项选中时的深色icon,大小:22x22dp
     */
    @DrawableRes
    public int authorizeSelectedDarkImage = R.drawable.fin_applet_ic_checked;

    /**
     * 隐私协议入口浅色icon,大小:22x22dp
     */
    @DrawableRes
    public int agreementLightImage = R.drawable.fin_applet_info;

    /**
     * 隐私协议入口深色icon,大小:22x22dp
     */
    @DrawableRes
    public int agreementDarkImage = R.drawable.fin_applet_info;

    /**
     * 协议标题字体大小,默认16
     */
    public float agreementTitleTextSize = 16;

    /**
     * 协议标题的浅色颜色,默认#222222
     */
    @ColorInt
    public int agreementTitleLightColor = 0xff222222;

    /**
     * 协议标题的深色颜色,默认#d0d0d0
     */
    @ColorInt
    public int agreementTitleDarkColor = 0xffd0d0d0;

    /**
     * 协议描述字体大小,默认14
     */
    public float agreementDescriptionTextSize = 14;

    /**
     * 协议描述的浅色颜色,默认#222222
     */
    @ColorInt
    public int agreementDescriptionLightColor = 0xff222222;

    /**
     * 协议描述的深色颜色,默认#d0d0d0
     */
    @ColorInt
    public int agreementDescriptionDarkColor = 0xffd0d0d0;

    /**
     * 链接的浅色颜色,默认#4285f4
     */
    @ColorInt
    public int linkLightColor = 0xff4285f4;

    /**
     * 链接的深色颜色,默认#4285f4
     */
    @ColorInt
    public int linkDarkColor = 0xff4285f4;

    /**
     * 同意按钮浅色配置,默认配置如下:
     * 圆角:4
     * 默认背景色:#4285F4
     * 按下背景色:#3B77DB
     * 默认描边:#4285F4
     * 按下默认描边:#3B77DB
     * 默认文字颜色:#FFFFFF
     * 按下文字颜色:#FFFFFF
     */
    public AuthButtonConfig allowButtonLightConfig = new AuthButtonConfig(
            4, 0xff4285f4, 0xff3b77db,
            0xff4285f4, 0xff3b77db,
            0xffffffff, 0xffffffff
    );

    /**
     * 同意按钮深色配置,默认配置如下:
     * 圆角:4
     * 默认背景色:#4285F4
     * 按下背景色:#5E97F5
     * 默认描边:#4285F4
     * 按下默认描边:#5E97F5
     * 默认文字颜色:#FFFFFF
     * 按下文字颜色:#FFFFFF
     */
    public AuthButtonConfig allowButtonDarkConfig = new AuthButtonConfig(
            4, 0xff4285f4, 0xff5e97f5,
            0xff4285f4, 0xff5e97f5,
            0xffffffff, 0xffffffff
    );

    /**
     * 拒绝按钮浅色配置,默认配置如下:
     * 圆角:4
     * 默认背景色:#FFFFFF
     * 按下背景色:#D8D8D8
     * 默认描边:#E2E2E2
     * 按下默认描边:#D8D8D8
     * 默认文字颜色:#222222
     * 按下文字颜色:#222222
     */
    public AuthButtonConfig rejectButtonLightConfig = new AuthButtonConfig(
            4, 0xffffffff, 0xffd8d8d8,
            0xffe2e2e2, 0xffd8d8d8,
            0xff222222, 0xff222222
    );

    /**
     * 拒绝按钮深色配置,默认配置如下:
     * 圆角:4
     * 默认背景色:#2C2C2C
     * 按下背景色:#414141
     * 默认描边:#2C2C2C
     * 按下默认描边:#414141
     * 默认文字颜色:#D0D0D0
     * 按下文字颜色:#D0D0D0
     */
    public AuthButtonConfig rejectButtonDarkConfig = new AuthButtonConfig(
            4, 0xff2c2c2c, 0xff414141,
            0xff2c2c2c, 0xff414141,
            0xffd0d0d0, 0xffd0d0d0
    );

    /**
     * 按钮配置
     */
    public static class AuthButtonConfig {
        /**
         * 按钮的圆角半径
         */
        public float cornerRadius;

        /**
         * 按钮默认背景颜色
         */
        @ColorInt
        public int normalBackgroundColor;

        /**
         * 按钮按下背景颜色
         */
        @ColorInt
        public int pressedBackgroundColor;

        /**
         * 按钮默认边框颜色
         */
        @ColorInt
        public int normalBorderColor;

        /**
         * 按钮按下边框颜色
         */
        @ColorInt
        public int pressedBorderColor;

        /**
         * 按钮默认文字颜色
         */
        @ColorInt
        public int normalTextColor;

        /**
         * 按钮按下文字颜色
         */
        @ColorInt
        public int pressedTextColor;

        public AuthButtonConfig(float cornerRadius,
                                int normalBackgroundColor,
                                int pressedBackgroundColor,
                                int normalBorderColor,
                                int pressedBorderColor,
                                int normalTextColor,
                                int pressedTextColor)
    }
}
© FinClip with ❤ , Since 2017