Customized Facebook Login Button - After integration - ios

Question

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.

Answer 1

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
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

Answer 2

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>

Answer 3

#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)")
}
}
})
}
}
}
}
}
}

Answer 4

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.