使谷歌的SignInButton带有圆角,看起来像一个材质按钮

问题描述 投票:0回答:1

TLDR:我想让Google的登录按钮看起来像一个带有圆角形状的材质按钮,并保留其余部分(文本,默认情况下google图标)。
我已经在官方文档上使用 FirebaseUI 实现了登录功能。我使用的按钮是

com.google.android.gms.common.SignInButton
,它看起来像是来自 google play 依赖项。这个默认设计对我来说很难看,而且它的外观与我的其他按钮不一致。

所以,我想让它看起来像指南文件中的第一个。

我尝试遵循此指南,将

style="?attr/materialButtonOutlinedStyle"
应用于按钮,使其看起来像材料设计按钮。然而,这让它看起来很尴尬。

我该如何让它看起来像其他按钮(材质按钮)?

这是我正在使用的依赖项。了解可能会有所帮助。

// Firebase
implementation platform("com.google.firebase:firebase-bom:$firebase_bom_version")
implementation 'com.google.firebase:firebase-analytics-ktx'
implementation 'com.google.firebase:firebase-crashlytics-ktx'
implementation 'com.google.firebase:firebase-auth'

// Firebase UI
implementation "com.firebaseui:firebase-ui-auth:$firebase_ui_version"
// Google Play
implementation "com.google.android.gms:play-services-auth:$play_services_auth_version"
// Material Desgin
implementation "com.google.android.material:material:$material_version" // 1.9.0
android material-design google-play-services
1个回答
0
投票

您应该使用普通按钮并通过添加可绘制的开始和带圆角的选择器背景来自定义它。

!.xml代码

      <TextView
        android:id="@+id/googleSignInBtn"
        android:layout_centerInParent="true"
        android:paddingVertical="@dimen/_10sdp"
        android:paddingHorizontal="@dimen/_10sdp"
        android:drawableStart="@drawable/search"
        android:drawablePadding="@dimen/_10sdp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/google_button_background"
        android:text="Sign in with Google" />
  1. Drawble 选择器文件
        <?xml version="1.0" encoding="utf-8"?>
     <shape android:shape="rectangle" 
        xmlns:android="http://schemas.android.com/apk/res/android">
        <corners android:radius="@dimen/_20sdp"/>
        <stroke android:color="@color/black"
        android:width="2dp"/>
       <solid android:color="@color/white"/>
    </shape>

结果将如下所示

© www.soinside.com 2019 - 2024. All rights reserved.