带展开菜单的浮动操作按钮

Annabelle 9年前

带展开菜单的浮动操作按钮,菜单item可以像标准menu那样在xml里设置,还可以定义fab的位置。

使用说明:

开始

把依赖添加进gradle.build

dependencies {      compile 'io.github.yavski:fab-speed-dial:1.0.1'  }

定义菜单资源文件

<menu xmlns:android="http://schemas.android.com/apk/res/android"      xmlns:app="http://schemas.android.com/apk/res-auto">      <item          android:id="@+id/action_call"          android:icon="@drawable/ic_call_black_24px"          android:title="@string/menu_item_call" />      <item          android:id="@+id/action_text"          android:icon="@drawable/ic_chat_bubble_outline_black_24px"          android:title="@string/menu_item_text"/>      <item          android:id="@+id/action_email"          android:icon="@drawable/ic_mail_outline_black_24px"          android:title="@string/menu_item_email" />  </menu>

把FabSpeedDial添加到 layout xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"      xmlns:app="http://schemas.android.com/apk/res-auto"      android:layout_width="match_parent"      android:layout_height="match_parent"      android:padding="16dp">        <io.github.yavski.fabspeeddial.FabSpeedDial          android:layout_width="wrap_content"          android:layout_height="wrap_content"          android:layout_gravity="bottom|end"          app:fabGravity="bottom_end"          app:fabMenu="@menu/menu_main"          app:miniFabBackgroundTintColor="@android:color/white"          app:miniFabImageTintColor="?attr/colorPrimaryDark"          app:miniFabTitleTextColor="?attr/colorPrimaryDark" />    </FrameLayout>

效果

事件

跟所有的menu一样,在item列表显示之前有一个回调。这个回调允许你更新menu item

        FabSpeedDial fabSpeedDial = (FabSpeedDial) findViewById(R.id.fab_speed_dial);          fabSpeedDial.setMenuListener(new SimpleMenuListenerAdapter() {              @Override              public boolean onPrepareMenu(NavigationMenu navigationMenu) {                  // TODO: Do something with yout menu items, or return false if you don't want to show them                  return true;              }          });

类似的,在item被选择的时候,我们有:

        FabSpeedDial fabSpeedDial = (FabSpeedDial) findViewById(R.id.fab_speed_dial);          fabSpeedDial.setMenuListener(new SimpleMenuListenerAdapter() {              @Override              public boolean onMenuItemSelected(MenuItem menuItem) {                 //TODO: Start some activity                return false;              }          });

自定义

位置

为了改变view的位置,使用标准的android API去定义FabSpeedDial在ViewGroup中的位置,即设置fabGravity的值:

<FrameLayout      android:id="@+id/content_view"      android:layout_width="match_parent"      android:layout_height="match_parent"      android:layout_marginTop="?attr/actionBarSize">        <io.github.yavski.fabspeeddial.FabSpeedDial          android:layout_width="wrap_content"          android:layout_height="wrap_content"          android:layout_gravity="bottom|end"          app:fabMenu="@menu/menu_main"          app:fabGravity="bottom_end" />


  

基本样式

支持以下属性:

FabSpeedDial Android Desscription
app:fabDrawable android:src Sets the icon drawable of the main FAB
app:fabDrawableTint android:tint Tints the icon drawable of the main FAB
app:fabBackgroundTint android:backgroundTint Tints the background colour of the main FAB
app:miniFabDrawableTint android:tint Tints the icon drawable of the mini FAB(s)
app:miniFabBackgroundTint android:backgroundTint Tints the background colour of the mini FAB(s)


</div>

项目地址: https://github.com/yavski/fab-speed-dial