How can I change the default design for FBSDKLoginButton iOS 8.3 / Swift 1.2?

Question

I am currently working on the App, and I need to change the default template for the Facebook button provided by the Facebook SDK. I succeeded in making the provided button transparent and sticking it on top of the designed view and it worked well (now the design is consistent and the functionality of the Facebook SDK button works well). my problem arose after I did this, because the button lost its Ui effects (it doesn’t stand out when pressed). Please, if someone can help me, I need to add a highlight effect to this designed button. Let me clarify: I UIView, created as a button, I put a transparent Facebook SDK button above it, the result of which is the form of my design and the functionality of the Facebook button at the same time, it loses: when I click on the button, the highlight effect is not highlighted.

Answer 1

I tried the following code, it gives the functionality in the correct order. However, I could not highlight the button backlight effect when I clicked on it. here is the code:

{ if (FBSDKAccessToken.currentAccessToken() != nil) { // if user logged in then handleTap func will run instead of button functionality let tap = UITapGestureRecognizer(target: self, action: "handleTap:") self.btnSignUpwithFaceBook.addGestureRecognizer(tap) } else { let loginView : FBSDKLoginButton = FBSDKLoginButton() self.view.addSubview(loginView) loginView.center = self.btnSignUpwithFaceBook.center loginView.frame.size.width = self.btnSignUpwithFaceBook.frame.width loginView.frame.size.height = self.btnSignUpwithFaceBook.frame.height loginView.frame.origin.x = self.btnSignUpwithFaceBook.frame.origin.x loginView.frame.origin.y = self.btnSignUpwithFaceBook.frame.origin.y for subView in loginView.subviews { subView.removeFromSuperview() } loginView.layer.shadowColor = UIColor.clearColor().CGColor loginView.setBackgroundImage(nil, forState: UIControlState.Normal) loginView.setBackgroundImage(nil, forState: UIControlState.Application) loginView.setBackgroundImage(nil, forState: UIControlState.allZeros) loginView.setBackgroundImage(nil, forState: UIControlState.Highlighted) loginView.setBackgroundImage(nil, forState: UIControlState.Reserved) loginView.setBackgroundImage(nil, forState: UIControlState.Selected) loginView.setImage(nil, forState: UIControlState.Normal) loginView.setImage(nil, forState: UIControlState.Application) loginView.setImage(nil, forState: UIControlState.allZeros) loginView.setImage(nil, forState: UIControlState.Highlighted) loginView.setImage(nil, forState: UIControlState.Reserved) loginView.setImage(nil, forState: UIControlState.Selected) loginView.backgroundColor = UIColor.clearColor() // just for test self.btnSignUpwithFaceBook.layer.borderWidth = 1 self.btnSignUpwithFaceBook.layer.borderColor = UIColor.whiteColor().CGColor loginView.layer.backgroundColor = UIColor.clearColor().CGColor loginView.readPermissions = ["public_profile", "email", "user_friends"] loginView.delegate = self loginView.setTranslatesAutoresizingMaskIntoConstraints(false) var constX = NSLayoutConstraint(item: loginView, attribute: NSLayoutAttribute.CenterX, relatedBy: NSLayoutRelation.Equal, toItem: self.btnSignUpwithFaceBook, attribute: NSLayoutAttribute.CenterX, multiplier: 1, constant: 0) view.addConstraint(constX) var constY = NSLayoutConstraint(item: loginView, attribute: NSLayoutAttribute.CenterY, relatedBy: NSLayoutRelation.Equal, toItem: self.btnSignUpwithFaceBook, attribute: NSLayoutAttribute.CenterY, multiplier: 1, constant: 0) view.addConstraint(constY) let views = ["loginView": loginView] var constH = NSLayoutConstraint.constraintsWithVisualFormat("H:[loginView(57)]", options: NSLayoutFormatOptions(0), metrics: nil, views: views) view.addConstraints(constH) var constW = NSLayoutConstraint.constraintsWithVisualFormat("V:[loginView(281)]", options: NSLayoutFormatOptions(0), metrics: nil, views: views) view.addConstraints(constW) } 

In fact, the main problem is that facebookLogInButton is a custom class for FBSDK, and swift does not consider it uiButton that the selection property does not appear. Thus, the goal that I am going to find you will help you find the way in which facebookLoginButton can be considered uiButton in the quick version.

Answer 2

You can use the default UIButton and use the FBSDKManager instead of using the Facebook SDK / FBSDKLoginButton to log in. You can set the highlighted state color, etc. at UIButton.

Call the fbLoginInitiate method from the IBAction of your custom FB button.

 func fbLoginInitiate() { let loginManager = FBSDKLoginManager() loginManager.logInWithReadPermissions(["public_profile", "email"], handler: {(result:FBSDKLoginManagerLoginResult!, error:NSError!) -> Void in if (error != nil) { // Process error self.removeFbData() } else if result.isCancelled { // User Cancellation self.removeFbData() } else { //Success if result.grantedPermissions.contains("email") && result.grantedPermissions.contains("public_profile") { //Do work self.fetchFacebookProfile() } else { //Handle error } } }) } func removeFbData() { //Remove FB Data let fbManager = FBSDKLoginManager() fbManager.logOut() FBSDKAccessToken.setCurrentAccessToken(nil) } func fetchFacebookProfile() { if FBSDKAccessToken.currentAccessToken() != nil { let graphRequest : FBSDKGraphRequest = FBSDKGraphRequest(graphPath: "me", parameters: nil) graphRequest.startWithCompletionHandler({ (connection, result, error) -> Void in if ((error) != nil) { //Handle error } else { //Handle Profile Photo URL String let userId = result["id"] as! String let profilePictureUrl = "https://graph.facebook.com/\(id)/picture?type=large" let accessToken = FBSDKAccessToken.currentAccessToken().tokenString let fbUser = ["accessToken": accessToken, "user": result] } }) } }