Android Expandable Button Menu

Button merupakan komponen yang sangat penting dalam pembuatan aplikasi, g mungkin ada aplikasi yang g make button, sehingga untuk menarik perhatian user, para developer banyak membuat bentuk button jadi lebih menarik.

Baru-baru ini ada yang namanya Floating Buttonfab

yang biasanya nongol di kanan bawah, hampir semua aplikasi mobile make Floating Button, tapi jangan salah sangka dulu yah, saya g akan ngebuat Floating Button kok. Saya mau ngebuat menu kaya di Path, aplikasi jejaring sosial yang pasti semua orang tau.

arc-menu

ada yang bilang menu yang kaya path namanya Arc Menu, ada yang bilang Satelit Menu dan ada juga yang bilang Ray Menu

nah yang mau saya buat adalah kaya gini

Seperti biasa kita download dulu library-nya

compile 'co.lemonlabs:expandable-button-menu:1.0.0'

Kemudian dibikin layoutnya

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:ebm="http://schemas.android.com/apk/res-auto"
                android:layout_width="match_parent"
                android:layout_height="match_parent">


    <lt.lemonlabs.android.expandablebuttonmenu.ExpandableMenuOverlay
        android:id="@+id/button_menu"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:src="@drawable/circle_home"

        ebm:dimAmount="0.8"

        ebm:mainButtonSize="0.25"
        ebm:otherButtonSize="0.22"
        ebm:distanceY="0.17"
        ebm:distanceX="0.28"
        ebm:bottomPad="0.02"

        ebm:closeButtonSrc="@drawable/circle_close"
        ebm:leftButtonSrc="@drawable/circle_1"
        ebm:midButtonSrc="@drawable/circle_2"
        ebm:rightButtonSrc="@drawable/circle_3"

        ebm:leftButtonText="@string/action_left"
        ebm:midButtonText="@string/action_mid"
        ebm:rightButtonText="@string/action_right"/>

</RelativeLayout>

pada class MainActivity kita bikin variabel Expandable Button dulu

private ExpandableMenuOverlay menuOverlay;

Kemudian kita inisiasi variabel tersebut

menuOverlay = (ExpandableMenuOverlay) findViewById(R.id.button_menu);

menuOverlay.setOnMenuButtonClickListener(new ExpandableButtonMenu.OnMenuButtonClick() {
    @Override
    public void onClick(ExpandableButtonMenu.MenuButton action) {
        switch (action) {
            case MID:
                Toast.makeText(DemoActivity.this, "Mid pressed and dismissing...", Toast.LENGTH_SHORT).show();
                menuOverlay.getButtonMenu().toggle();
                break;
            case LEFT:
                Toast.makeText(DemoActivity.this, "Left pressed", Toast.LENGTH_SHORT).show();
                break;
            case RIGHT:
                Toast.makeText(DemoActivity.this, "Right pressed", Toast.LENGTH_SHORT).show();
                break;
        }
    }
});

Untuk lebih lengkapnya silahkan download disini.

 

 

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s