Skip to content
DeveloperPaul123 edited this page Dec 7, 2015 · 2 revisions

This library offers two main types of buttons so far.

  • MaterialFloatingActionButton - This provides the floating action button pattern seen in many apps today. It automatically takes the theming from the app and defaults to the accent color of the current style.
  • MaterialFlatButton - This provides a flat button that reacts nicely to user input by slightly raising and with a visible ripple.

MaterialFloatingActionButton

XML Layout Examples

  • Default look and feel.
        <com.devpaul.materiallibrary.views.MaterialFloatingActionButton
            android:id="@+id/activity_button_default_fab"
            android:layout_below="@id/activity_button_title_two"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
  • Custom FAB color.
        <com.devpaul.materiallibrary.views.MaterialFloatingActionButton
            android:id="@+id/activity_button_blue_fab"
            android:layout_toRightOf="@id/activity_button_default_fab"
            android:layout_below="@id/activity_button_title_two"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:mat_fab_colorNormal="#303F9F"/>
  • Mini sized FAB
        <com.devpaul.materiallibrary.views.MaterialFloatingActionButton
            android:id="@+id/activity_button_default_mini_fab"
            android:layout_below="@id/activity_button_default_fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:mat_fab_size="mini"/>
  • Mini fab button with custom color and icon.
        <com.devpaul.materiallibrary.views.MaterialFloatingActionButton
            android:id="@+id/activity_button_red_mini_fab"
            android:layout_toRightOf="@id/activity_button_default_mini_fab"
            android:layout_below="@id/activity_button_default_fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:mat_fab_colorNormal="#F44336"
            app:mat_fab_icon="@android:drawable/ic_btn_speak_now"
            app:mat_fab_size="mini"/>

Xml Attributes

  • mat_fab_colorNomal : Use this to set the normal color of the button when the user isn't interacting with it.
  • mat_fab_colorPressed : Use this to set the color the button changes to or the ripple color when it is pressed.
  • mat_fab_use_selector: Set this to true to have the fab only change colors when pressed (i.e. no ripple effect).
  • mat_fab_icon : Use this to change the icon of the fab.
  • mat_fab_title : Use this to set the title of the FAB.
  • mat_fab_size : Options are mini or normal.

MaterialFlatButton

XML Layout Examples

  • Default layout.
   <com.devpaul.materiallibrary.views.MaterialFlatButton
            android:id="@+id/activity_button_default_flat_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/activity_button_title_one"
            android:layout_weight="1"/>
  • Completely flat layout, without any shadow.
    <com.devpaul.materiallibrary.views.MaterialFlatButton
        android:id="@+id/activity_button_agree_flat_button"
        android:layout_toRightOf="@id/activity_button_default_flat_button"
        android:layout_below="@id/activity_button_title_one"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:mat_flat_button_color="#303F9F"
        app:mat_flat_button_is_flat="true"
        app:mat_flat_button_text="Agree"
        android:layout_weight="1"/>
  • Similar to the default setting but with a custom color.
    <com.devpaul.materiallibrary.views.MaterialFlatButton
        android:id="@+id/activity_button_cancel_flat_button"
        android:layout_toRightOf="@id/activity_button_agree_flat_button"
        android:layout_below="@id/activity_button_title_one"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:mat_flat_button_color="#F44336"
        app:mat_flat_button_is_flat="false"
        app:mat_flat_button_text="Cancel"
        android:layout_weight="1"/>

Xml Attributes

  • mat_flat_button_text : Use this to set the text of the button. This class does not inherit from the Button class in android so you need to use this custom attribute to set the text.
  • mat_flat_button_is_flat : Set this as true to eliminate the shadow from the button.
  • mat_flat_button_color : Set the color of the button, by default it is cyan.

Clone this wiki locally