android google signin和facebook登录按钮看起来完全不同

Question

默认的Facebook LoginButton对象和Google SignIn按钮对象具有完全不同的外观，并且它们不能一起适合我现有的布局。据我所知，这些对象不是我可以在不改变库本身的情况下修改的资产（我假设这些组件也是开源的）

人们如何处理这个问题？我已经看到有两个使用自己的自定义按钮的登录选项的应用程序，但在我的实现中，我使用那些给定的对象，可以在点击时自动调用各自的库。

我当然可以深入了解，但如果我这样做，我觉得我正在重新发明不那么明显的轮子

 <com.google.android.gms.common.SignInButton
                android:id="@+id/sign_in_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center" />

这个对象显然不是一个按钮，我还没有检查过它是否真的是一个按钮。

我需要为Google+和Facebook登录按钮使用不同的资源。

我有什么

我喜欢的Android示例（Duolingo app）

编辑： 经过一些非常简单的布局调整后，这就是结果（在横向模式下，只是为了说明问题）

这些按钮仍然非常不同，我需要一个不同的资产，仍然可以访问正确的方法。由于这些例子，我有点了解如何使用Facebook，但Google登录对我来说非常神秘

Answer 1

要更改Facebook按钮上的文字，请使用：

fb:login_text="Put your login text here"
fb:logout_text="Put your logout text here"

您还需要将其添加到按钮：

xmlns:fb="http://schemas.android.com/apk/res-auto"

像这样：

<com.facebook.widget.LoginButton
        xmlns:fb="http://schemas.android.com/apk/res-auto"
        android:id="@+id/login_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="30dp"
        android:layout_marginBottom="0dp"
        fb:login_text="Sign in with Facebook"
        />

Answer 2

试试这个： 将此方法添加到您的活动中：

protected void setGooglePlusButtonText(SignInButton signInButton, String buttonText) {
        for (int i = 0; i < signInButton.getChildCount(); i++) {
            View v = signInButton.getChildAt(i);

            if (v instanceof TextView) {
                TextView tv = (TextView) v;
                tv.setTextSize(15);
                tv.setTypeface(null, Typeface.NORMAL);
                tv.setInputType(InputType.TYPE_TEXT_FLAG_CAP_WORDS);
                tv.setText(buttonText);
                return;
            }
        }
    }

在 onCreateMethod 中添加以下行 （你在哪里初始化id）：

setGooglePlusButtonText(btnSignIn, getString(R.string.common_signin_button_text_long));

Answer 3

按钮没有完全相同的样式 - 角落上的不同曲线和投影的使用。所以它不可能让它们看起来完全一样。我能得到的最接近的是制作一个精确宽度为215dip的垂直线性布局 - 并将按钮的宽度设置为match_parent：

这使用了以下layout.xml：

<LinearLayout
    android:layout_width="215dip"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:orientation="vertical" >

<com.google.android.gms.common.SignInButton
    android:id="@+id/sign_in_button"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

<com.facebook.widget.LoginButton
    android:id="@+id/authButton"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

</LinearLayout>

使用Google+按钮，您只需使用自己的资源 - com.google.android.gms.common.SignInButton与android.widget.Button的行为相同，并以正常方式注册onClick处理程序。在创建资产时，请务必遵循Google的品牌推广指南：

https://developers.google.com/+/branding-guidelines

但是请注意，如果您使用多种语言实现自己的按钮，那么Google+按钮会提供您自己创建的翻译。

Answer 4

使用最新的sdk，两个按钮看起来都很相似。代码和结果如下所述。

第1步：build.gradle

compile＆＃39; com.facebook.android：facebook-android-sdk：4.6.0＆＃39;

compile＆＃39; com.google.android.gms：play-services：7.5.0＆＃39;

第2步：myActivity.xml

<com.google.android.gms.common.SignInButton
android:id="@+id/sign_in_button"
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="match_parent"
android:layout_gravity="center_vertical"/>

第3步：结果 第4步：使用最新的gcm

更新了build.gradle

compile 'com.facebook.android:facebook-android-sdk:4.6.0'
compile 'com.google.android.gms:play-services:8.4.0'

第5步：结果