it-swarm.com.de

anpassen Android Facebook Login-Button

Ich möchte das Aussehen des Facebook-Login-Buttons anpassen, den wir zusammen mit dem Facebook-SDK für Android (facebook-Android-sdk-3.0.1) erhalten. Ich möchte ein einfaches Android Button mit dem Titel "Login via Facebook". Ich konnte dazu keine Dokumentation finden.

Wenn also jemand weiß, wie man es auf einfache Weise macht, sagen Sie mir bitte, oder weisen Sie mich an, wie es geht.

75
dora

Sie können Stile verwenden, um die Anmeldeschaltfläche wie folgt zu ändern

<style name="FacebookLoginButton">
    <item name="Android:textSize">@dimen/smallTxtSize</item>
    <item name="Android:background">@drawable/facebook_signin_btn</item>
    <item name="Android:layout_marginTop">10dp</item>
    <item name="Android:layout_marginBottom">10dp</item>
    <item name="Android:layout_gravity">center_horizontal</item>
</style>

und im layout

<com.facebook.widget.LoginButton
        xmlns:fb="http://schemas.Android.com/apk/res-auto"
        Android:id="@+id/loginFacebookButton"
        Android:layout_width="fill_parent"
        Android:layout_height="wrap_content"
        fb:login_text="@string/loginFacebookButton"
        fb:logout_text=""
        style="@style/FacebookLoginButton"/>
82
Filsh

Um einen vollständig benutzerdefinierten Facebook-Login-Button ohne Verwendung von com.facebook.widget.LoginButton Zu haben.

Laut Facebook SDK 4.x,

Es gibt ein neues Konzept der Anmeldung von Facebook

LoginManager und AccessToken - Diese neuen Klassen führen eine Facebook-Anmeldung durch

So, jetzt können Sie auf die Facebook-Authentifizierung ohne Facebook-Login-Button zugreifen

layout.xml

    <Button
            Android:id="@+id/btn_fb_login"
            .../>

MainActivity.Java

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        FacebookSdk.sdkInitialize(this.getApplicationContext());

        callbackManager = CallbackManager.Factory.create();

        LoginManager.getInstance().registerCallback(callbackManager,
                new FacebookCallback<LoginResult>() {
                    @Override
                    public void onSuccess(LoginResult loginResult) {
                        Log.d("Success", "Login");

                    }

                    @Override
                    public void onCancel() {
                        Toast.makeText(MainActivity.this, "Login Cancel", Toast.LENGTH_LONG).show();
                    }

                    @Override
                    public void onError(FacebookException exception) {
                        Toast.makeText(MainActivity.this, exception.getMessage(), Toast.LENGTH_LONG).show();
                    }
                });

        setContentView(R.layout.activity_main);

        Button btn_fb_login = (Button)findViewById(R.id.btn_fb_login);

        btn_fb_login.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                  LoginManager.getInstance().logInWithReadPermissions(MainActivity.this, Arrays.asList("public_profile", "user_friends"));
            }
        });

    }

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

    callbackManager.onActivityResult(requestCode, resultCode, data); 
}
155
TejaDroid

Wenn Sie die Schaltfläche vollständig anpassen möchten, erstellen Sie am besten eine Schaltfläche oder eine beliebige Ansicht (in meinem Fall eine LinearLayout) und legen Sie eine OnClickListener zu dieser Ansicht, und rufen Sie im onClick-Ereignis Folgendes auf:

com.facebook.login.widget.LoginButton btn = new LoginButton(this);
btn.performClick();
34
Andranik

Sie können die Anmeldeschaltfläche wie folgt ändern

<com.facebook.widget.LoginButton
            xmlns:fb="http://schemas.Android.com/apk/res-auto"
            Android:id="@+id/login_button"
            Android:layout_width="249dp"
            Android:layout_height="45dp"
            Android:layout_above="@+id/textView1"
            Android:layout_centerHorizontal="true"
            Android:layout_gravity="center_horizontal"
            Android:layout_marginBottom="30dp"
            Android:layout_marginTop="30dp"
            Android:contentDescription="@string/login_desc"
            Android:scaleType="centerInside"
            fb:login_text=""
            fb:logout_text="" />

Und im Code habe ich die Hintergrundressource definiert:

final LoginButton button = (LoginButton) findViewById(R.id.login_button);
button.setBackgroundResource(R.drawable.facebook);
16
RINK
  1. Fügen Sie Ihrem Fake-Button einen Listener hinzu und simulieren Sie das Klicken:

    <LinearLayout
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:orientation="vertical">
    
        <Button
                Android:id="@+id/facebookView"
                Android:layout_width="300dp"
                Android:layout_height="48dp"
                Android:layout_gravity="center_horizontal"
                Android:layout_marginBottom="12dp"
                Android:background="@drawable/btn_frame"
                Android:gravity="center"
                Android:text="@string/Sign_in_facebook_button"
                Android:textColor="@color/colorAccent" />
    
        <com.facebook.login.widget.LoginButton
                Android:id="@+id/facebookButton"
                Android:layout_width="match_parent"
                Android:layout_height="match_parent"
                Android:visibility="invisible"
                Android:layout_marginBottom="12dp" />
    
     </LinearLayout>
    
  2. Add listener to your fake button and simulate click:

    facebookView.setOnClickListener(this);
    @Override
    public void onClick(View v) {
        if (v.getId() == R.id.facebookView){
           facebookButton.performClick();
        }
    }
    
11
Denis Fedak

In neuerem Facebook SDK lautet der Name des Anmelde- und Abmeldetexts:

 <com.facebook.login.widget.LoginButton
 xmlns:facebook="http://schemas.Android.com/apk/res-auto"
 facebook:com_facebook_login_text=""
 facebook:com_facebook_logout_text=""/>
9
Parth mehta
//call Facebook onclick on your customized button on click by the following

FacebookSdk.sdkInitialize(this.getApplicationContext());

        callbackManager = CallbackManager.Factory.create();

        LoginManager.getInstance().registerCallback(callbackManager,
                new FacebookCallback<LoginResult>() {
                    @Override
                    public void onSuccess(LoginResult loginResult) {
                        Log.d("Success", "Login");

                    }

                    @Override
                    public void onCancel() {
                        Toast.makeText(MainActivity.this, "Login Cancel", Toast.LENGTH_LONG).show();
                    }

                    @Override
                    public void onError(FacebookException exception) {
                        Toast.makeText(MainActivity.this, exception.getMessage(), Toast.LENGTH_LONG).show();
                    }
                });

        setContentView(R.layout.activity_main);

        Button mycustomizeedbutton=(Button)findViewById(R.id.mycustomizeedbutton);

        mycustomizeedbutton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                  LoginManager.getInstance().logInWithReadPermissions(this, Arrays.asList("public_profile", "user_friends"));
            }
        });

    }
5
atish naik
 <com.facebook.widget.LoginButton
            Android:id="@+id/login_button"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_marginTop="5dp"
            facebook:confirm_logout="false"
            facebook:fetch_user_info="true"
            Android:text="testing 123"
            facebook:login_text=""
            facebook:logout_text=""
            />

Das hat bei mir funktioniert. So ändern Sie den Text der Facebook-Anmeldeschaltfläche.

2
Tanka

Anpassen com.facebook.widget.LoginButton

Schritt: 1 Erstellen eines Framelayouts.

Schritt: 2 Einstellen von com.facebook.widget.LoginButton

Schritt: 3 Zum Einstellen von Textansicht mit anpassbar.

<FrameLayout
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    >
    <com.facebook.widget.LoginButton
        Android:id="@+id/fbLogin"
        Android:layout_width="match_parent"
        Android:layout_height="50dp"
        Android:contentDescription="@string/app_name"
        facebook:confirm_logout="false"
        facebook:fetch_user_info="true"
        facebook:login_text=""
        facebook:logout_text="" />

    <TextView
        Android:id="@+id/tv_radio_setting_login"
        Android:layout_width="match_parent"
        Android:layout_height="50dp"
        Android:layout_centerHorizontal="true"
        Android:background="@drawable/drawable_radio_setting_loginbtn"
        Android:gravity="center"
        Android:padding="10dp"
        Android:textColor="@Android:color/white"
        Android:textSize="18sp" />
</FrameLayout>

MUSS ERINNERN

1> com.facebook.widget.LoginButton & TextView Höhe/Breite gleich

2> 1. deklarieren com.facebook.widget.LoginButton dann TextView

3> Anmelden/Abmelden mit Click-Listener von TextView

1
Dhruv Raval

Es ist ein Trick, keine richtige Methode.

  • Erstellen Sie ein relatives Layout.
  • Definieren Sie Ihre facebook_botton.
  • Definieren Sie auch Ihre benutzerdefinierte Design-Schaltfläche.
  • Überlappen Sie sie.
<RelativeLayout Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_gravity="center_horizontal"
    Android:layout_marginTop="30dp">
    <com.facebook.login.widget.LoginButton
    xmlns:facebook="http://schemas.Android.com/apk/res-auto"
    Android:id="@+id/login_button"
    Android:layout_width="300dp"
    Android:layout_height="100dp"
    Android:paddingTop="15dp"
    Android:paddingBottom="15dp" />
    <LinearLayout
    Android:id="@+id/llfbSignup"
    Android:layout_width="300dp"
    Android:layout_height="50dp"
    Android:background="@drawable/facebook"
    Android:layout_gravity="center_horizontal"
    Android:orientation="horizontal">
    <ImageView
    Android:layout_width="30dp"
    Android:layout_height="30dp"
    Android:src="@drawable/facbk"
    Android:layout_gravity="center_vertical"
    Android:layout_marginLeft="10dp" />
    <View
    Android:layout_width="1dp"
    Android:layout_height="match_parent"
    Android:background="@color/fullGray"
    Android:layout_marginLeft="10dp"/>
    <com.yadav.bookedup.fonts.GoutamBold
    Android:layout_width="240dp"
    Android:layout_height="50dp"
    Android:text="Sign Up via Facebook"
    Android:gravity="center"
    Android:textColor="@color/white"
    Android:textSize="18dp"
    Android:layout_gravity="center_vertical"
    Android:layout_marginLeft="10dp"/>
    </LinearLayout>
</RelativeLayout>
1
AMIT YADAV

Das ist sehr einfach. Fügen Sie eine Schaltfläche in die Layoutdatei wie folgt ein

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

Und an der onClick-Stelle die registercallback () -Methode des LoginManager, wenn diese Methode automatisch ausgeführt wird.

  public void fbLogin(View view)
{
    LoginManager.getInstance().logInWithReadPermissions(this, Arrays.asList("user_photos", "email", "public_profile", "user_posts" , "AccessToken"));
    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
                }
            });
}
1
Harpreet Singh

Richtiger und sauberster Weg

Nachdem Sie die folgenden Antworten überprüft haben, scheint es sich um Hacks zu handeln, bei denen die Ansicht der Anmeldeschaltfläche bearbeitet werden muss, um sie an Ihre Bedürfnisse anzupassen.

Demo image

In der gleichen Position ist es mir gelungen, den Facebook-Login-Button effizient anzupassen.

<mehdi.sakout.fancybuttons.FancyButton
   Android:id="@+id/facebook_login"
   Android:layout_width="wrap_content"
   Android:layout_height="45dp"
   Android:paddingLeft="10dp"
   Android:paddingRight="10dp"
   app:fb_radius="2dp"
   app:fb_iconPosition="left"
   app:fb_fontIconSize="20sp"
   app:fb_iconPaddingRight="10dp"
   app:fb_textSize="16sp"
   app:fb_text="Facebook Connect"
   app:fb_textColor="#ffffff"
   app:fb_defaultColor="#39579B"
   app:fb_focusColor="#6183d2"
   app:fb_fontIconResource="&#xf230;"
   Android:layout_centerVertical="true"
   Android:layout_centerHorizontal="true" />

und implementieren Sie den onClickListener wie folgt

FacebookLogin.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View view) {
      if (AccessToken.getCurrentAccessToken() != null){
         mLoginManager.logOut();
      } else {
         mAccessTokenTracker.startTracking();
         mLoginManager.logInWithReadPermissions(MainActivity.this,              Arrays.asList("public_profile"));
      }
   }
});

Den gesamten Quellcode finden Sie unter: http://medyo.github.io/customize-the-Android-facebook-login-on-Android

0
Mehdi