Borderless Button on Pre-Lollipop with Support Library

Question

I am making borderless flat button using support library (23.0.1). It works normal on Lollipop. However on pre-Lollipop when I press button Its color changes to colorButtonNormal color like it's a normal button.

I don't think so it's a normal behaviour and focused color should be grey like on Lollipop.

Here's the screenshot from Lollipop and Pre-lollipop.

First normal behaviour on Lollipop: Borderless button in normal state and focused state on Lollipop

Not normal behaviour on Pre-Lollipop (Desire color is gray like above but it's not): Borderless button in normal state and focused state on Pre-lollipop

Theme

<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
//other stuff 
        <item name="colorButtonNormal">@color/orangeColor</item>
        <item name="buttonBarButtonStyle">@style/BorderlessButtonStyle</item>
</style>

<style name="BorderlessButtonStyle" parent="Widget.AppCompat.Button.Borderless">
        <item name="android:textColor">@color/blueTextColor</item>
</style>

And now button in layout:

<Button
            android:id="@+id/btnForgotPassword"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/forgot_your_password"
            style="?attr/buttonBarButtonStyle"
            />

Any way to get it write using AppCompat Theme and styles without of making separate Drawables.

Answer 1

Borderless Button works on both Post and Pre Lollipop version with Support Library but there's a small difference between their onPressed color.

Pre-Lollipop: By default onPressed color is same as default Button color set using colorButtonNormal.

Lollipop: By default onPressed color is light grey, which is ideal.

You can make a Borderless Button like this:

<Button  
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Name"
    style="@style/Widget.AppCompat.Button.Borderless"/>

Now If you want to have the same onPressed color on all versions then you can set colorControlHighlight in a new theme and set that theme on Button.

<Button  
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Name"
        android:theme="@style/BorderlessButton"
        style="@style/Widget.AppCompat.Button.Borderless"/>

And theme in your style:

<style name="BorderlessButton" parent="Theme.AppCompat.Light">
      <item name="colorControlHighlight">YOUR COLOR</item>
</style>

Updated: You can use android:theme attribute for a View since Android 5.0 Lollipop and AppCompat v22.1.0 (and higher).

Answer 2

Adding style="?borderlessButtonStyle" to the Button worked fine for me.