Firebase用户界面 - 验证 - 使用自己的布局

Question

是否可以在Android上使用我自己的Firebase UI Auth 布局和按钮？

我基本上想要实现自己选择身份提供者(google,facebook等)的屏幕并从我的点击监听器开始相应的流程(例如使用Butterknife):

@OnClick(R.id.login_btn_signInGoogle)  
public void signInGoogle(View view) {  
  // Start google sign in flow <--- This is what I do not know how to do it  
}

@OnClick(R.id.login_btn_signInFacebook)  
public void signInFacebook(View view) {  
  // Start facebook sign in flow <--- This is what I do not know how to do it 
}

我知道firebase提供了自定义屏幕/主题的可能性,但对我的情况来说还不够.

在最坏的情况下,我将不得不使用标准的firebase sdk方法来实现它.

Answer 1

现在我们所能做的就是接受他们对FirebaseUI布局说明这里.如果我们不喜欢,我们必须自己登录.我真的希望他们将来提供一些定制.

在我的应用程序中,我有一个单独的徽标和一个单独的背景,所以当你尝试注册电子邮件时,徽标会消失,注册对话框不会干扰徽标,就像这里 你可以用.SetTheme和.SetLogo来做

 startActivityForResult(
                        AuthUI.getInstance()
                                .createSignInIntentBuilder()
                                .setTheme(R.style.FirebaseLoginTheme)
                                .setLogo(R.drawable.logo)
                                .setProviders(Arrays.asList(
                                        new AuthUI.IdpConfig.Builder(AuthUI.FACEBOOK_PROVIDER).build(),
                                        new AuthUI.IdpConfig.Builder(AuthUI.GOOGLE_PROVIDER).build(),
                                        new AuthUI.IdpConfig.Builder(AuthUI.EMAIL_PROVIDER).build()))
                                .setIsSmartLockEnabled(false)
                                .build(),
                        RC_SIGN_IN);

在styles.xml中编辑windowBackground for FirebaseLoginTheme:

 <style name="FirebaseLoginTheme" parent="FirebaseUI">
    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowBackground">@drawable/login</item>
</style>

Answer 2

是的，您可以在 Android 上使用自己的布局和按钮进行 Firebase UI Auth。

对于 Google 和 Facebook，您可以使用 XML 文件中提供的小部件，例如：

        <com.google.android.gms.common.SignInButton
            android:id="@+id/btn_google_login"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dip"
            android:background="@color/colorAccent"
            android:text="@string/btn_google_login"
            android:textColor="@android:color/black" />

        <com.facebook.login.widget.LoginButton
            android:id="@+id/btn_facebook_login"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dip"
            android:background="@color/colorAccent"
            android:text="@string/btn_facebook_login"
            android:textColor="@android:color/black"/>

然后您可以使用您的“android:id”对 onClick 执行操作

希望您的问题得到解答。

编辑： 对于谷歌流程：

// Configure sign-in to request the user's ID, email address, and basic
        // profile. ID and basic profile are included in DEFAULT_SIGN_IN.
        GoogleSignInOptions gso = new GoogleSignInOptions.Builder(GoogleSignInOptions.DEFAULT_SIGN_IN)
                .requestIdToken(Your web_client_id)
                .requestEmail()
                .build();

    btn_google_login = (SignInButton) findViewById(R.id.btn_google_login);

    btn_google_login.setSize(SignInButton.SIZE_STANDARD);
    btn_google_login.setScopes(gso.getScopeArray());

    btn_google_login.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            //If you want everytime for user to ask the account to select.
            mGoogleApiClient.clearDefaultAccountAndReconnect();

            Intent signInIntent = Auth.GoogleSignInApi.getSignInIntent(mGoogleApiClient);
            startActivityForResult(signInIntent,RC_SIGN_IN);
        }
    });