How do I code the red email signin button for Firebase authentication? - email

Question

My Firebase app uses Google signin as well as non-Gmail signin. I've seen the little red "Sign in with email" button here, but I couldn't find a layout that shows how to code it. My login activity looks like the following:
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_login);
// Views
findViewById(R.id.signInButton).setOnClickListener(this);
findViewById(R.id.emailSignInButton).setOnClickListener(this);
// Configure Google Sign In
GoogleSignInOptions gso = new GoogleSignInOptions.Builder(GoogleSignInOptions.DEFAULT_SIGN_IN)
.requestIdToken(getString(R.string.default_web_client_id))
.requestEmail()
.build();
mGoogleSignInClient = GoogleSignIn.getClient(this, gso);
}
and here's activity_login:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:gravity="center_horizontal"
android:orientation="vertical">
<ImageView
android:id="#+id/app_logo"
android:layout_alignParentTop="true"
android:layout_marginTop="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="#drawable/logo"/>
<TextView
android:id="#+id/welcome"
android:layout_below="#+id/app_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:layout_centerHorizontal="true"
android:text="#string/welcome"
android:visibility="invisible"
android:textSize="20sp"
android:textStyle="bold" />
<ProgressBar
android:id="#+id/progressBar"
style="#style/Widget.AppCompat.ProgressBar"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:visibility="invisible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<com.google.android.gms.common.SignInButton
android:id="#+id/signInButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"
android:visibility="visible" />
<Button
android:id="#+id/emailSignInButton"
android:layout_below="#+id/signInButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/email_signin"
android:layout_centerInParent="true" />
</RelativeLayout>
</LinearLayout>
I want to replace the Button tag with something that will render the same button one gets using AuthUI.IdpConfig.EmailBuilder().build(). I don't want to use the approach given on the page I referenced above as that not only violates best principles (declare the UI in XML rather than coding it inline) but also would necessitate major changes to code that's already working.

Answer 1

Thanks to Frank van Puffelen's suggestion, I found the button I needed:
<com.firebase.ui.auth.util.ui.SupportVectorDrawablesButton
android:id="#+id/email_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/FirebaseUI.Button.AccountChooser.EmailButton"
android:text="#string/fui_sign_in_with_email"
tools:ignore="UnusedIds" /> <!-- Used in tests -->