Home » Android » android – Can I edit the text of sign in button on Google?

android – Can I edit the text of sign in button on Google?

Posted by: admin April 23, 2020 Leave a comment

Questions:

I am integrating my application with google plus. I have installed google play services and signed in to my account. Also I could publish and plus one for what ever I want.

My problem

I can’t change the text of the sign in button.

My code

<com.google.android.gms.common.SignInButton
        android:id="@+id/share_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="Share on Google+" />

What I have tried?

  • First, I tried adding this line to the xml

    android:text="Share on Google+"
    
  • Secondly, I tried to set the text programmatically, however it didn’t work.

Any help would be appreciated.

Edit

If it is not possible, is there any way so I can use the same google sign in button on another button?

How to&Answers:

Here is the technique that I used:

protected void setGooglePlusButtonText(SignInButton signInButton, String buttonText) {
    // Find the TextView that is inside of the SignInButton and set its text
    for (int i = 0; i < signInButton.getChildCount(); i++) {
        View v = signInButton.getChildAt(i);

        if (v instanceof TextView) {
            TextView tv = (TextView) v;
            tv.setText(buttonText);
            return;
        }
    }
}

Answer:

Here is the easiest way that I used:

    TextView textView = (TextView) signInButton.getChildAt(0);
    textView.setText("your_text_xyz");

Answer:

Problem:

Other answers have mentioned a workaround. The underlying implementation of the button may change any time which would cause the code to break. I felt uncomfortable trying to use the hacks. For a clean solution, you would think that setting android:text on the com.google.android.gms.common.SignInButton in your layout file would do the trick. However it turns out that that attribute is not available for SignInButton.

Aim


Google’s guidelines

From documentation, Google suggests creating a custom button as mentioned on Customizing the Sign-In Button [Archived now. See the archived page here]. It suggests using the branding guidelines as mentioned at Sign-In Branding Guidelines. This includes using the given custom icons and images in the button, setting specific text size, paddings and other do’s and don’ts for the logo.

Clean Solution:

Doing as per Google’s suggestion involves some custom work. I was willing to do that but wanted to create something reusable, so that others won’t have to go through this again. That’s why I wrote a quick small (4KB) library does that. Feel free to contribute to it for everyone’s benefit if you find issues.

  • Step 1: Add the following to your app module level build.gradle file:

    dependencies {
        implementation 'com.shobhitpuri.custombuttons:google-signin:1.1.0'
    }
    
  • Step 2: In your XML Layout, have the following:

    <RelativeLayout
        ...
        xmlns:app="http://schemas.android.com/apk/res-auto">
    
        <com.shobhitpuri.custombuttons.GoogleSignInButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="@string/google_sign_up"
            app:isDarkTheme="true" />
    </RelativeLayout>
    

Usage

  • android:text="{string}": As usual to set the text on the button.

  • app:isDarkTheme="{Boolean}": To switch between blue theme and white theme for the button. The library handles changing of text color and background color. It also handles the change of color on button press or button clicks.

Source:

Hope it helps someone.

Answer:

android:text will not work because of Google’s Sign in button is a FrameLayout but not a Button.

Since text property is only meant for Views representing textual format but not for ViewGroups, your solution is not working.

The only way you can achieve is getting the TextView defined inside FrameLayout as explained by w.donahue.

Answer:

You can use this class I wrote based on the answer of w.donahue that you can find in this page:

import android.content.Context;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.TextView;

import com.google.android.gms.common.SignInButton;

public class GoogleLoginButton extends FrameLayout implements View.OnClickListener{

    private SignInButton signInButton;
    private OnClickListener onClickListener;

    public GoogleLoginButton(Context context) {
        super(context);
        init();
    }

    public GoogleLoginButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public GoogleLoginButton(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        signInButton = new SignInButton(getContext());
        signInButton.setSize(SignInButton.SIZE_STANDARD);
        setGooglePlusButtonText(signInButton, "Test");
        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        params.gravity = Gravity.CENTER;
        addView(signInButton, params);
    }

    protected void setGooglePlusButtonText(SignInButton signInButton, String buttonText) {
        // Find the TextView that is inside of the SignInButton and set its text
        for (int i = 0; i < signInButton.getChildCount(); i++) {
            View v = signInButton.getChildAt(i);

            if (v instanceof TextView) {
                TextView tv = (TextView) v;
                tv.setText(buttonText);
                return;
            }
        }
    }

    @Override
    public void setOnClickListener(OnClickListener onClickListener) {
        this.onClickListener = onClickListener;
        if(this.signInButton != null) {
            this.signInButton.setOnClickListener(this);
        }
    }

    @Override
    public void onClick(View v) {
        if(this.onClickListener != null && v == this.signInButton) {
            this.onClickListener.onClick(this);
        }
    }
}

Answer:

For Beginners

Avoiding few crashes.

try {
            ((TextView) mGoogleSignOutBtn.getChildAt(0)).setText(R.string.sign_out);
} catch (ClassCastException | NullPointerException e) {
            e.printStackTrace();
}

Answer:

I encorage not to use those @w.donahue approach since it violates several principles as open/close principle. Best approach it’s to customize your own sign in button. If you see documentation about Sign in Google plus button is just a FrameLayout with Textview. At this link https://developers.google.com/+/branding-guidelines#sign-in-button you have material to design the button.

public class GplusButton extends FrameLayout {

private final String logIn="log in with google +";

private final String logOut="log out";

TextView labelTV;

public GplusButton(Context context) {
    super(context, null);
}

public GplusButton(Context context, AttributeSet attrs) {
    super(context, attrs);
    setBackgroundResource(R.drawable.btn_g_plus_signin_normal);
    addTextLabel();
}

public void addTextLabel() {
    labelTV = new TextView(getContext());
    setTextLogIn();
    labelTV.setTextColor(Color.WHITE);
    FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(
            LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
    params.gravity = Gravity.CENTER;
    addView(labelTV, params);
}

public void setTextLogIn(){
    labelTV.setText(logIn);
}

public void setTextLogOut(){
    labelTV.setText(logOut);

}

The only annoying thing is that even Google + mark with 9 patch extension the PNG they aren’t, so you have to edit.