Navigation box displays a floating action button

Question

So, I use https://github.com/neokree/MaterialNavigationDrawer for my navigation box and https://gist.github.com/Jogan/9def6110edf3247825c9 as my FAB implementation. When I open the navigation box, it does not close the FAB. and a button appears above it. I would like not to hide the button and show it on the drawer open / close, as this is rather distracting. Any ideas how to fix this?

Edit: I add FAB programmatically by doing the following:

fabButton = new FloatingActionButton.Builder(this) .withDrawable(getResources().getDrawable(R.drawable.ic_action_edit)) .withButtonColor(0xFF2196F3) .withGravity(Gravity.BOTTOM | Gravity.END) .withMargins(0, 0, 16, 16) .create(); 

Changing this declaration to a fragment does not correct it. The implementation of the Nav Bar, linked above, requires activity to expand from the MaterialNavigationDrawer class, which can first draw the Nav Drawer, leaving the button always the last. Is there a way to programmatically force elements to be ordered?

Answer 1

You see FAB when the navigation box is open, because this FAB implementation adds FAB to the content view ( android.R.id.content ). Depending on the navigation box implementation, they seem to be on the same level in the view hierarchy.

If you do not want to switch to another FAB implementation. Use onDrawerSlide(View drawerView, float offset) and change the FAB alpha when opening the drawer. You can also switch its visibility inside the onDrawerClose() or onDrawerOpen() methods.

Edit:

 @Override public void onDrawerSlide(View drawerView, float offset){ fabButton.setAlpha(offset); } 

Answer 2

I found a neat solution that does not include alpha in it or toggles the button when the box is open or closed (which makes it look like a delay). Programmatically, you can change the border of the end of the button so that it moves from the activity window when changing the offset of the box.

So, first of all, outside the onDrawerSlide method you should get the FAB layout parameters with the following code (depending on the layout of the button in my case, this is FrameLayout ):

 final FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) fab.getLayoutParams(); 

Understand that I am doing this based on a simple mathematical linear equation: y = mx + n, and “y” is the field, “m” is the slope (you can change it), “x” is slideOffset and 'n' - default value / original (16dp). Thus, you assign a default marker and tilt to variables as pixels, subject to an abundance of display densities:

 int density = (int) Resources.getSystem().getDisplayMetrics().density; final int defaultMargin = 16 * density; final int slope = -100 * density; 

Then inside onDrawerSlide do the following:

 params.setMarginEnd((int) (slope * slideOffset + defaultMargin)); fab.setLayoutParams(params); 

If this does not work for you, try setting the marginEnd button when creating it or set the layout parameter fields as it is (although you will need to check if marginEnd right or left)

 params.setMargins(int left, int top, int right, int bottom); 

Hope this helps. This is my first answer, so I hope you do not have many complaints about it.

Answer 3

This is an alternative solution that works for me. Suppose you want to add a FAB to yourlayout.xml. Now create a framelayout in yourlayout.xml

  <FrameLayout android:id="@+id/myframelayout" android:layout_width="match_parent" android:layout_height="match_parent"> 

Now in FloatingActionButton.java replace the method

 public FloatingActionButton create() { ... ViewGroup root = (ViewGroup) activity.findViewById(android.R.id.content); root.addView(button, params); return button; } 

with

  public FloatingActionButton create(FrameLayout framelayout) { ... framelayout.addView(button, params); return button; } 

Now modify the FAB declaration as follows.

 FrameLayout yourframelayout = (FrameLayout)findViewById(R.id.myframelayout); fabButton = new FloatingActionButton.Builder(this) .withDrawable(getResources().getDrawable(R.drawable.ic_action_edit)) .withButtonColor(0xFF2196F3) .withGravity(Gravity.BOTTOM | Gravity.END) .withMargins(0, 0, 16, 16) .create(yourframelayout); 

What is it!

Answer 4

I am updating Nikola Despotoski's solution :

Thus, you must disable / hide the factory also after installing alpha, so if any user clicks on the place where fab is displayed from time to time, nothing will happen.

 mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.drawer_open, R.string.drawer_close) { public void onDrawerClosed(View view) { // Visible/Enable the FAB } public void onDrawerOpened(View drawerView) { // Hide/Disable the FAB } @Override public void onDrawerSlide(View drawerView, float slideOffset) { // invert the slideOffset value fab.setAlpha(1-slideOffset); } };