【问题标题】:How to hide/show Bottom Navigation View during webview Scroll如何在 webview 滚动期间隐藏/显示底部导航视图
【发布时间】:2020-02-21 04:15:40
【问题描述】:

我有一个 BottomNavigationView 活动。因为我放置了一个 webview 作为片段,但问题是,由于我的 BottomNavigationView,用户无法点击底部的 web 内容,有没有人建议我一个好的解决方案

这是我的 activity_main.xml

<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.hackerinside.jaisonjoseph.polysocial.MainActivity">

<FrameLayout
    android:id="@+id/content"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:background="@android:color/holo_blue_dark">

    <TextView
        android:id="@+id/message"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="@dimen/activity_vertical_margin"
        android:layout_marginLeft="@dimen/activity_horizontal_margin"
        android:layout_marginRight="@dimen/activity_horizontal_margin"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        />

</FrameLayout>


<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="?android:attr/windowBackground"
    android:layout_alignParentBottom="true"
    app:menu="@menu/navigation" />

这是我的 webview 片段

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.hackerinside.jaisonjoseph.polysocial.tab1">


<FrameLayout
    android:id="@+id/frame1"
    android:layout_width="match_parent"
    android:layout_height="3dp"
    android:background="@android:color/transparent">


    <ProgressBar
        android:id="@+id/progressBar1"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="fill_parent"
        android:layout_height="3dp"
        android:background="@android:color/transparent"
       android:foregroundGravity="top"
        android:progressDrawable="@drawable/custom_progress"
        android:progress="20"/>

</FrameLayout>


<android.support.v4.widget.SwipeRefreshLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/swiperefresh1"
    android:layout_width="match_parent"
    android:layout_height="match_parent">






    <com.hackerinside.jaisonjoseph.polysocial.EulaWebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webview"
        android:focusable="true"
        android:focusableInTouchMode="true" />



</android.support.v4.widget.SwipeRefreshLayout>

【问题讨论】:

    标签: android webview bottomnavigationview


    【解决方案1】:

    BottomNavigationView 尝试自定义滚动行为,它允许您在滚动期间隐藏它。

    来自Link

     public final class BottomNavigationBehavior<V extends View> extends VerticalScrollingBehavior<V> {
        private static final Interpolator INTERPOLATOR = new LinearOutSlowInInterpolator();
        private final BottomNavigationWithSnackbar mWithSnackBarImpl = Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP ? new LollipopBottomNavWithSnackBarImpl() : new PreLollipopBottomNavWithSnackBarImpl();
        private boolean isTablet;
        private int mTabLayoutId;
        private boolean hidden = false;
        private ViewPropertyAnimatorCompat mOffsetValueAnimator;
        private ViewGroup mTabLayout;
        private View mTabsHolder;
        private int mSnackbarHeight = -1;
        private boolean scrollingEnabled = true;
        private boolean hideAlongSnackbar = false;
        int[] attrsArray = new int[] {
                android.R.attr.id };
        public BottomNavigationBehavior() {
            super();
        }
    
        public BottomNavigationBehavior(Context context, AttributeSet attrs) {
            super(context, attrs);
            TypedArray a = context.obtainStyledAttributes(attrs,
                    attrsArray);
            mTabLayoutId = a.getResourceId(0, View.NO_ID);
            a.recycle();
        }
    
        public static <V extends View> BottomNavigationBehavior<V> from(@NonNull V view) {
            ViewGroup.LayoutParams params = view.getLayoutParams();
            if (!(params instanceof CoordinatorLayout.LayoutParams)) {
                throw new IllegalArgumentException("The view is not a child of CoordinatorLayout");
            }
            CoordinatorLayout.Behavior behavior = ((CoordinatorLayout.LayoutParams) params)
                    .getBehavior();
            if (!(behavior instanceof BottomNavigationBehavior)) {
                throw new IllegalArgumentException(
                        "The view is not associated with BottomNavigationBehavior");
            }
            return (BottomNavigationBehavior<V>) behavior;
        }
    
        @Override
        public boolean layoutDependsOn(CoordinatorLayout parent, V child, View dependency) {
            mWithSnackBarImpl.updateSnackbar(parent, dependency, child);
            return dependency instanceof Snackbar.SnackbarLayout;
        }
    
        @Override
        public void onDependentViewRemoved(CoordinatorLayout parent, V child, View dependency) {
            updateScrollingForSnackbar(dependency, child, true);
            super.onDependentViewRemoved(parent, child, dependency);
        }
    
        private void updateScrollingForSnackbar(View dependency, V child, boolean enabled) {
            if (!isTablet && dependency instanceof Snackbar.SnackbarLayout) {
                scrollingEnabled = enabled;
                if (!hideAlongSnackbar && ViewCompat.getTranslationY(child) != 0) {
                    ViewCompat.setTranslationY(child, 0);
                    hidden = false;
                    hideAlongSnackbar = true;
                }else if(hideAlongSnackbar){
                    hidden = true;
                    animateOffset(child, -child.getHeight());
                }
            }
        }
    
        @Override
        public boolean onDependentViewChanged(CoordinatorLayout parent, V child, View dependency) {
            updateScrollingForSnackbar(dependency, child, false);
            return super.onDependentViewChanged(parent, child, dependency);
        }
    
        @Override
        public boolean onLayoutChild(CoordinatorLayout parent, V child, int layoutDirection) {
            boolean layoutChild = super.onLayoutChild(parent, child, layoutDirection);
            if (mTabLayout == null && mTabLayoutId != View.NO_ID) {
                mTabLayout = findTabLayout(child);
                getTabsHolder();
            }
    
            return layoutChild;
        }
    
        @Nullable
        private ViewGroup findTabLayout(@NonNull View child) {
            if (mTabLayoutId == 0) return null;
            return (ViewGroup) child.findViewById(mTabLayoutId);
        }
    
        @Override
        public void onNestedVerticalOverScroll(CoordinatorLayout coordinatorLayout, V child, @ScrollDirection int direction, int currentOverScroll, int totalOverScroll) {
        }
    
        @Override
        public void onDirectionNestedPreScroll(CoordinatorLayout coordinatorLayout, V child, View target, int dx, int dy, int[] consumed, @ScrollDirection int scrollDirection) {
            handleDirection(child, scrollDirection);
        }
    
        private void handleDirection(V child, @ScrollDirection int scrollDirection) {
            if (!scrollingEnabled) return;
            if (scrollDirection == ScrollDirection.SCROLL_DIRECTION_DOWN && hidden) {
                hidden = false;
                animateOffset(child, 0);
            } else if (scrollDirection == ScrollDirection.SCROLL_DIRECTION_UP && !hidden) {
                hidden = true;
                animateOffset(child, child.getHeight());
            }
        }
    
        @Override
        protected boolean onNestedDirectionFling(CoordinatorLayout coordinatorLayout, V child, View target, float velocityX, float velocityY, @ScrollDirection int scrollDirection) {
            handleDirection(child, scrollDirection);
            return true;
        }
    
        private void animateOffset(final V child, final int offset) {
            ensureOrCancelAnimator(child);
            mOffsetValueAnimator.translationY(offset).start();
            animateTabsHolder(offset);
        }
    
        private void animateTabsHolder(int offset) {
            if (mTabsHolder != null) {
                offset = offset > 0 ? 0 : 1;
                ViewCompat.animate(mTabsHolder).alpha(offset).setDuration(200).start();
            }
        }
    
        private void ensureOrCancelAnimator(V child) {
            if (mOffsetValueAnimator == null) {
                mOffsetValueAnimator = ViewCompat.animate(child);
                mOffsetValueAnimator.setDuration(100);
                mOffsetValueAnimator.setInterpolator(INTERPOLATOR);
            } else {
                mOffsetValueAnimator.cancel();
            }
        }
    
        private void getTabsHolder() {
            if (mTabLayout != null) {
                mTabsHolder = mTabLayout.getChildAt(0);
            }
        }
    
        public boolean isScrollingEnabled() {
            return scrollingEnabled;
        }
    
        public void setScrollingEnabled(boolean scrollingEnabled) {
            this.scrollingEnabled = scrollingEnabled;
        }
    
        public void setHidden(V view, boolean bottomLayoutHidden) {
            if (!bottomLayoutHidden && hidden) {
                animateOffset(view, 0);
            } else if (bottomLayoutHidden && !hidden) {
                animateOffset(view, -view.getHeight());
            }
            hidden = bottomLayoutHidden;
        }
    
        private interface BottomNavigationWithSnackbar {
            void updateSnackbar(CoordinatorLayout parent, View dependency, View child);
        }
    
        private class PreLollipopBottomNavWithSnackBarImpl implements BottomNavigationWithSnackbar {
    
            @Override
            public void updateSnackbar(CoordinatorLayout parent, View dependency, View child) {
                if (!isTablet && dependency instanceof Snackbar.SnackbarLayout) {
                    if (mSnackbarHeight == -1) {
                        mSnackbarHeight = dependency.getHeight();
                    }
    
                    int targetPadding = child.getMeasuredHeight();
    
                    int shadow = (int) ViewCompat.getElevation(child);
                    ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) dependency.getLayoutParams();
                    layoutParams.bottomMargin = targetPadding - shadow;
                    child.bringToFront();
                    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) {
                        child.getParent().requestLayout();
                        ((View) child.getParent()).invalidate();
                    }
    
                }
            }
        }
    
        private class LollipopBottomNavWithSnackBarImpl implements BottomNavigationWithSnackbar {
    
            @Override
            public void updateSnackbar(CoordinatorLayout parent, View dependency, View child) {
                if (!isTablet && dependency instanceof Snackbar.SnackbarLayout) {
                    if (mSnackbarHeight == -1) {
                        mSnackbarHeight = dependency.getHeight();
                    }
                    int targetPadding = (mSnackbarHeight +
                            child.getMeasuredHeight());
                    dependency.setPadding(dependency.getPaddingLeft(),
                            dependency.getPaddingTop(), dependency.getPaddingRight(), targetPadding
                    );
                }
            }
        }
    }
    

    在你的视图中应用它:

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_gravity="bottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        app:itemBackground="@color/colorPrimary"
        app:itemIconTint="@color/white"
        app:itemTextColor="@color/white"
        app:layout_behavior=".BottomNavigationBehavior"  //apply the behaviour
        app:menu="@menu/bottom_navigation_main" />
    

    输出:

    【讨论】:

    • 它不起作用兄弟,添加您的代码后,它就消失了,导航
    • 你没有添加Framelayout...你没有用你的webview片段替换Framelayout...?
    • 因为我不想要框架布局内的文本视图
    • 或者我应该添加框架布局??
    • 您可以删除框架布局内的文本视图...这就是为什么我问您是否将框架布局替换为您的网络视图...
    【解决方案2】:

    如此简单,使用CoordinatorLayout


    1.将根视图更改为 CoordinatorLayout

    • 记得在gradle文件中添加依赖:

      implementation 'com.google.android.material:material:1.1.0'
      

    2。将内容视图包装到 NestedScrollView

    <androidx.core.widget.NestedScrollView                  //or use ScrollView with "android:nestedScrollingEnabled="true"", see below
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true">
    
        <WebView
            android:id="@+id/webView_webView"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    
    </androidx.core.widget.NestedScrollView>
    

    3。将“layout_behavior”添加到您的底视图

    app:layout_behavior="com.google.android.material.behavior.HideBottomViewOnScrollBehavior">
    

    【讨论】:

    • 不建议在滚动视图中使用
    • @Anil Ugale 你能解释一下为什么吗?至少对我有用。
    • WebView 在 Web 端使用 Ifrom 时出现横向滚动错误提示
    猜你喜欢
    • 2017-11-30
    • 1970-01-01
    • 2019-12-25
    • 1970-01-01
    • 2021-04-27
    • 1970-01-01
    • 1970-01-01
    • 2021-07-25
    • 1970-01-01
    相关资源
    最近更新 更多