虽然现在手机屏幕越来越大,但一个简洁的界面也受很都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了)
好了本博就结束了,以前都是扣人家的代码。这次分享下自己的技术,有什么问题欢提问。