Toolbar在WebView滚动下的显示和隐藏的实现

大家都是视觉党，看看是否是你要的实现效果！！效果图如下

要实现这种效果，首先要导入向下兼容的包，然后在利用Google原生的组件即可实现你需要的效果！！在以前的谷歌大会上，Google升级了新的Support Library，有各种效果能支持到2.3.3支持了很多特殊的效果，摘自Android应用Design Support Library完全使用实例

• 要在build.gradle加入想对应的依赖库，我这里是用的gradle 2.10 编译版本为基础

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:23.2.1'
    compile 'com.android.support:design:23.2.0'
}

如果与我的编译版本不通过， compile ‘com.android.support:design:23.2.0’可能会提示你更改依赖，跟着系统提示走就可以了

在xml里边的布局，利用CoordinatorLayout，AppBarLayout，AppBarLayout来实现你想要的效果，如果不清楚的上边的三个布局，可以参考上边的链接，布局代码如下

<?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:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolBar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:contentInsetEnd="0dp"
            app:contentInsetLeft="0dp"
            app:contentInsetRight="0dp"
            app:contentInsetStart="0dp"
            app:layout_scrollFlags="scroll|enterAlways">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerInParent="true"
                    android:text="ToolBar" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_alignParentRight="true"
                    android:layout_marginRight="10dp"
                    android:onClick="share"
                    android:text="分享" />

            </RelativeLayout>
        </android.support.v7.widget.Toolbar>

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <WebView
                android:id="@+id/webview"
                android:layout_width="match_parent"
                android:layout_height="match_parent"></WebView>
        </LinearLayout>
    </android.support.v4.widget.AppBarLayout>


</android.support.design.widget.CoordinatorLayout>

因为toolbar可以能出现左边一块，原来的布局这里解决办法为ToolBar添加这四个属性

            app:contentInsetEnd="0dp"
            app:contentInsetLeft="0dp"
            app:contentInsetRight="0dp"
            app:contentInsetStart="0dp"

然后我们开始看一下Activity里边的代码如何设置的，其中注意的就是ToolBar的导包问题，AS默认导入的是app下边的ToolBar，我们要导入的是import android.support.v7.widget.Toolbar ，不然会报错的，代码如下

/**
 * 此工程是Android Studio 2.0建立的 需要gradle2.10才可以
 */
public class MainActivity extends AppCompatActivity {
    private CoordinatorLayout mainContent;
    private AppBarLayout appbar;
    private Toolbar toolBar;
    private WebView webview;
    private long exitTime = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initWebView();
    }

    /**
     * 初始化布局
     */
    private void initView() {
        mainContent = (CoordinatorLayout) findViewById(R.id.main_content);
        appbar = (AppBarLayout) findViewById(R.id.appbar);
        toolBar = (Toolbar) findViewById(R.id.toolBar);
        webview = (WebView) findViewById(R.id.webview);


    }

    /**
     * 初始化WebView的配置
     */
    private void initWebView() {
        webview.setWebViewClient(new WebViewClient() {
            //设置在webView点击打开的新网页在当前界面显示,而不跳转到新的浏览器中
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });
        //设置WebView属性,运行执行js脚本
        webview.getSettings().setJavaScriptEnabled(true);
        //调用loadView方法为WebView加入链接
        webview.loadUrl("http://blog.csdn.net/y1258429182/article/details/50876736");
    }

    public void share(View view) {
        Toast.makeText(MainActivity.this, "分享", Toast.LENGTH_SHORT).show();
    }

    /**
     * 我们需要重写回退按钮的时间,当用户点击回退按钮：
     * 1.webView.canGoBack()判断网页是否能后退,可以则goback()
     * 2.如果不可以连续点击两次退出App,否则弹出提示Toast
     */
    @Override
    public void onBackPressed() {
        if (webview.canGoBack()) {
            webview.goBack();
        } else {
            if ((System.currentTimeMillis() - exitTime) > 2000) {
                Toast.makeText(getApplicationContext(), "再按一次退出程序",
                        Toast.LENGTH_SHORT).show();
                exitTime = System.currentTimeMillis();
            } else {
                super.onBackPressed();
            }

        }
    }
}

到此为止，你要的效果就能实现了，这里放上GitHub的地址，如果对你有帮助，可以star我哟！！再次不胜感激！！
GitHub源码链接