web-dev-qa-db-ja.com

カスタムFacebookログインボタン-Android

私はこれに続いています チュートリアル しかし、これは一年ほど前のものですが、私はそれを機能させることができません...

AndroidStudo 1.2.2およびFacebookSDK 4を使用しています。

次の画像に示すようなカスタムボタンを使用して、facebookに簡単にログインする必要があります。

Example

さて、チュートリアルの例では、Session変数に問題がありますが、それは解決できず、getActivity()

誰もFacebookSDK4.0でこれを試しましたか?

それは正しいアプローチですか、それとももっと更新されたものがありますか?

前もって感謝します!

46
NeoVe

ステップ1:最初にFrameLayoutを追加し、facebookボタンvisibility = "gone"を作成して、カスタムボタンを追加します。メインレイアウトにxmlns:facebook="http://schemas.Android.com/apk/res-auto"を配置することを忘れないでください。

<FrameLayout
        Android:id="@+id/FrameLayout1"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content" >

        <com.facebook.login.widget.LoginButton
            Android:id="@+id/login_button"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:visibility="gone" />

        <Button
            Android:id="@+id/fb"
            Android:layout_width="fill_parent"
            Android:layout_height="wrap_content"
            Android:background="#416BC1"
            Android:onClick="onClick"
            Android:text="FaceBook"
            Android:textColor="#ffffff"
            Android:textStyle="bold" />
    </FrameLayout>

ステップ2:レイアウトを変更する前に、FacebookSdkonCreateを初期化します。

FacebookSdk.sdkInitialize(this.getApplicationContext());

ステップ3:これをJavaファイルに追加します。

callbackManager = CallbackManager.Factory.create();

fb = (Button) findViewById(R.id.fb);
loginButton = (LoginButton) findViewById(R.id.login_button);

List < String > permissionNeeds = Arrays.asList("user_photos", "email",
    "user_birthday", "public_profile", "AccessToken");
loginButton.registerCallback(callbackManager,
new FacebookCallback < LoginResult > () {@Override
    public void onSuccess(LoginResult loginResult) {

        System.out.println("onSuccess");

        String accessToken = loginResult.getAccessToken()
            .getToken();
        Log.i("accessToken", accessToken);

        GraphRequest request = GraphRequest.newMeRequest(
        loginResult.getAccessToken(),
        new GraphRequest.GraphJSONObjectCallback() {@Override
            public void onCompleted(JSONObject object,
            GraphResponse response) {

                Log.i("LoginActivity",
                response.toString());
                try {
                    id = object.getString("id");
                    try {
                        URL profile_pic = new URL(
                            "http://graph.facebook.com/" + id + "/picture?type=large");
                        Log.i("profile_pic",
                        profile_pic + "");

                    } catch (MalformedURLException e) {
                        e.printStackTrace();
                    }
                    name = object.getString("name");
                    email = object.getString("email");
                    gender = object.getString("gender");
                    birthday = object.getString("birthday");
                } catch (JSONException e) {
                    e.printStackTrace();
                }
            }
        });
        Bundle parameters = new Bundle();
        parameters.putString("fields",
            "id,name,email,gender, birthday");
        request.setParameters(parameters);
        request.executeAsync();
    }

    @Override
    public void onCancel() {
        System.out.println("onCancel");
    }

    @Override
    public void onError(FacebookException exception) {
        System.out.println("onError");
        Log.v("LoginActivity", exception.getCause().toString());
    }
});

ステップ4:次のコードを追加することを忘れないでください。

@Override
protected void onActivityResult(int requestCode, int responseCode,
Intent data) {
    super.onActivityResult(requestCode, responseCode, data);
    callbackManager.onActivityResult(requestCode, responseCode, data);
}

ステップ5:カスタムボタンクリックをFacebookLoginボタンクリックに設定します。

public void onClick(View v) {
    if (v == fb) {
        loginButton.performClick();
    }
 }

ステップ6:プログラムでログアウトするには、これを使用します。

LoginManager.getInstance()。logOut();

ステップ7:ログインしているユーザーをプロファイルで検索できます。

profile = Profile.getCurrentProfile().getCurrentProfile();
if (profile != null) {
    // user has logged in
} else {
    // user has not logged in
}
154
Harvi Sirja

IMO選択された回答の一部は一種です回避策適切な解決策ではありません。したがって、適切にするために変更する必要があるのは次のとおりです。

  1. XMLから「com.facebook.login.widget.LoginButton」を取り除きます

    <com.facebook.login.widget.LoginButton
            Android:id="@+id/login_button"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:visibility="gone" />
    
  2. Javaコード内の "LoginButton"へのすべての参照を取り除きます

  3. 次のようにその目的のためにあるFacebookの「LoginManager」クラスを使用します:

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // Some code
        callbackManager = CallbackManager.Factory.create();
        LoginManager.getInstance().registerCallback(
            callbackManager,
            new FacebookCallback < LoginResult > () {
                @Override
                public void onSuccess(LoginResult loginResult) {
                    // Handle success
                }
    
                @Override
                public void onCancel() {
                }
    
                @Override
                public void onError(FacebookException exception) {
                } 
           }
       );
    }
    
    public void onClick(View v) {
       if (v == fb) {
           LoginManager.getInstance().logInWithReadPermissions(
               this,
               Arrays.asList("user_photos", "email", "user_birthday", "public_profile")
           );
       }
    }
    
    // this part was missing thanks to wesely
    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        callbackManager.onActivityResult(requestCode, resultCode, data);
    }
    
80
Shehabic

これは非常に簡単です。レイアウトファイルにボタンを追加します

<Button
    Android:layout_width="200dp"
    Android:layout_height="wrap_content"
    Android:text="Login with facebook"
    Android:textColor="#ffff"
    Android:layout_gravity="center"
    Android:textStyle="bold"
    Android:onClick="fbLogin"
    Android:background="@color/colorPrimary"/>

また、onClickにLoginManagerのregistercallback()メソッドを配置します。このメソッドは自動的に実行されるためです。

好む:

  public void fbLogin(View view)
{
    // Before Edit:
    // LoginManager.getInstance().logInWithReadPermissions(this, Arrays.asList("user_photos", "email", "public_profile", "user_posts" , "AccessToken"));

    LoginManager.getInstance().logInWithReadPermissions(this, Arrays.asList("user_photos", "email", "public_profile", "user_posts"));
    LoginManager.getInstance().logInWithPublishPermissions(this, Arrays.asList("publish_actions"));
    LoginManager.getInstance().registerCallback(callbackManager,
            new FacebookCallback<LoginResult>()
            {
                @Override
                public void onSuccess(LoginResult loginResult)
                {
                    // App code
                }

                @Override
                public void onCancel()
                {
                    // App code
                }

                @Override
                public void onError(FacebookException exception)
                {
                    // App code
                }
            });
}

楽しんで

14
Harpreet Singh

(コメントを追加するほどの評判はありません...)

@Shehabixの答えを試しましたが、これを追加するまでコールバックを受信できません

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);
    callbackManager.onActivityResult(requestCode, resultCode, data);
}

その後、正常に動作します。

10
Wesely

簡単な答えは、cutomBtn.setOnClickListenerの中にfacebookButton.performClick()を追加することです

    <!-- connect with Facebook -->
    <RelativeLayout
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content">

        <com.facebook.login.widget.LoginButton
            Android:id="@+id/fb_connect"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:layout_alignParentBottom="true"
            Android:textSize="@dimen/login_fb_font_size"
            Android:visibility="invisible" />

        <LinearLayout
            Android:id="@+id/mfb_connect"
            style="@style/facebook_button">

            <ImageView
                style="@style/login_connect_icon"
                Android:src="@drawable/ic_facebook" />

            <TextView
                style="@style/login_connect_text"
                Android:text="@string/login_connect_facebook" />
        </LinearLayout>
    </RelativeLayout>

...

private LoginButton fb_connect;
private LinearLayout mfb_connect;

...

    // the button from facebook sdk
    fb_connect = (LoginButton) findViewById(R.id.fb_connect);
    // handle the click from my custom button to perfrom action click on facebook sdk button
    mfb_connect = (LinearLayout) findViewById(R.id.mfb_connect);
    mfb_connect.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            fb_connect.performClick();
        }
    });

これはこれを達成します:

enter image description here

7

HarviとShehabixによる回答を補完するものとして、Firebase Authで認証を登録するときにこのメソッドを追加することをお勧めします。

このメソッドは、LoginManagerの "On Success"内で呼び出す必要があります。

private void handleFacebookAccessToken(AccessToken token) {

    AuthCredential credential = FacebookAuthProvider.getCredential(token.getToken());
    mAuth.signInWithCredential(credential)
            .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() {
                @Override
                public void onComplete(@NonNull Task<AuthResult> task) {
                    if (task.isSuccessful()) {

                        //Toast.makeText(MainActivity.this, "Autenticando",Toast.LENGTH_SHORT).show();

                    } else {
                        // If sign in fails, display a message to the user.
                        Toast.makeText(MainActivity.this, "Authentication failed.",
                                Toast.LENGTH_SHORT).show();
                        //updateUI(null);
                    }

                }
            });
}
1
Thiago Silva