Home Android CircularFloatingActionMenu – Handle Events

Android CircularFloatingActionMenu – Handle Events

Android CircularFloatingActionMenu – Handle Events


Language :
Platform :
Type :
Owner :
Main Category :
Sub Category :
License :
Price :


  • Now we want to look at a circular menu.
  • Menus are improtant,they help us navigate apps.
  • A menu normally comprises menu items.Our circular menu in this case is no exception.It shall comprise a multiple menu items.
  • In our case,we have a circular floating action button,when clicked we show menu items in a circular fashion with animations.
  • When user clicks a menu item we handle events,in this case show a toast message.

Beware the full source code reference is above,all you need is download,extract and import to your android studio.Modfy and run.

Circuar Menu Project Structure

Circuar Menu Project Structure

Also our video tutorial is below if you want more explanations in a step by step manner.If you go the video way don’t forget to leave us a like and subscription,even if the audio quality at that time was disgusting.

Here;s our mainactivity :

 

package com.tutorials.hp.circlemenu;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.Toast;

import com.oguzdev.circularfloatingactionmenu.library.FloatingActionButton;
import com.oguzdev.circularfloatingactionmenu.library.FloatingActionMenu;
import com.oguzdev.circularfloatingactionmenu.library.SubActionButton;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ImageView icon=new ImageView(this);
        icon.setImageResource(R.drawable.add_green);
        final FloatingActionButton fab=new FloatingActionButton.Builder(this).setContentView(icon).build();

        SubActionButton.Builder builder=new SubActionButton.Builder(this);

        ImageView deleteIcon=new ImageView(this);
        deleteIcon.setImageResource(R.drawable.delete_red);
        SubActionButton deleteBtn=builder.setContentView(deleteIcon).build();

        ImageView removeIcon=new ImageView(this);
        removeIcon.setImageResource(R.drawable.remove);
        SubActionButton removeBtn=builder.setContentView(removeIcon).build();


        ImageView addIcon=new ImageView(this);
        addIcon.setImageResource(R.drawable.save);
        SubActionButton addBtn=builder.setContentView(addIcon).build();

        final FloatingActionMenu fam=new FloatingActionMenu.Builder(this)
                .addSubActionView(addBtn)
                .addSubActionView(removeBtn)
                .addSubActionView(deleteBtn)
                .attachTo(fab)
                .build();


        addBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this, "Add Clicked", Toast.LENGTH_SHORT).show();
                fam.close(true);
            }
        });
        removeBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this, "Remove Clicked", Toast.LENGTH_SHORT).show();
                fam.close(true);
            }
        });
        deleteBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this, "Delete Clicked", Toast.LENGTH_SHORT).show();
                fam.close(true);
            }
        });

    }
}

 

Make sure you add our Circular menu dependency in app level build.gradle :

 

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:24.2.0'
    compile 'com.oguzdev:CircularFloatingActionMenu:1.0.2'

}

 

Android Circular Floating Menu

Android Circular Floating Menu

 

For more step by step explanations,here’s our Video tutorial :

 

Leave a Comment