0

I'm struggling with the top answer here: How to mimic the Material-design raised button style, even for pre-Lollipop (minus the special effects)?

I made a mock program with the bare essentials listed by @spierce7

  • In gradle: compile "com.android.support:appcompat-v7:24.1.1" // (24.2.1 in my case)
  • In styles.xml: <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
  • In Android Manifest: android:theme="@style/AppTheme"
  • My Activity extends AppCompatActivity
  • My button is an AppCompatButton (or a plain Button, doesn't matter)

Here is the layout XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/content_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:showIn="@layout/activity_main">

    <android.support.v7.widget.AppCompatTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        android:id="@+id/textview_helloworld"/>

    <android.support.v7.widget.AppCompatButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:layout_below="@id/textview_helloworld"/>
</RelativeLayout>

The result is this:

enter image description here

The corner floating button inflates with the "raised look", but not my AppCompatButton.

And I'm still not seeing raised buttons in pre-Lollipop. What am I missing or doing wrong?

Community
  • 1
  • 1
MPelletier
  • 16,256
  • 15
  • 86
  • 137

1 Answers1

0

After checking again on the latest version it seems that the appcompat library isn't backporting the raised button effect for me either. I've updated my answer accordingly.

My recommendation is that you just use what the appcompat library provides for you, as it's still matching the material design guidelines. If for some reason you MUST have an exact backport (an exact backport would include not only the raised button effect, but also the raised pressed animation effect, along with the ripple), you'll need to look to some 3rd party libraries. I've seen 3rd party libraries with partial backports, but no full backports, but I haven't looked thoroughly.

If you wish to make your own, you'll need to follow my old answer to the question you posted, extending CardView.

spierce7
  • 14,797
  • 13
  • 65
  • 106
  • I'm not at my dev computer right now, but how would you explain the floating mail button? I can post the code, it's from a base activity template in Android Studio. – MPelletier Oct 18 '16 at 19:43
  • @MPelletier I believe `FloatingActionButton` - which is what your mail button is - uses a combination of padding and a shadow `Drawable` to simulate an elevation shadow in pre-Lollipop versions, which is how `CardView` does it, too. – Mike M. Oct 19 '16 at 00:01
  • @MPelletier I'm not sure I understand what you mean, but the above commenter is right. That's a FloatingActionButton, and it seems that Google kept it's implementations shadow. I'm certainly not saying that it's hard to give a view a raised shadow effect. – spierce7 Oct 19 '16 at 06:35
  • @spierce7 It's ok, I wasn't familiar with FloatingActionButton. In the end I hacked together something with selectors that looks like a shadow. – MPelletier Oct 19 '16 at 14:57