Clash Royale CLAN TAG#URR8PPP

Customized Facebook Login Button - After integration

I am trying to customize the Facebook login button after following this guide. Everything is integrated correctly, I can login to Facebook, and logout without a hitch.

Now my next goal is to make the screen look like my mock up, this includes placing the login button correctly on the storyboard, but the only issue is that it doesn't show up on the story board, it just appears when I run the simulation. I looked at other overflow answers, but they weren't really helpful as they were geared towards earlier versions of swift / Xcode, and didn't work from what the comments said. My code is exactly the same as the guide, as this is the first screen that I am trying to implement.

Help would be much appreciated.

my mock up

4 Answers
4

If you want to use the custom facebook SDK button you can create any custom button in the storyboard and provide action in the viewcontroller like this

Import at top

import FBSDKCoreKit
import FBSDKLoginKit


Swift 3:

@IBAction func loginFacebookAction(sender: AnyObject) //action of the custom button in the storyboard
let fbLoginManager : FBSDKLoginManager = FBSDKLoginManager()
fbLoginManager.logIn(withReadPermissions: ["email"], from: self) (result, error) -> Void in
if (error == nil)
let fbloginresult : FBSDKLoginManagerLoginResult = result!
// if user cancel the login
if (result?.isCancelled)!
return

if(fbloginresult.grantedPermissions.contains("email"))

self.getFBUserData()





func getFBUserData()
if((FBSDKAccessToken.current()) != nil)
FBSDKGraphRequest(graphPath: "me", parameters: ["fields": "id, name, first_name, last_name, picture.type(large), email"]).start(completionHandler: (connection, result, error) -> Void in
if (error == nil)
//everything works print the user data
print(result)

)




Older Swift version:

@IBAction func loginFacebookAction(sender: AnyObject) //action of the custom button in the storyboard
let fbLoginManager : FBSDKLoginManager = FBSDKLoginManager()
fbLoginManager.logInWithReadPermissions(["email"], fromViewController: self) (result, error) -> Void in
if (error == nil)
let fbloginresult : FBSDKLoginManagerLoginResult = result
if(fbloginresult.grantedPermissions.contains("email"))

self.getFBUserData()





func getFBUserData()
if((FBSDKAccessToken.currentAccessToken()) != nil)
FBSDKGraphRequest(graphPath: "me", parameters: ["fields": "id, name, first_name, last_name, picture.type(large), email"]).startWithCompletionHandler( (connection, result, error) -> Void in
if (error == nil)
//everything works print the user data
print(result)

)




If you want default facebook login button you can take UIView and set Class* field of the Custom Class** section in the Identity Inspector, we must set the FBLoginValue

FBLoginValue

Ref: Default SDK login button tutorial:http://www.appcoda.com/ios-programming-facebook-login-sdk/

Ref: Custom SDK login button for parameters and more info:https://developers.facebook.com/docs/facebook-login/ios

POD INSTALL

source 'https://github.com/CocoaPods/Specs.git'
use_frameworks!
target “ProjectName” do
pod 'FacebookCore'
pod 'FacebookLogin'
pod 'FacebookShare'
end


AppDelegate.swift

import FacebookLogin
import FBSDKLoginKit
import FacebookCore

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool

FBSDKApplicationDelegate.sharedInstance().application(application, didFinishLaunchingWithOptions: launchOptions)
return true


func application(_ application: UIApplication, open url: URL, sourceApplication: String?, annotation: Any) -> Bool
return FBSDKApplicationDelegate.sharedInstance().application(application, open: url, sourceApplication: sourceApplication, annotation: annotation)



ViewController.swift

import UIKit
import FacebookLogin
import FBSDKLoginKit
import FacebookCore

class ViewController: UIViewController

override func viewDidLoad()
if(FBSDKAccessToken.current() == nil)
print("Not logged in ")
else
print("Logged in already")
getFacebookUserInfo()



@IBAction func CustomButton_Click(_ sender: Any)
getFacebookUserInfo()


func getFacebookUserInfo()
let loginManager = LoginManager()
loginManager.logIn([.publicProfile, .email ], viewController: self) (result) in
switch result
case .cancelled:
print("Cancel button click")
case .success:
let params = ["fields" : "id, name, first_name, last_name, picture.type(large), email "]
let graphRequest = FBSDKGraphRequest.init(graphPath: "/me", parameters: params)
let Connection = FBSDKGraphRequestConnection()
Connection.add(graphRequest) (Connection, result, error) in
let info = result as! [String : AnyObject]
print(info["name"] as! String)

Connection.start()
default:
print("??")






Info.plist

Info.plist --> right click ->OpenAs -->Source Code --> add < dict > .. < /dict >

<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>YOUR APP ID</string>
</array>
</dict>
</array>
<key>FacebookAppID</key>
<string>YOUR APP ID</string>
<key>FacebookDisplayName</key>
<string>YOUR APP NAME</string>


Welcome to StackOverflow, Shika! That tutorial shows you how to add the button that Facebook provides as part of their SDK. The tutorial tells you centers the button in the center of the device's screen. Facebook allows you to create your own button, if you'd like to. In my opinion, I like it better, because you can play with it in the storyboard, unlike the button created programmatically in Swift. You can use the Facebook docs here and scroll down to "Custom Login Button". Your code will change, but not by much! If you choose to go this route, make sure to delete the code you copied and pasted to add the button located in viewDidLoad. Also, you can delete the FBSDKLoginButtonDelegate you added at the top of the Swift file.

@IBAction func buttonLogin(_ sender: Any)

let fbLoginManager : FBSDKLoginManager = FBSDKLoginManager()

fbLoginManager.logIn(withReadPermissions: ["public_profile","email"], from: self) (result, error) in

if (error == nil)
let fbloginresult : FBSDKLoginManagerLoginResult = result!
if fbloginresult.grantedPermissions != nil
if(fbloginresult.grantedPermissions.contains("email"))
if((FBSDKAccessToken.current()) != nil)
FBSDKGraphRequest(graphPath: "me", parameters: ["fields": "id, name, first_name, last_name, picture.type(large), email"]).start(completionHandler: (connection, result, error) -> Void in
if (error == nil)
let dict: NSDictionary = result as! NSDictionary
if let token = FBSDKAccessToken.current().tokenString
print("tocken: (token)")

let userDefult = UserDefaults.standard
userDefult.setValue(token, forKey: "access_tocken")
userDefult.synchronize()

if let user : NSString = dict.object(forKey:"name") as! NSString?
print("user: (user)")

if let id : NSString = dict.object(forKey:"id") as? NSString
print("id: (id)")

if let email : NSString = (result! as AnyObject).value(forKey: "email") as? NSString
print("email: (email)")


)








By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.