Theme.MaterialComponents 样式破坏了 Firebase AuthUI 布局

Question

我正在用 kotlin 编写我的第一个应用程序，并使用 FirebaseAuth 和 AuthUI 进行身份验证。我的登录屏幕完美运行，看起来像：

现在我试图将我的 AppTheme 的父级更改为“Theme.MaterialComponents.NoActionBar”（来自“Theme.AppCompat.NoActionBar”），但登录屏幕更改为：

我这样调用登录屏幕：

startActivityForResult(
    authUI.createSignInIntentBuilder()
        .setAvailableProviders(providers)
        .build(), 
    RC_SIGN_IN
)

我试图在 .build() 之前添加 .setTheme(R.style.FirebaseUI)，但它没有任何作用。我也尝试 .setTheme(R.style.AppTheme) 只是为了检查会发生什么，并将背景更改为深色主题，但按钮仍然是紫色且没有图标。有可能解决这个问题吗？

请帮帮我

（另外，不是很相关，但解决方案可能是相同的：AuthUI 默认使用 Google Smart Lock，我注意到它的对话框不受我为 AuthUI 设置的主题的影响。可以设置为深色模式吗？)

谢谢！

编辑：

正如 Himanshu Choudhary 在评论中建议的那样，为 material 组件制作不同的样式，将父主题保留为 AppCompat 并在所有活动中使用 material 主题，解决了问题，但它表示布局预览中的问题（因为它们使用应用程序主题）。我找到了部分解决方案：像这样制作新样式：

    <style name="AppTheme.SignInScreen" parent="Theme.AppCompat.NoActionBar">
        <item name="materialButtonStyle">?attr/buttonStyle</item>
    </style>

并将其设置为登录屏幕 .setTheme(R.style.AppTheme_SignInScreen) 结果：

我通过查看 AppCompatButton class 构造函数找到了 ?attr/buttonStyle。不幸的是，当我在该构造函数中设置调试点时，如果我将应用程序主题设置为 AppCompat(defStyleAttr=2130903157) 或 MaterialComponents(defStyleAttr=2130903586)，我会得到不同的 defStyleAttr。我试图在使用 AppCompat 应用程序主题时通过设置它并查看提示来找到它引用的内容，我发现了这个：?attr/buttonStyle => ?android:attr/buttonStyle => @style/Widget.Material.Button，但是设置 @android:style/Widget.Material.Button 给出了相同的结果结果... 任何人都知道如何取回图标？我不介意覆盖样式 inflater 甚至使用实际样式 id 而不是引用，但我找不到任何 example/explanation 做这些......请帮助

Answer 1

不用担心它很简单，只需使用其中一个桥接主题即可：

Theme.MaterialComponents.Bridge
Theme.MaterialComponents.Light.Bridge
Theme.MaterialComponents.NoActionBar.Bridge
Theme.MaterialComponents.Light.NoActionBar.Bridge
Theme.MaterialComponents.Light.DarkActionBar.Bridge

Bridge 主题继承自 AppCompat 主题，还为您定义了新的 Material Components 主题属性。如果您使用桥主题，则可以开始使用 Material 设计组件，而无需更改您的应用主题。（来自文档）

看看：Get Started - Material design

您面临的是 material 主题应用到所有按钮的默认色调的结果。如果需要，您可以使用 app:backgroundTint="none" 移除色调，按钮的原始背景将显示。

Theme.MaterialComponents 样式破坏了 Firebase AuthUI 布局

Theme.MaterialComponents style ruins Firebase AuthUI layout

android

kotlin

firebase-authentication

firebaseui

material-components-android