自定义Android Facebookloginbutton

我想要自定义Facebookloginbutton的外观,我们与Android的Facebook的Facebook(SDK的SDK – 3.0.1)的Facebook SDK相处。 我想要一个简单的Androidbutton,标题为“通过Facebooklogin”。 我找不到任何有关这方面的文件。

所以,如果有人知道如何以简单的方式做到这一点,请告诉我或指导我如何做到这一点。

您可以使用样式修改loginbutton

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

为了有完全自定义的Facebookloginbutton,而不使用com.facebook.widget.LoginButton

根据facebook sdk 4.x,

有从Facebooklogin的新概念

LoginManager和AccessToken – 这些新类执行Facebooklogin

所以,现在你可以访问Facebook身份validation没有Facebookloginbutton

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

最好的办法,我发现要做到这一点,如果你想完全自定义button是创build一个button,或任何你想要的视图(在我的情况下,它是一个LinearLayout ),并设置一个OnClickListener到该视图,并调用以下在onClick事件中:

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

你可以像这样修改loginbutton

 <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. 创build自定义Facebookbutton,并改变原生Facebookbutton的可见性:

     <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. 添加侦听器到你的假button,并模拟点击:

     facebookView.setOnClickListener(this); @Override public void onClick(View v) { if (v.getId() == R.id.facebookView){ facebookButton.performClick(); } } 
 //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")); } }); } 

在较新的Facebook SDK中,login和注销文本名称是:

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

这对我有效。 要更改Facebookloginbutton文本。

自定义com.facebook.widget.LoginButton

步骤:1创build一个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> 1st declate com.facebook.widget.LoginButton 然后 TextView

3>使用TextView的Click-Listener执行login/注销

这不是一个合适的方法。

  • 创build一个相对布局。
  • 定义你的facebook_botton。
  • 同时定义您的自定义devisebutton。
  • 重叠他们。
 <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> 

正确和最干净的方式

检查下面的答案后,似乎他们是一种黑客,依靠编辑loginbutton视图,使其更适合您的需要。

演示图像

在相同的位置,我已经成功地自定义Facebookloginbutton有效。

 <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上find整个源代码。;

这很简单。 在布局文件中添加一个button

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