CODEWITHSUNDEEP
androidandroid-layoutmaterial-designandroid-support-libraryandroid-design-library
Sharjeel
Sharjeel

Reputation: 15798

Borderless Button on Pre-Lollipop with Support Library

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

enter image description here

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 enter image description here

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.

Upvotes: 15

Views: 14431

Answers (4)

arekolek
arekolek

Reputation: 9621

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

Upvotes: 3

Sharjeel
Sharjeel

Reputation: 15798

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).

Upvotes: 25

yennsarah
yennsarah

Reputation: 5517

You are using the android implemented style of "buttonBarButtonStyle" since you are calling it via ?atr - use style="@style/BorderlessButtonStyle instead.

Edit: Leave your xml as it is, but you can change it to your wanted behaviour like this:

AppCompatButton button = (AppCompatButton) findViewById(R.id.btnForgotPassword);

ColorStateList colorStateList = new ColorStateList(new int[][] {{0}}, new int[] {0xFF969696});  
    //969696 is your wanted grey color, just change it
button.setSupportBackgroundTintList(colorStateList);

Upvotes: 0

Elltz
Elltz

Reputation: 10869

why do you worry with some things just go with this and be free

<Button
   android:id="@+id/btnForgotPassword"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="@string/forgot_your_password"
   android:background="@drawable/abc_btn_borderless_material"
/>

and now careless about api stuff

Upvotes: 0

Related Questions