Search code examples
androidxmlandroid-layoutfacebook-sdk-4.0

Add rounded corners to the Facebook button


I am trying to customize the button that comes with the facebook sdk in Android. I want it to have rounded corners instead of normal corners and to achieve that I tried the answer from here and what I did was basically I added a style in the styles.xml for my facebook button:

   <style name="FacebookLoginButton">
    <item name="android:background">@drawable/fbshapebtn</item>
    <item name="android:textSize">18sp</item>
    <item name="android:gravity">center</item>
</style>

and as a background I refernced an xml from my drawable in which I defined my corners like this:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" android:padding="10dp">
    <corners
        android:bottomRightRadius="10dp"
        android:bottomLeftRadius="10dp"
        android:topLeftRadius="10dp"
        android:topRightRadius="10dp"/>
</shape>

and here is my main layout with the button in which I reference my styles xml.

  <com.facebook.login.widget.LoginButton
        android:id="@+id/login_button"
        style="@style/FacebookLoginButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView"
        android:layout_alignLeft="@+id/button2"
        android:layout_alignStart="@+id/button2"
        android:layout_marginBottom="11dp"
        android:layout_alignRight="@+id/button2"
        android:layout_alignEnd="@+id/button2" />

The button doesn't appear to have corners, but it is strange because the textSize that I defined seems to be applied, so I do not know what is wrong exactly.


Solution

  • You can make the login button invisible, then put your own custom button and set onClickListener like this:

    myCustomButton.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        myFacebookLoginButton.performClick();
                    }
                });