Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Make FAB respond to Soft Keyboard show/hide changes

I've seen various posts about FABs responding to Snackbar popups at the bottom of the screen as well as scroll-sensitive FABs. But is there some implementation of FloatingActionButton.Behavior (or similar) to move the FAB above the keyboard when it pops up?

Right now, the keyboard covers the FAB when I click for example in an EditText box. My goal is to animate the FAB so it is always visible, independent of the keyboard status.

EDIT: Both android:windowSoftInputMode="adjustResize" and ...="adjustPan" won't change anything. Well, adjustResize resizes the underlying layout (which is in my case a map) but the FAB doesn't move.

like image 371
mohoff Avatar asked Nov 16 '15 23:11

mohoff


2 Answers

Hi there i know it's old but for future or current readers/searchers and also the thread maker, he hasn't found answer yet. This is how i am having this behaviour in my app.

Fab hides on RecyclerView scroll, goes up when snack bar pops out, if fab is not shown and snackbar popus up and if you scroll then still Fab will be shown top of snack bar and will move down when SB disappears and last with keypad if it opens Fab will be pushed up. (sorry, i had to write coz i don't know how to give gif with eclipse emulator)

Image

enter image description here

Layout

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/layout_drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/GrayGood"
android:clipToPadding="false"
android:fitsSystemWindows="true" >

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/layout_coordinator"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.design.widget.AppBarLayout
        android:id="@+id/layout_appLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark" >

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways|snap"
            android:background="?attr/colorPrimary" />
    </android.support.design.widget.AppBarLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerViewMain"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:clipToPadding="false" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/floating_action_button_margin"
        app:layout_behavior="com.faisal.cvcd.anim.ScrollingFABAnimation"
        android:src="@drawable/ic_fab"
        android:tint="@color/White"
        app:backgroundTint="@color/colorPrimary"
        app:borderWidth="0dp"
        app:elevation="6dp"
        app:fabSize="normal" />
 </android.support.design.widget.CoordinatorLayout>
</android.support.v4.widget.DrawerLayout>

As you can see i am using FabAnimation class to override some of its default methods.

ScrollingFABAnimation

import android.content.Context;
import android.support.design.widget.CoordinatorLayout;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.support.v4.view.ViewCompat;
import android.util.AttributeSet;
import android.view.View;

public class ScrollingFABAnimation extends
        CoordinatorLayout.Behavior<FloatingActionButton> {

public ScrollingFABAnimation(Context context, AttributeSet attrs) {
    super(context, attrs);
}

//For SnackBar to push up the Floating Button when it pops up
@Override
public boolean layoutDependsOn(CoordinatorLayout parent,    FloatingActionButton child, View dependency) {
    return dependency instanceof Snackbar.SnackbarLayout;
}

@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, FloatingActionButton child, View dependency) {
    float translationY = Math.min(0, dependency.getTranslationY() - dependency.getHeight());
    child.setTranslationY(translationY);
    return true;
}

//For FAB to hide or show on scroll
@Override
public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View directTargetChild, View target,
        int nestedScrollAxes) {
    return nestedScrollAxes == ViewCompat.SCROLL_AXIS_VERTICAL  || super.onStartNestedScroll(coordinatorLayout, child,
                    directTargetChild, target, nestedScrollAxes);
}

@Override
public void onNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View target, int dxConsumed,
        int dyConsumed, int dxUnconsumed, int dyUnconsumed) {
    super.onNestedScroll(coordinatorLayout, child, target, dxConsumed,  dyConsumed, dxUnconsumed, dyUnconsumed);

    if (dyConsumed > 0 && child.getVisibility() == View.VISIBLE) {
        child.hide();
    } else if (dyConsumed < 0 && child.getVisibility() != View.VISIBLE) {
        child.show();
    }
 }
}
like image 188
mfaisalhyder Avatar answered Oct 11 '22 14:10

mfaisalhyder


I had the same problem, i tried to add a ScrollView inside my root view but it did not works because the content doesn't exceed the display's height (the fab react as expected in that case).

So i tried android:windowSoftInputMode="adjustResize" and it works for me.

For informations here's what my layout xml looks like:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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">

    <ManyViewsExceptScrollViews/>

    <android.support.design.widget.FloatingActionButton
        [..]
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"/>

</RelativeLayout>

it's a Fragment inflated in an activity (in a FrameLayout that match_parent the root view) for which i added android:windowSoftInputMode="adjustResize" in the manifest.

like image 20
Mino Avatar answered Oct 11 '22 15:10

Mino