firebase / FirebaseUI-iOS

iOS UI bindings for Firebase.
Apache License 2.0
1.51k stars 472 forks source link

FirebaseUI Sign in with Apple , button label text color error. #845

Closed fangyuxi closed 3 years ago

fangyuxi commented 4 years ago

[REQUIRED] Step 1: Describe your environment

[REQUIRED] Step 2: Describe the problem

WechatIMG100
google-oss-bot commented 4 years ago

I found a few problems with this issue:

fangyuxi commented 4 years ago

I can't create a FUIOAuth use custom text button color.

fangyuxi commented 4 years ago

So I have to use the following code to fix this UI problem so that I can adapt to the dark mode. UGLY CODE

1011584768824_ pic_hd

Without correction, my app will not pass the review. The reason is as follows.

9da1e9be-83c8-43bb-9676-14c2b1bcc3d0

ryanwilson commented 4 years ago

@fangyuxi I transferred this to the FirebaseUI repo itself since it's related here. This is also related to #823

ryanwilson commented 4 years ago

We should be using ASAuthorizationAppleIDButton since it's the button provided by Apple and will always conform to proper UI guidelines.

fangyuxi commented 4 years ago

We should be using ASAuthorizationAppleIDButton since it's the button provided by Apple and will always conform to proper UI guidelines.

We don't have to use the button provided by Apple. At some point, you need to customize this button, and Apple also provides a ui guide to guide us how to customize.

Casey10110 commented 3 years ago

How do you customize it?

fangyuxi commented 3 years ago

@Casey10110 I can show some code for you.

fangyuxi commented 3 years ago

@Casey10110 here is the code that customize apple sign in button.

The @"applelogo" image, is provided by Apple.

NSMutableArray<id <FUIAuthProvider>> *providers = @[].mutableCopy;
    if (@available(iOS 13.0, *)) {
        FUIOAuth *apple =  [[FUIOAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI]
                                                    providerID:@"apple.com"
                                               buttonLabelText:@"Sign in with Apple"
                                                     shortName:@"Apple"
                                                   buttonColor:[UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:1.0]
                                                     iconImage:[UIImage imageNamed:@"applelogo"]
                                                        scopes:@[@"name", @"email"]
                                              customParameters:nil
                                                  loginHintKey:nil];
        [providers addObject:apple];
    }

    [providers addObject:[FUIFacebookAuth new]];
    [providers addObject:[FUIGoogleAuth new]];
    [providers addObject:[FUIEmailAuth new]];
- (void)reviseAppleSignInButtonUI:(UIView *)rootView {
    for (UIView *subView in [rootView subviews]){
        if (!rootView.subviews.count) {
            return;
        }
        if ([subView isKindOfClass:[UIButton class]]) {
            if ([subView respondsToSelector:@selector(providerUI)]) {
                id<FUIAuthProvider> provider = [subView performSelector:@selector(providerUI)];
                if ([provider.providerID isEqualToString:@"apple.com"]) {
                    self.appleLoginButton = (UIButton *)subView;

                    //revise button ui
                    if (@available(iOS 13.0, *)){

                        self.appleLoginButton.titleLabel.font = [UIFont systemFontOfSize:19.0f];
                        self.appleLoginButton.height = 44;
                       [self.appleLoginButton setTitleColor:[UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull trait) {
                           if (trait.userInterfaceStyle == UIUserInterfaceStyleDark) {
                               return [UIColor blackColor];
                           } else {
                               return [UIColor whiteColor];
                           }
                        }] forState:UIControlStateNormal];

                        [self.appleLoginButton setBackgroundColor:[UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull trait) {
                           if (trait.userInterfaceStyle == UIUserInterfaceStyleDark) {
                               return [UIColor whiteColor];
                           } else {
                               return [UIColor blackColor];
                           }
                        }]];
                    }
                    return;
                }
            }
        }
        [self reviseAppleSignInButtonUI:subView];
    }
}

The method 'reviseAppleSignInButtonUI' defined in the controller whose super class controller is FUIAuthPickerViewController.

#import <UIKit/UIKit.h>
@import FirebaseUI;

NS_ASSUME_NONNULL_BEGIN

@interface ENLoginController : FUIAuthPickerViewController<FIRAuthUIDelegate>

@end

NS_ASSUME_NONNULL_END

image

Casey10110 commented 3 years ago

Right on, thank you. I just modified the file in the FirebaseUI and recompiled: + (FUIOAuth *)appleAuthProvider { UIImage *iconImage = [FUIAuthUtils imageNamed:@"ic_apple" fromBundleNameOrNil:@"FirebaseOAuthUI"]; UIColor *buttonColor = [UIColor blackColor]; UIColor *buttonTextColor = [UIColor whiteColor]; if (UITraitCollection.currentTraitCollection.userInterfaceStyle == UIUserInterfaceStyleLight) { iconImage = [iconImage imageWithTintColor:[UIColor whiteColor]]; buttonColor = [UIColor blackColor]; buttonTextColor = [UIColor whiteColor]; } FUIOAuth *provider = [[FUIOAuth alloc] initWithAuthUI:[FUIAuth defaultAuthUI] providerID:@"apple.com" buttonLabelText:@"Sign in with Apple" shortName:@"Apple" buttonColor:buttonColor iconImage:iconImage scopes:@[@"name", @"email"] customParameters:nil loginHintKey:nil]; //provider.buttonAlignment = FUIButtonAlignmentCenter; provider.buttonTextColor = buttonTextColor; return provider; }

morganchen12 commented 3 years ago

This should be fixed in the latest version of FirebaseUI. Please let me know if that's not the case.