Willy's Fish教學筆記』

上一篇文章我們已經把設定都做好了
現在來要說說看怎麼實作在我們的 App 之中

點我複習：
Willy's Fish教學筆記』Android 如何讓自己的 App 整合 Facebook Sign In SDK，實作 login 功能教學 (設定篇)

UI的按鈕方面
可以選擇用官方預設好的按鈕
如果要使用官方的按鈕的話
把這段 code 貼到我們想要的位置上

<com.facebook.login.widget.LoginButton
    android:id="@+id/login_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="30dp"
    android:layout_marginBottom="30dp" />

按鈕會長這樣

不過在這裡我要用自訂的按鈕
所以 UI 方面就不解說了
直接到動作監聽的部份
我先將 code 貼上再來一一講解

//宣告callback Manager
callbackManager = CallbackManager.Factory.create();

ImageButton fbLoginBtn = (ImageButton) view.findViewById(~~~);
fbLoginBtn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        LoginManager.getInstance()
                    .logInWithReadPermissions(fragment, 
                     Arrays.asList("public_profile", 
                                   "user_friends",
                                   "email"));
    }
});

//幫 LoginManager 增加callback function
LoginManager.getInstance()
            .registerCallback(callbackManager,
             new FacebookCallback<LoginResult>() {
    //登入成功
    @Override
    public void onSuccess(LoginResult loginResult) {

        //send request and call graph api
        GraphRequest request = GraphRequest.newMeRequest(
                loginResult.getAccessToken(),
                new GraphRequest.GraphJSONObjectCallback() {

                    //當RESPONSE回來的時候
                    @Override
                    public void onCompleted(JSONObject object
                                   , GraphResponse response) {
                        Logger.json(object.toString());
                        // 取得資料後我們想做的事
                    }
                });

        //包入你想要得到的資料 送出request
        Bundle parameters = new Bundle();
        parameters.putString("fields", "id,name,link,email");
        request.setParameters(parameters);
        request.executeAsync();
    }

    //登入取消
    @Override
    public void onCancel() {
        Logger.e("FB CANCEL");
    }

    //登入失敗
    @Override
    public void onError(FacebookException exception) {
        Logger.e("FB " + exception.toString());
    }
});

首先，我們要得到 CallbackManager 
再來設定按鈕的 ClickListener

在使用者按下按鈕的時候，我們只做了一件事
就是 請求登入 與 提醒使用者我們將取得資料

"public_profile", "user_friends", "email"

Array 中的這三項為參數分別代表
公開的個人資料
好友名單
Email

接下來我們就要來處理登入後的 Callback 了
在 取消登入 與 登入失敗 時，我們只印了 Log 方便測試
主要在登入成功時，我們會送出一個 request
這個 GraphRequest 可以夾帶 Bundle 後再執行送出

//包入你想要得到的資料 送出request
Bundle parameters = new Bundle();
parameters.putString("fields", "id,name,link,email");
request.setParameters(parameters);
request.executeAsync();

我們要求得到
Facebook ID & 名字 & 大頭照連結 & Email
四項資料

送出之後會在 GraphRequest 的 Callback 中得到 JSON 資料

@Override
public void onCompleted(JSONObject object, GraphResponse response) {
    Logger.json(object.toString());
    // 取得資料後我們想做的事
}

整個 Facebook 登入就到此結束了
之後就看我們要拿資料做什麼囉~


P.S.
我們的做法會使 Facebook SDK 直接用 WebView 來執行登入
但這樣會使 User 重覆的輸入帳密
點我看如何使用 Chrome Browser 瀏覽器來執行？以達到免輸入帳密的功能









資料來源：
https://developers.facebook.com/docs/facebook-login/android
https://developers.facebook.com/quickstarts/?platform=android