I followed this link to create floating toolbar with fab ..
Collapsing toolbar with floating action Menu
I tried to change the fab to a floating menu with few options when i click on the flab but when i attached the fab along with the toolbar,I couldn't collapse the toolbar along with the fab and hide the floating menu.
This is the link which i followed to create floating menu Sub menu items in fab
Can any one help me please....
My layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:background="@color/bg_card"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="@+id/header_image"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="@drawable/app_bg_overlay"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:elevation="4dp"
app:layout_collapseMode="pin"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
<TextView
android:id="@+id/textViewJob"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/bg_card"
android:maxLines="2"
android:paddingBottom="8dp"
android:paddingEnd="96dp"
android:paddingStart="24dp"
android:paddingTop="8dp"
android:textColor="@color/white"
android:textSize="16sp" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/black" />
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:tabBackground="@color/bg_card"
app:tabGravity="fill"
app:tabIndicatorColor="@color/colorAccent"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/white"
app:tabTextColor="@color/hint_color" />
</android.support.design.widget.AppBarLayout>
<!--<com.github.clans.fab.FloatingActionMenu
app:layout_anchor="@id/collapsing_toolbar"
app:layout_anchorGravity="bottom|right|end">-->
<!--
<include layout="@layout/layout_fab" />-->
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<FrameLayout
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="@+id/fraToolFloat"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:orientation="vertical"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|end">
<LinearLayout
android:id="@+id/linFab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="80dp"
android:layout_marginEnd="24dp"
android:layout_marginRight="8dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardBackgroundColor="#FFF"
app:cardCornerRadius="4dp"
app:cardElevation="4dp"
app:cardUseCompatPadding="true">
<TextView
android:id="@+id/lblMenu1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="2dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="2dp"
android:text="Mentorship"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textStyle="bold" />
</android.support.v7.widget.CardView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fabSub1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/mentorship"
app:backgroundTint="@color/colorPrimaryDark"
app:fabSize="mini" />
</LinearLayout>
<LinearLayout
android:id="@+id/linFab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="130dp"
android:layout_marginEnd="24dp"
android:layout_marginRight="8dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardBackgroundColor="#FFF"
app:cardCornerRadius="4dp"
app:cardElevation="4dp"
app:cardUseCompatPadding="true">
<TextView
android:id="@+id/lblMenu2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="2dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="2dp"
android:text="Alumni Meet"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textStyle="bold" />
</android.support.v7.widget.CardView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fabSub2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/alumni"
app:backgroundTint="@color/colorPrimaryDark"
app:fabSize="mini" />
</LinearLayout>
<LinearLayout
android:id="@+id/linFab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="180dp"
android:layout_marginEnd="24dp"
android:layout_marginRight="8dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardBackgroundColor="#FFF"
app:cardCornerRadius="4dp"
app:cardElevation="4dp"
app:cardUseCompatPadding="true">
<TextView
android:id="@+id/lblMenu3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="2dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="2dp"
android:text="Lunch Meetup"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textStyle="bold" />
</android.support.v7.widget.CardView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fabSub3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/lunch"
app:backgroundTint="@color/colorPrimaryDark"
app:fabSize="mini" />
</LinearLayout>
<LinearLayout
android:id="@+id/linFab4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="230dp"
android:layout_marginEnd="24dp"
android:layout_marginRight="8dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<android.support.v7.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cardBackgroundColor="#FFF"
app:cardCornerRadius="4dp"
app:cardElevation="4dp"
app:cardUseCompatPadding="true">
<TextView
android:id="@+id/lblMenu4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="2dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="2dp"
android:text="Coffee Connect"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textStyle="bold" />
</android.support.v7.widget.CardView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fabSub4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/lunch"
app:backgroundTint="@color/colorPrimaryDark"
app:fabSize="mini" />
</LinearLayout>
<LinearLayout
android:id="@+id/linFabSetting"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="280dp"
android:gravity="center_vertical"
android:orientation="horizontal">
<android.support.design.widget.FloatingActionButton
android:id="@+id/fabSetting"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginEnd="20dp"
android:src="@drawable/prof_plus"
app:backgroundTint="@color/colorPrimaryDark"
app:fabSize="normal" />
</LinearLayout>
</FrameLayout>
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
My collapsing toolbar funtion
private void setupCollapsingToolbar() {
collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
headerImageView = (ImageView) findViewById(R.id.header_image);
headerImageView.setImageBitmap(sqLiteDBHelper.getUserImage(Prefs.getUserKey()));
collapsingToolbar.setTitleEnabled(true);
collapsingToolbar.setTitle(sqLiteDBHelper.getName(Prefs.getUserKey()));
collapsingToolbar.setCollapsedTitleTextAppearance(R.style.collapsedappbar);
collapsingToolbar.setExpandedTitleTextAppearance(R.style.expandedappbar);
subtitleTextView = (TextView) findViewById(R.id.textViewJob);
appBarLayout = (AppBarLayout) findViewById(R.id.app_bar);
appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
int scrollRange = -1;
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
//Initialize the size of the scroll
if (scrollRange == -1) {
scrollRange = appBarLayout.getTotalScrollRange();
}
//Check if the view is collapsed
if (scrollRange + verticalOffset == 0) {
toolbar.setBackgroundColor(ContextCompat.getColor(ProfileActivity.this, R.color.colorPrimary));
subtitleTextView.setVisibility(View.GONE);
fraToolFloat.setVisibility(View.GONE);
} else {
toolbar.setBackgroundColor(ContextCompat.getColor(ProfileActivity.this, android.R.color.transparent));
subtitleTextView.setText(sqLiteDBHelper.getCompanyName(Prefs.getUserKey()));
subtitleTextView.setVisibility(View.VISIBLE);
fraToolFloat.setVisibility(View.VISIBLE);
}
}
});
}
How to achieve this
