34

iOSアプリでFacebookに接続するために、iOS用のFacebookSDKのFBLoginVIewを使用しています。

素敵なFBログインボタンが表示されますが、ログインボタンには自分の画像とテキストを使用したいと思います。問題は、それをカスタマイズする方法がどこにも見当たらないことです。

FacebookSDKResources.bundle / FBLoginView / imagesの画像を上書きして、ログインボタンの背景画像を変更できましたが、ログインボタンのテキストと位置を変更する場所が見つからなかったため、「ログイン」のままになります...

解決策、誰か?

ありがとうございました

4

17 に答える 17

67

答えは、FBLoginView サブビューを調べて、ボタンとラベルを見つけてカスタマイズすることです。

コードは次のとおりです。

FBLoginView *loginview = 
[[FBLoginView alloc] initWithPermissions:[NSArray arrayWithObject:@"publish_actions"]];


loginview.frame = CGRectMake(4, 95, 271, 37);
for (id obj in loginview.subviews)
        {
            if ([obj isKindOfClass:[UIButton class]])
            {
                UIButton * loginButton =  obj;
                UIImage *loginImage = [UIImage imageNamed:@"YourImg.png"];
                [loginButton setBackgroundImage:loginImage forState:UIControlStateNormal];
                [loginButton setBackgroundImage:nil forState:UIControlStateSelected];
                [loginButton setBackgroundImage:nil forState:UIControlStateHighlighted];
                [loginButton sizeToFit];
            }
            if ([obj isKindOfClass:[UILabel class]])
            {
                UILabel * loginLabel =  obj;
                loginLabel.text = @"Log in to facebook";
                loginLabel.textAlignment = UITextAlignmentCenter;
                loginLabel.frame = CGRectMake(0, 0, 271, 37);
            }
        }

loginview.delegate = self;

[self.view addSubview:loginview];
于 2012-09-05T12:06:36.143 に答える
9

私はFBLoginviewがUIBarbuttonとして表示されるようにしたかったので、簡単なアプローチを作成しました:

まず、FBLoginView をプロパティとして追加しました。

@property (nonatomic, strong) FBLoginView* loginView;

そして、ビューの外にログイン ビューを追加しました。

    self.loginView = [[FBLoginView alloc] init];
    self.loginView.frame = CGRectMake(-500, -500, 0, 0);
    [self.view addSubview:self.loginView];
    self.loginView.delegate = self;

そして、標準システムの UIbarbuttonItem を追加しました

    UIBarButtonItem* fbButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemAction target:self action:@selector(fireFbLoginView)];
    [self.navigationItem setRightBarButtonItem:fbButton];

そして、FBLoginViewのクリックアクションを起動するようにバーボタンを設定しました;)

-(void)fireFbLoginView{
for(id object in self.loginView.subviews){
    if([[object class] isSubclassOfClass:[UIButton class]]){
        UIButton* button = (UIButton*)object;
        [button sendActionsForControlEvents:UIControlEventTouchUpInside];
    }
  }
}
于 2014-01-27T16:38:59.150 に答える
8

私がこれを書いているとき、Facebook はすでに iOS 用 SDK のバージョン 3.0 をリリースしています。

ozbaの答えはある程度機能していますが、私の意見では使用しないでください

  • まず、最も重要なことは、SDK コンポーネントのサブビュー/スーパービューを反復処理することは一般的な規則であり、SDK バージョン間で階層が変更される可能性があり、追跡と修復が困難なエラーが発生する可能性があるためです。
  • 次に、ボタンをクリックすると、1 ~ 2 秒間、元のテキストに戻ります。

私の解決策は本当に簡単です。Facebook のダウンロード フォルダーFacebookSDKには、 Samplesという名前のフォルダーがあります。そこで、SessionLoginSampleを調べる必要があります。通常のRound Rect Buttonがあることがわかります。これは、それを所有する ViewController を介して、FBLoginViewDelegate を持ち、FBSessionの状態に応じてテキストを変更できます。私を信じてください、それは本当に簡単です。

于 2013-09-25T09:56:55.007 に答える
6

または、Facebook のドキュメントを読んで、独自のボタンを作成します。

https://developers.facebook.com/docs/ios/login-tutorial/#login-apicalls

このような:

- (void) buttonSelector
{
[FBSession openActiveSessionWithReadPermissions:@[@"basic_info"]
                                       allowLoginUI:YES
                                  completionHandler:
     ^(FBSession *session, FBSessionState state, NSError *error) {

         if (FBSession.activeSession.state == FBSessionStateOpen) {

             //To get the use
             [[FBRequest requestForMe] startWithCompletionHandler:^(FBRequestConnection *connection,NSDictionary<FBGraphUser> *user, NSError *error) {
                 NSString *token = [[[FBSession activeSession] accessTokenData] accessToken];


             }];

         }
     }];

}
于 2014-04-08T23:56:57.180 に答える
3

すべてのログイン機能を含む完全にカスタマイズされたボタンをゼロから作成することなく、たとえば FBSDKLoginButton のテキストをカスタマイズするはるかに簡単な方法を見つけたと思います。FBSDKLoginButton がすべての作業を行うため、これは便利です。テキストを変更するだけで済みます。申し訳ありませんが、私はSwiftしか知りません...コードは次のとおりです。

var fbButton = FBSDKLoginButton()
var titleText = NSAttributedString(string: "Your new button title")
fbButton.setAttributedTitle(titleText, forState: UIControlState.Normal)

楽しみ!

于 2015-12-10T03:41:43.777 に答える
3

他のプロジェクトでリサイクルする必要がある場合に備えて、カスタム FB ボタン クラスを作成しています。これはまだ最初のバージョンですが、ログの状態に応じてボタン イメージを変更し、サイズを簡単に管理できます。

一部のメソッドは、念のためのものです。

注意として、クラスを FBCustomLoginView とそのデリゲートに設定することにより、NIB ファイルからボタン ビューを配置することもできますが、設定したサイズは常に FBLoginView のデフォルト サイズにリセットされるため、常にコードで特定のサイズを設定する必要があります。(これを回避するために NSCoder からフレームのサイズを取得する方法がわかりません)

コードは現状のままです。編集することができ、バグがあれば責任を負います。見つけ次第、この回答を編集します。誰かに役立つことを願っています。

NIB から追加する場合は、必要なテキストと画像を適用するだけで、残りは FBLoginView であるかのように機能します。

    _facebookLoginButton.label.text = nil;
    [_facebookLoginButton setLoggedImage:  [UIImage imageNamed: @"ic_link_fb_on.png"] notLoggedImage:  [UIImage imageNamed: @"ic_link_fb_off.png"]];
    [_facebookLoginButton wrapButtonToSizeWidth: IS_IPAD ? 38 : 30 height: IS_IPAD ? 38 : 30 ];

FBCustomLoginView.h

#import <Foundation/Foundation.h>
#import <FacebookSDK/FacebookSDK.h>

@interface FBCustomLoginView : FBLoginView <FBLoginViewDelegate>

/** The button actual button */
@property (nonatomic, strong) UIButton* button;

/** The button label */
@property (nonatomic, strong) UILabel* label;

/** To a single button without label, set the same frame for the login button view and the actual button */
- (void)setWrappedButtonFrame:(CGRect)frame;

/** Wraps button to specified size, maintaining frame origin */
- (void)wrapButtonToSizeWidth: (CGFloat) width height: (CGFloat) height;

/** Sets a default background image for all states */
- (void) setBackgroundImage: (UIImage*) image selectedImage: (UIImage*) selectedImage highlightedImage: (UIImage*) highlightedImage disabledImage: (UIImage*) disabledImage;

/** Sets a default background image */
- (void) setBackgroundImage: (UIImage*) image;

/** Resizes the background image to specified size */
- (void) setBackgroundImageSizeWidth: (CGFloat) width height: (CGFloat) height;

/** Place images to manage and differentiate between logged in and out states */
- (void) setLoggedImage: (UIImage*) loggedImage notLoggedImage: (UIImage*) notLoggedImage;

@end

FBCustomLoginView.m

#import "FBCustomLoginView.h"

@interface FBCustomLoginView() {
    id<FBLoginViewDelegate> _delegate;
    UIImage* _loggedImage;
    UIImage* _notLoggedImage;
}

@end

@implementation FBCustomLoginView

@synthesize button = _button;
@synthesize label = _label;

#pragma mark - View lifecycle, superclass override
- (id)init {
    if (self = [super init]) {
        [self getReferences];
    }
    return self;
}

- (id)initWithFrame:(CGRect)frame {
    if(self = [super initWithFrame: frame]) {
        [self getReferences];
    }
    return self;
}

- (id)initWithCoder:(NSCoder *)aDecoder {
    if (self = [super initWithCoder: aDecoder]) {
        [self getReferences];
    }
    return self;
}


- (void) getReferences {

    for (id obj in self.subviews) {
        if ([obj isKindOfClass:[UIButton class]]) {
            self.button = obj;
        }

        if ([obj isKindOfClass:[UILabel class]]) {
            self.label =  obj;
        }
    }

}

- (void)setDelegate:(id<FBLoginViewDelegate>)delegate {
    _delegate = delegate;
    [super setDelegate: self];
}


#pragma mark - FBLoginViewDelegate

- (void)loginViewShowingLoggedInUser:(FBLoginView *)loginView {
    if (_loggedImage) {
        [self setBackgroundImage: _loggedImage];
    }
    [_delegate loginViewShowingLoggedInUser: loginView];
}

- (void)loginViewFetchedUserInfo:(FBLoginView *)loginView
                            user:(id<FBGraphUser>)user {
    [_delegate loginViewFetchedUserInfo: loginView user: user];
}

- (void)loginViewShowingLoggedOutUser:(FBLoginView *)loginView {

    if (_notLoggedImage) {
        [self setBackgroundImage: _notLoggedImage];
    }
    [_delegate loginViewShowingLoggedOutUser: loginView];
}

- (void)loginView:(FBLoginView *)loginView handleError:(NSError *)error {
    if ([_delegate respondsToSelector: @selector(loginView:handleError:)]) {
        [_delegate performSelector: @selector(loginView:handleError:) withObject: loginView withObject: error];
    }
}


#pragma mark - Custom methods

/** To a single button without label, set the same frame for the login button view and the actual button */
- (void)setWrappedButtonFrame:(CGRect)frame {
    [super setFrame: frame];

    if (_button) {
        [self setBackgroundImageSizeWidth: frame.size.width height: frame.size.height];
    }

}

/** Wraps button to specified size, maintaining frame origin */
- (void)wrapButtonToSizeWidth: (CGFloat) width height: (CGFloat) height {
    [super setFrame: CGRectMake(self.frame.origin.x, self.frame.origin.y, width, height)];
    if (_button) {
        [self setBackgroundImageSizeWidth: width height: height];
    }
}


- (void) setBackgroundImage: (UIImage*) image selectedImage: (UIImage*) selectedImage highlightedImage: (UIImage*) highlightedImage disabledImage: (UIImage*) disabledImage {

    [_button setBackgroundImage:image forState:UIControlStateNormal];
    [_button setBackgroundImage:selectedImage forState:UIControlStateSelected];
    [_button setBackgroundImage:highlightedImage forState:UIControlStateHighlighted];
    [_button setBackgroundImage:disabledImage forState:UIControlStateDisabled];
}

- (void) setBackgroundImage: (UIImage*) image {
    [self setBackgroundImage: image selectedImage:nil highlightedImage:nil disabledImage:nil];
}

- (void) setBackgroundImageSizeWidth: (CGFloat) width height: (CGFloat) height {
    _button.frame = CGRectMake(0, 0, width, height);
}

- (void) setLoggedImage: (UIImage*) loggedImage notLoggedImage: (UIImage*) notLoggedImage {
    _loggedImage = loggedImage;
    _notLoggedImage = notLoggedImage;

    [self setBackgroundImage: notLoggedImage];
}


@end
于 2013-03-26T02:37:14.087 に答える
3

Facebook リソース バンドル en.lproj Localizable.strings のテキストを変更します ... 動作すると思います

于 2012-09-05T12:22:19.700 に答える
2

ログインを押した後のラベルを含む、すべての問題に対する答えは非常に簡単です。OZBAの答えのように、UILabel(追加: [loginLabel removeFromSuperview];)を完全に削除するだけです。

これは完全な作業コードです:

- (void)setFacebookConnectButton{
    self.loginView.readPermissions = @[@"public_profile", @"email", @"user_friends"];
    [self.loginView setDelegate:self];
    for (id obj in self.loginView.subviews)
    {
        if ([obj isKindOfClass:[UIButton class]])
        {
            UIButton * loginButton =  obj;
            UIImage *loginImage = [UIImage imageNamed:@"fb_connect"];
            [loginButton setBackgroundImage:loginImage forState:UIControlStateNormal];
            [loginButton setBackgroundImage:nil forState:UIControlStateSelected];
            [loginButton setBackgroundImage:nil forState:UIControlStateHighlighted];
            [loginButton setTitle:nil forState:UIControlStateSelected];
            [loginButton setTitle:nil forState:UIControlStateHighlighted];

            [loginButton sizeToFit];
        }
        if ([obj isKindOfClass:[UILabel class]])
        {
            UILabel * loginLabel =  obj;
            loginLabel.text = @"";
            loginLabel.textAlignment = NSTextAlignmentCenter;
            loginLabel.frame = CGRectMake(0, 0, 271, 37);
            [loginLabel removeFromSuperview];
        }
    }
}
于 2014-05-07T18:28:48.560 に答える
1

Facebook SDK の README ファイルをお読みください。Row - FacebookBundleName を info.plist に追加し、バンドルの名前を付ける必要があります。次に、この名前でプロジェクトにバンドルを追加し、「lang.lproj」という名前のフォルダーに入れます。例: en.lproj - it.lproj - fr.lproj - es.lproj.... このフォルダーにLocalizable.strings ファイルを追加すると、次のような多くのフレーズをローカライズできます。

"FBLV:LogOutButton" = "Log Out";
"FBLV:LogInButton" = "Log In";
"FBLV:LoggedInAs" = "Logged in as: %@";
"FBLV:LoggedInUsingFacebook" = "Logged in using Facebook";
"FBLV:LogOutAction" = "Log Out";
"FBLV:CancelAction" = "Cancel";

それがあなたを助けることを願っています!

于 2014-02-17T17:47:22.680 に答える
0

FB ビューを画面外に配置するか、サイズを 0x0 にします。次に、ボタンのアクションを設定して、メッセージ buttonPressed: を FB ビューに送信します。これが最も簡単な方法だと思います。

于 2014-07-17T18:17:37.400 に答える
0

私の場合、Photoshop で見栄えの良いボタンを作成し、faceBook ボタンの上に配置しました。(Apple がボタンにビューを配置するようにアドバイスしていないことは知っていますが、サブビューを反復することは私には見栄えがよくありません)。FBのような会社がそれを行う簡単な方法を提供しなかった理由を理解するのは難しい.

UIImageView *fbImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"facebookButton.png"]];
CGRect newFrame = fBButtonFrame;
newFrame.origin.x = 0; newFrame.origin.y = 0;
[fbImageView setFrame:newFrame];
[fbImageView setUserInteractionEnabled:NO];

FBLoginView *loginView = [[FBLoginView alloc] init];
[loginView setFrame:fBButtonFrame];
[loginView addSubview:fbImageView];
[self.view addSubview:loginView];
于 2014-09-13T14:14:52.963 に答える
0

https://github.com/facebook/facebook-ios-sdk/blob/master/src/UI/FBLoginView.mの 299 行目を参照すると、テキストが FBLoginView のインスタンス メソッドによって提供されていることがわかります。したがって、FBLoginView から独自のクラスを派生させ、logInText の独自の実装を提供することで、このテキストを変更できます。

@interface CustomFBLoginView : FBLoginView

@end

@implementation CustomFBLoginView

-(NSString*) logInText {
    return @"Some custom text";
}

@end

内部実装の詳細に依存するため、これは少し危険です。

于 2014-10-11T10:43:18.060 に答える
0

最新バージョン 4.X Facebook SDK 以来、

カスタムログインが簡単になりました.FBSDKLoginManager

于 2015-05-30T08:39:11.553 に答える
0

最新の Facebook Login For iOS バージョン 2.3 によると。

次のコード スニペットを使用して、任意のカスタム UIButton 経由でログインできます。

- (void)loginWithFacebook:(id) sender {
   FBSDKLoginManager *login = [[FBSDKLoginManager alloc] init];
   [login logInWithReadPermissions:@[@"public_profile",@"email"] handler:^(FBSDKLoginManagerLoginResult *result, NSError *error) {
    if (error) {
        // Process error
    } else if (result.isCancelled) {
        // Handle cancellations
    } else {
        // Login Successful here

        // Check for any particular permissions you asked
        if ([result.grantedPermissions containsObject:@"email"]) {
            // Do work
        }
     }
  }];
}

リンクは次のとおりです: https://developers.facebook.com/docs/facebook-login/ios/v2.3#login-apicalls

于 2015-07-06T10:54:36.817 に答える