在Facebook按钮上添加圆角

Question

我正在尝试自定义Android中的facebook sdk附带的按钮。我希望它有圆角而不是普通的角落，为了达到这个目的，我尝试了here的答案，我所做的基本上是我在styles.xml中为我的facebook按钮添加了一个样式：

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

作为背景，我从我的drawable中引用了一个xml，我在其中定义了我的角落：

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

这是我的主要布局，其中我引用了我的样式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" />

该按钮似乎没有角落，但它很奇怪，因为我定义的textSize似乎被应用，所以我不知道究竟是什么错。

Answer 1

您可以使登录按钮不可见，然后放置您自己的自定义按钮并设置onClickListener，如下所示：

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

Answer 2

对于任何不想创建另一个自定义按钮的人，我使用CardView作为按钮的父级，并使用padding for按钮来获得所需的外观：

 <android.support.v7.widget.CardView
        android:layout_width="240dp"
        android:layout_height="55dp"
        android:layout_gravity="center"
        app:cardCornerRadius="18dp">

        <com.facebook.login.widget.LoginButton
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:paddingBottom="25dp"
            android:paddingLeft="30dp"
            android:layout_gravity="center"
            android:paddingTop="25dp" />

    </android.support.v7.widget.CardView>

Answer 3

嗨，在我看来，我们无法编辑他们的Facebook登录按钮，所以我们可以这样做，在你的布局文件中，请执行以下代码，

        <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"
        android:gravity="center"
        android:orientation="vertical">

        <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="match_parent"
                android:layout_height="wrap_content"
                android:text="Log In With FaceBook"
                android:textAllCaps="true"
                android:visibility="gone" />


            <LinearLayout
                android:id="@+id/linearButton"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/login_bg"
                android:gravity="center"
                android:orientation="horizontal">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/com_facebook_button_icon" />

                <TextView
                    android:id="@+id/fb"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerInParent="true"
                    android:layout_marginLeft="10dp"
                    android:gravity="center"
                    android:singleLine="true"
                    android:text="Log In With FaceBook"
                    android:textAllCaps="true"
                    android:textColor="@color/colorAccent"
                    android:textStyle="bold"
                    android:visibility="visible" />
            </LinearLayout>

        </FrameLayout>
    </LinearLayout>

在你的drawable中用login_bg.xml创建一个xml文件，根据你改变颜色，

    <?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/colorPrimary" />
    <corners

        android:bottomLeftRadius="5dp"
        android:bottomRightRadius="5dp"
        android:topLeftRadius="5dp"
        android:topRightRadius="5dp" />
    <padding android:bottom="10dp"
        android:left="10dp"
        android:right="10dp"
        android:top="10dp"/>
</shape>

在您的活动中执行以下代码，

LoginButton loginButton;
TextView fb;

private void facebookLogin() {
loginButton = (LoginButton) findViewById(R.id.login_button);
fb = (TextView) findViewById(R.id.fb);
loginButton.setReadPermissions("email");
callbackManager = CallbackManager.Factory.create();
fb.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        if (v == fb) {
            LoginManager.getInstance().logOut();
            loginButton.performClick();
        }
    }
});
    }

在这里，我们将可见性设置为“GONE”原始的facebook sdk按钮，您可以从我的代码中了解。请尝试使用此功能。

Answer 4

您可以在运行时向Facebook按钮添加背景，也可以使用Android View作为Facebook登录按钮并根据您自己的设计进行设计。这里是使用Facebook登录自定义按钮的链接。

https://androidammy.blogspot.in/2015/09/facebook-login-with-custom-button.html

Answer 5

不要使用样式并删除它并使用android:background = "@drawable/yourdrawable"。我试过了