налаштувати кнопку входу на Facebook для Android


79

Я хочу налаштувати зовнішній вигляд кнопки входу в Facebook, яку ми отримуємо разом із Facebook sdk для android (facebook-android-sdk-3.0.1). Я хочу просту кнопку для Android, яка має назву "Увійти через Facebook". Я не міг знайти жодної документації щодо цього.

Тож якщо хтось знає, як це зробити простим способом, будь ласка, скажіть мені або скеруйте мене, як це зробити.


1
Я ніколи не використовував facebook sdk ... але якщо це файл зображень, асоційований з кнопкою входу, ви можете просто змінити це ... якщо не повністю ігнорувати мій коментар
brendosthoughts

це просто не кнопка, пов'язана з файлом зображення. у нього є багато функціональних можливостей, пов'язаних з ним, наприклад: він змінює текст на основі того, чи ввійшов користувач чи ні
Дора

Відповіді:


83

Ви можете використовувати стилі для зміни кнопки входу, як це

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

і в макеті

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

Привіт @Filsh, чи є якась офіційна документація щодо цих властивостей? Я не знайшов.
Хорхе Е. Ернандес,

16
Це вже не працює. Gradle зупиняється з помилкою при будівництві. Використовуйте LoginManager та стандартну кнопку.
Кассіо Лендім,

Цей ідеальний. Чудово
VVB

168

Для того, щоб мати повністю власну кнопку входу в Facebook без використання com.facebook.widget.LoginButton.

Відповідно до facebook sdk 4.x,

Існує нова концепція входу як з facebook

LoginManager та AccessToken - Ці нові класи виконують вхід на Facebook

Отже, тепер ви можете отримати доступ до автентифікації Facebook без кнопки входу в Facebook як

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); 
}

6
Помилка: logInWithReadPermissions (this, Arrays.asList ("public_profile", "user_friends")); Не вдається вирішити символ
Shaktisinh Jadeja

1
TejaDroid приємна відповідь, їм слід додати onActivityResult, щоб дати найкращу відповідь. :)
Іларіо

1
Працюйте як шарм +1
Arpit Patel

3
@ShaktisinhJadeja це стосується контексту OnClickListener. logInWithReadPermissions потребує дії або фрагмента як першого параметра. Тож поставте замість YourActivityName.this або YourFragmentName.this.
crubio

1
Ця відповідь працює нормально. Чи може хтось сказати мені після входу, як вийти з facebook в додатку для Android?
BABU K

36

Найкращий спосіб, який я знайшов, щоб зробити це, якщо ви хочете повністю налаштувати кнопку, - це створити кнопку або будь-який вигляд, який ви хочете (у моєму випадку це було a LinearLayout), і встановити OnClickListenerдля цього подання та викликати наступне в Подія onClick:

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

2
Це працює. Але непотрібне. Немає необхідності використовувати кнопку входу в Facebook і підробляти її клік. Замість цього використовуйте LoginManager.
Vitor Hugo Schwaab

1
Vitor має рацію, набагато простіше налаштувати власну кнопку та використовувати менеджер входу
Джонатан Данн,

16

Ви можете змінити кнопку входу таким чином

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

І в коді я визначив фоновий ресурс:

final LoginButton button = (LoginButton) findViewById(R.id.login_button);
button.setBackgroundResource(R.drawable.facebook);

1
Привіт @RINK, помилка fb:login_textand і fb:logout_textвидає помилку при спробі запустити. Тут помилка: Error parsing XML: unbound prefix. Ви впевнені, що це правильний синтаксис?
toobsco42

1
Очевидно, пізно, але @ toobsco42 - переконайтеся, що у вас визначено xmlns: fb (до schemas.android.com/apk/res-auto ), або в кнопці, як показано тут, або у верхньому рівні вашого файлу макета.
Ерік Брінсвольд,

3
facebook SDK 3.0 або вище його facebook: login_text = "" facebook: logout_text = ""
Dhaval Parmar

1
@RINK напишіть це, тоді ви не отримаєте цієї помилки xmlns: fb = " schemas.android.com/apk/res-auto "
Yawar

Button.setCompoundDrawablesWithIntrinsicBounds (0,0,0,0); , напишіть це теж посилання
Yawar

15
  1. Створіть власну кнопку facebook та змініть видимість на нативній кнопці facebook:

    <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. Додайте слухача до своєї фальшивої кнопки та імітуйте клацання:

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

Це найкраще. Одна правдива відповідь.
paakjis

9

У новішій версії Facebook SDK ім'я тексту входу та виходу:

 <com.facebook.login.widget.LoginButton
 xmlns:facebook="http://schemas.android.com/apk/res-auto"
 facebook:com_facebook_login_text=""
 facebook:com_facebook_logout_text=""/>

1
Це працює, як ти це зрозумів? копатися в коді SDK?
Хасан Тарек,

5
//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"));
            }
        });

    }

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

Це спрацювало для мене. Щоб змінити текст кнопки входу на facebook.


1

Налаштуйте com.facebook.widget.LoginButton

Крок: 1 Створення Framelayout.

крок: 2 Щоб встановити com.facebook.widget.LoginButton

крок: 3 Щоб встановити Textview з можливістю налаштування.

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

ПОВИНЕН ПАМ’ЯТИ

1> com.facebook.widget.LoginButton & TextView Висота / Ширина однакові

2> Перше оголошення com.facebook.widget.LoginButton, а потім TextView

3> Щоб виконати вхід / вихід із системи обробки кліків TextView


1

Це хитрість, не належний метод.

  • Створіть відносний макет.
  • Визначте свій facebook_botton.
  • Також визначте кнопку власного дизайну.
  • Перекрийте їх.
<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

Це дуже просто. Додайте в файл макета кнопку типу

<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 розмістіть метод registercallback () LoginManager, оскільки цей метод виконується автоматично.

  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
<FrameLayout
    android:id="@+id/FrameLayout1"
    android:layout_width="70dp"
    android:layout_height="70dp"
    android:layout_marginStart="132dp"
    android:layout_marginTop="12dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/logbu">


    <ImageView
        android:id="@+id/fb"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/fb"
        android:onClick="onClickFacebookButton"
        android:textAllCaps="false"
        android:textColor="#ffffff"
        android:textSize="22sp" />

    <com.facebook.login.widget.LoginButton

        android:alpha="0"  <!--***SOLUTION***-->
        android:id="@+id/buttonFacebookLogin"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingTop="45sp"
        android:visibility="visible"
        app:com_facebook_login_text="Log in with Facebook" />

</FrameLayout>

Найпростіший спосіб налаштувати вбудовану кнопку facebook як для Java, так і для kotlin


Геніальна відповідь
Сайок Маджумдер

-1

Правильний і найчистіший спосіб

Перевіривши відповіді нижче, здається, що це щось на зразок хакерів, які покладаються на редагування подання кнопки входу, щоб зробити його більш придатним для ваших потреб.

Демо-зображення

Опинившись у тій же позиції, мені вдалося ефективно налаштувати кнопку входу у facebook.

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

і реалізуйте onClickListener так

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

Ви можете знайти весь вихідний код на: http://medyo.github.io/customize-the-android-facebook-login-on-android


Потрібно змінити офіційну кнопку, а не додавати свою
Shadab K
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.