现在的位置: 首页 > 综合 > 正文

Android WebView 滚动方向判断同时底部导航栏隐藏或显示(动画效果)

2018年04月28日 ⁄ 综合 ⁄ 共 6398字 ⁄ 字号 评论关闭

虽然现在手机屏幕越来越大,但一个简洁的界面也受很都app所追求。今天的案例是:ScrollView 或WebView 下拉滚动时隐藏底部导航栏让整个app界面更清爽简洁大笑

其中用到的技术也只是监听屏幕滑动方向和滑动顶部和底部的判断而已还有就是动画效果--------废话不多少,直接上源码奋斗

布局文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    
    <Button 
        android:id="@+id/top_bar_"
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:text="toptoptoptotptoptop"
        />
    
    
    <com.example.view.MyWebView
        android:id="@+id/scrollview_"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        >
        <!-- 
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="a\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na\na"
            android:paddingBottom="70dp"
            /> -->
        
    </com.example.view.MyWebView>
    
    
    <Button 
        android:id="@+id/bottom_bar_"
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:text="bottombottombottombottombottom"
        />
    

</LinearLayout>

主要的Activity   ScrollHideBottomActivity:

package com.example.demo;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.view.animation.Animation.AnimationListener;

import com.example.view.MyWebView;
import com.example.view.MyWebView.OnScrollListener;

public class ScrollHideBottomActivity extends Activity implements OnScrollListener {

	private MyWebView scrollview_;
	boolean change = true;	
	private View bottom_bar_;
	private View top_bar_;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		
		super.onCreate(savedInstanceState);
		
		setContentView(R.layout.scrollhide_bottom_layout);
		initViews();
		initListener();
	}

	private void initListener() {
		scrollview_.setmOnScrollListener(this);
		
	}

	private void initViews() {
		scrollview_ = (MyWebView) findViewById(R.id.scrollview_);
		bottom_bar_ =  findViewById(R.id.bottom_bar_);
		top_bar_ =  findViewById(R.id.top_bar_);
<span style="white-space:pre">		</span>//我是加载本地的html,也可以加载网上的url(公司的wifi太他妈坑爹了,经常掉线)
		scrollview_.loadUrl("file:///android_asset/html/testweb.html");
	}
	
	@Override
	public void showOrHide(boolean show,boolean end) {
		
		if(change!=show)
		if(!show){
			bottom_bar_.setVisibility(View.INVISIBLE);
			initViewAnimation(bottom_bar_,false,false);
			
			//顶部显示
//			top_bar_.setVisibility(View.VISIBLE);
//			ConstantUtils.initViewAnimation1(top_bar_,true,true);
			
		}else{
			bottom_bar_.setVisibility(View.VISIBLE);
			initViewAnimation(bottom_bar_,true,false);
			
			//顶部隐藏
//			top_bar_.setVisibility(View.INVISIBLE);
//			ConstantUtils.initViewAnimation1(top_bar_,false,true);
			if(end){
//				RelativeLayout.LayoutParams lp = (android.widget.RelativeLayout.LayoutParams) scrollview_.getLayoutParams();
//				lp.setMargins(0, 0, 0, bottom_bar_.getHeight());
//				scrollview_.setPadding(0, 0, 0, bottom_bar_.getHeight());
				
			}
		}
		
		change = show;
		
		
	}

	@Override
	public void onScrolled(int l, int t, int oldl, int oldt) {
		
		//WebView的总高度
        float webViewContentHeight=scrollview_.getContentHeight() * scrollview_.getScale();
        //WebView的现高度
        float webViewCurrentHeight=(scrollview_.getHeight() + scrollview_.getScrollY());
        System.out.println("webViewContentHeight="+webViewContentHeight);
        System.out.println("webViewCurrentHeight="+webViewCurrentHeight);
        if ((webViewContentHeight-webViewCurrentHeight) <10) {
            System.out.println("WebView滑动到了底端");
            bottom_bar_.setVisibility(View.VISIBLE);
			initViewAnimation(bottom_bar_,true,false);
        }else if(scrollview_.getScrollY()==0){
        	
        	top_bar_.setVisibility(View.VISIBLE);
        	initViewAnimation(top_bar_,true,true);
        	
        }
	}
	
	//该方法可以封装到工具类里
	public static void initViewAnimation(final View showView ,boolean isshow,boolean istop){
		
		float[] up2down;
		
		float[] down2up ;
		
		if(istop){
			up2down= new float[]{-1f,0f};
			down2up = new float[]{0f,-1f};
			
		}else{
			up2down= new float[]{0f,1f};
			down2up = new float[]{1f,0f};
		}
		
         if(isshow){
        	 TranslateAnimation mShowAction = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,   
                     Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,   
                     down2up[0], Animation.RELATIVE_TO_SELF, down2up[1]);   
             mShowAction.setDuration(500); 
             showView.clearAnimation();
             showView.startAnimation(mShowAction);
         }else{
        	 TranslateAnimation mHiddenAction = new TranslateAnimation(Animation.RELATIVE_TO_SELF,   
                     0.0f, Animation.RELATIVE_TO_SELF, 0.0f,   
                     Animation.RELATIVE_TO_SELF, up2down[0], Animation.RELATIVE_TO_SELF,up2down[1]);  
             mHiddenAction.setDuration(500);
             mHiddenAction.setAnimationListener(new AnimationListener() {
    			
    			@Override
    			public void onAnimationStart(Animation animation) {
    			}
    			
    			@Override
    			public void onAnimationRepeat(Animation animation) {
    			}
    			@Override
    			public void onAnimationEnd(Animation animation) {
    				showView.setVisibility(View.GONE);
    				showView.invalidate();
    			}
    		});
             
             showView.clearAnimation();
             showView.startAnimation(mHiddenAction);
         }
	}
	
	
}

重写的webview(如果是Scrollview的话也可以 ):

package com.example.view;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.webkit.WebView;

public class MyWebView extends WebView {
	private OnScrollListener mOnScrollListener;
	
	private int lastScrollY;

	public MyWebView(Context context) {
		super(context);
	}

	public MyWebView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}

	public MyWebView(Context context, AttributeSet attrs) {
		super(context, attrs);
	}
	
	
	
	@Override
	public boolean onTouchEvent(MotionEvent ev) {
		
        switch(ev.getAction()){  
        
        case MotionEvent.ACTION_DOWN:  
        	
        	lastScrollY = this.getScrollY();
        	
        case MotionEvent.ACTION_MOVE:  
        	
        	if(Math.abs(lastScrollY - this.getScrollY())>10){
        		boolean show =true;
        		if(lastScrollY>this.getScrollY())//向上拉
        		{
        			show = true;
        		}else//向下拉
        		{
        			show = false;
        		}
        		mOnScrollListener.showOrHide(show,false);
        		
        		
        		lastScrollY = this.getScrollY();
        	}
        	
        	
        case MotionEvent.ACTION_UP:  
            break;  
        }  
	        
		return super.onTouchEvent(ev);
	}

	public OnScrollListener getmOnScrollListener() {
		return mOnScrollListener;
	}

	public void setmOnScrollListener(OnScrollListener mOnScrollListener) {
		this.mOnScrollListener = mOnScrollListener;
	}


	@Override
	protected void onScrollChanged(int l, int t, int oldl, int oldt) {
		
		super.onScrollChanged(l, t, oldl, oldt);
		if(mOnScrollListener!=null){
			mOnScrollListener.onScrolled(l, t, oldl, oldt);
		}
		
	};

	public interface OnScrollListener{
		
		 
		 public void showOrHide(boolean show,boolean end);
		 
		 public void onScrolled(int l, int t, int oldl, int oldt);
		 
	}
	
}

Over !每次在浏览器的CSDN编辑器里改完就习惯性的按上Ctrl+S 结果经常弹出保存窗口(用惯Eclipse了)

好了本博就结束了,以前都是扣人家的代码。这次分享下自己的技术,有什么问题欢提问。

抱歉!评论已关闭.