7

Today I was trying out new material components part of their instalation is that you need to change parent of your app to inherit from Theme.MaterialComponents. So I did it because I wanted to use Bottom navigation with nicer ripple. But after that, almost all buttons in application got puffier.

What should I do to revert to the previous state (image on right)?

On left is a material version on right is appcompat version On left is a material version on right is appcompat version

Edric
  • 24,639
  • 13
  • 81
  • 91
svkaka
  • 3,942
  • 2
  • 31
  • 55

3 Answers3

13

During research, I found the answer I will leave it here maybe it will help someone.

Reason that they look like this is because they use style="attr/buttonBarNegativeButtonStyle" and Material theme overrides them

To fix this problem you need to use Bridge theme instead of Theme.MaterialComponents.Light

<style name="Theme.MyApp" parent="Theme.MaterialComponents.Light.Bridge">
    <!-- ... -->
</style>

more here: https://github.com/material-components/material-components-android/blob/master/docs/getting-started.md#bridge-themes

svkaka
  • 3,942
  • 2
  • 31
  • 55
  • This helped me, but there is no real explanation why. Also there is an open bug in google's issue tracker for that (https://issuetracker.google.com/issues/116861837), so it seems to be a bug. – Ridcully Sep 30 '18 at 19:34
  • This works but using the bridge also removes the ripple effect on the buttons when using a TextButton, not sure how I could fix that though! – Mr.Noob Jan 15 '19 at 08:08
3

Another way to do it is to use AlertDialog from the AndroidX AppCompat library:

AlertDialog signInDialog = new AlertDialog.Builder(this)
    .setMessage("Are you sure you want to log out?")
    .setPositiveButton("OK", (dialogInterface, i) -> {
        // TODO: Add your code here
    })
    .setNegativeButton("Cancel", (dialogInterface, i) -> {
        // TODO: Add your code here
    })
signInDialog.show();

Note: If you're using the Material Components for Android library and/or you're using the new Theme.MaterialComponents.* themes, you should instead use the MaterialAlertDialogBuilder class, which should be used in place of the AppCompat AlertDialog class as described below:

Material maintains usage of the framework AlertDialog, but provides a new builder, MaterialAlertDialogBuilder, which configures the instantiated AlertDialog with Material specs and theming.

Here's an example (in Kotlin):

MaterialAlertDialogBuilder(this).apply {
    setMessage("Are you sure you want to log out?")
    setPositiveButton("OK") {
        TODO("Unimplemented functionality")
    }
    setNegativeButton("Cancel") {
        TODO("Unimplemented functionality")
    }
}.show()
Edric
  • 24,639
  • 13
  • 81
  • 91
  • no, its not working with 'Theme.MaterialComponents.Light' – arsalanelec Mar 23 '20 at 07:18
  • 1
    @arsalanelec You should use the `MaterialAlertDialogBuilder` class from the Material Components library: https://github.com/material-components/material-components-android/blob/master/docs/components/Dialog.md – Edric Mar 23 '20 at 14:16
1

Solution

Stop use of android.app.AlertDialog and replace with androidx.appcompat.app.AlertDialog it will solve your problem

You can use

    <style name="AppTheme" parent="@style/Theme.MaterialComponents.Light.Bridge">
    </style>

    or

    <style name="AppTheme" parent="@style/Theme.MaterialComponents.Light.NoActionBar.Bridge">
    </style>

But it will cause you when you will use the material component like ExtendedFloatingActionButton, MaterialButton, etc

Sumit Jain
  • 1,100
  • 1
  • 14
  • 27