Android material design buttons - Pre lollipop

How do I implement the "raised button" and the "flat button" as described in google's material design guidelines?

---

> Raised buttons add dimension to mostly flat layouts. They emphasize > > functions on busy or wide spaces.

---

> Use flat buttons for toolbars and dialogs to avoid excessive layering.

Source: http://www.google.com/design/spec/components/buttons.html

This requires Android 5.0

Raised Button

Inherit your button style from Widget.Material.Button, and the standard elevation and raising action will automatically be applied.

<style name="Your.Button" parent="android:style/Widget.Material.Button">
    <item name="android:background">@drawable/raised_button_background</item>
</style>

Then you need to create a raised_button_background.xml file with your button's background color inside a ripple tag:

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?attr/colorControlHighlight">
    <item android:drawable="@color/button_color"/>
</ripple>

Flat Button

Edit: Instead of my previous advice for flat buttons, you should instead use follow the advice given by Stephen Kaiser below:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="DONE"
    style="?android:attr/borderlessButtonStyle"
/>

Edit: If you are using Support Library, you can achieve the same result on Pre-Lollipop devices by using style="?attr/borderlessButtonStyle". (notice the absence of android:) The above example then becomes

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="DONE"
    style="?attr/borderlessButtonStyle"
/>

In order to implement the flat buttons, you could just add style="?android:attr/borderlessButtonStyle".

Example:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="DONE"
    style="?android:attr/borderlessButtonStyle"
    />

Here's the reference for the attribute.

You can use MaterialDesignLibrary. It's third party library.

This is a library with components of Android L to you use in android 2.2 If you want use this library, you only have to download MaterialDesign project, import it into your workspace and add the project as a library in your android project settings.

I use this as a background for a button with AppCompat and it depicts a raised button (with ripples n all), hope it helps.

myRaisedButton.xml - inside the drawable folder:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android"
               android:shape="rectangle">
            <solid android:color="@color/yourColor"/>
            <corners android:radius="6dp"/>
        </shape>
    </item>
    <item android:drawable="?android:selectableItemBackground"/>
</layer-list>

styles.xml:

<resources>

    <style name="AppTheme" parent="AppTheme.Base"/>
    <style name="AppTheme.Base" parent="Theme.AppCompat">

</resources>

styles.xml (v21):

...
<style name="AppTheme" parent="AppTheme.Base">

layout.xml:

...
android:background="@drawable/myRaisedButton"

I'm working on a material compatibility library. The button class is there and supports animated shadows and the touch ripple. Maybe you will find it useful. Here's the link.

For a description of how to do this using the appcompat libray, check my answer to another question: https://stackoverflow.com/a/27696134/1932522

This will show how to make use of the raised and flat buttons for both Android 5.0 and earlier (up to API level 11)!

You asked for material design buttons Library - you got it - https://github.com/navasmdc/MaterialDesignLibrary

You may also need to add a bottom margin to your button, in order to be able to see the raised-button shadow effect:

<item name="android:layout_marginBottom">@dimen/activity_vertical_margin</item>
<item name="android:elevation">1dp</item>