Float button

Question

How to put a floating button, like Gmail, which is to write a new email, in the application?

It is possible to change the icon of this button via programming?

Answer 1

From SDK 21, you can use the ViewOutlineProvider:

1) Create a layout within a folder layout-v21 in your project, inserting a ImageButton:

<ImageButton
    android:id="@+id/floatingButton"
    android:layout_width="56dp"
    android:layout_height="56dp"
    android:contentDescription="description"
    android:background="@drawable/oval_ripple"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:elevation="4dp"
    android:layout_marginBottom="16dp"
    android:layout_marginRight="16dp"
    android:src="@android:drawable/ic_delete" />

2) create a Ripple simple to effect the button (oval_ripple.xml in the briefcase drawable-v21 of your project):

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?android:colorControlHighlight">
    <item>
        <shape android:shape="oval">
            <solid android:color="?android:colorPrimary" />
        </shape>
    </item>
</ripple>

3) Now, in your code:

...
//Verificando se o aparelho está no V21 ou não
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP){
    initLFloatingButtons();
} else{
    //implementações abaixo
}

@TargetApi(Build.VERSION_CODES.LOLLIPOP)
private void initLFloatingButtons() {

    int size = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 56, getResources().getDisplayMetrics());

    final ViewOutlineProvider viewOutlineProvider = new ViewOutlineProvider() {
        @Override
        public void getOutline(View view, Outline outline) {
            outline.setOval(0, 0, size, size);
        }
    };

    ImageButton floatingButton = ((ImageButton) findViewById(R.id.floatingButton));
    floatingButton.setOutlineProvider(viewOutlineProvider);
    floatingButton.setClipToOutline(true);
    floatingButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            //Seu evento
        }
    });
}

To use a Floating Button before v21, recommend you use this repository. You can import the library into your project or simply select the files that interest you within the repository.

To implement (if you have extracted the classes for your project), you simply:

<br.com.seuprojeto.seupackage.FloatingActionButton
    android:id="@+id/floatingButton"
    android:layout_width="76dp"
    android:layout_height="76dp"
    android:contentDescription="description"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_marginBottom="8dp"
    android:layout_marginRight="8dp" />

And in your class:

...
FloatingActionButton floatingButton = findViewById(R.id.floatingButton);
floatingButton.setSize(FloatingActionButton.SIZE_NORMAL);
floatingButton.setColorNormalResId(R.color.sua_cor_normal);
floatingButton.setColorPressedResId(R.color.sua_cor_pressionada);
floatingButton.setIcon(R.drawable.seu_drawable);
floatingButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        //Seu evento
    }
});

---

Edit

Use the Floatingactionbutton of design library of Android itself.

Answer 2

That to xml

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical|start"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/stat_notify_chat"
    app:layout_anchor="@+id/item_detail_container"
    app:layout_anchorGravity="top|end" />

and add this to the code

 FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
            fab.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                 // adicione sua ação    
                }
            });

Or start a project already with the ready button

Answer 3

Utilize FloatingActionButton, and use the graphic part ShapeDrawable.

Another simpler way to change the image or button, would be through the setImageResource, according to the image make certain method.