阅读页面
首先从布局开始吧,阅读界面采用了RelativeLayout布局方式,目的是有一个菜单键一直在屏幕下方,方便用户触摸操作。
下面就逐步讲解一下屏幕下部分页面布局的代码:
<?xml version="1.0" encoding="utf-8"?><relativelayout xmlns:android="http://schemas.android.com/apk/res/android" androidrientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#FFdbdbdb">
设置全屏和背景色
<webview android:id="@+id/webkit" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#FFdbdbdb"></webview>
全屏的WebView控件,即浏览器控件,同样设置了背景色。
<button android:layout_width="wrap_content" android:id="@+id/Button01" android:layout_centerhorizontal="true" android:layout_centerinparent="true" android:layout_alignparentright="false" android:layout_alignwithparentifmissing="true" android:layout_height="wrap_content" android:layout_alignbottom="@layout/main" android:text="菜单"> </button>
菜单键的设置,layout_centerHorizontal layout_alignParentRight layout_alignWithParentIfMissing 的设置,就保证菜单键一直出现在中间,android:layout_alignBottom="@layout/main"设定了菜单键在页面最底部。
<button android:layout_width="wrap_content" android:id="@+id/ButtonUp" android:layout_centerhorizontal="true" android:layout_centerinparent="false" android:layout_alignparentleft="true" android:layout_alignwithparentifmissing="true" android:layout_height="wrap_content" android:layout_alignbottom="@layout/main" android:text="上一页"> </button> <button android:layout_width="wrap_content" android:id="@+id/ButtonDown" android:layout_centerhorizontal="true" android:layout_centerinparent="false" android:layout_alignparentright="true" android:layout_alignwithparentifmissing="true" android:layout_height="wrap_content" android:layout_alignbottom="@layout/main" android:text="下一页"> </button> </relativelayout>
类似的一左一右的设置了上下页按键。
到这里阅读页面就已经准备好了。
RelativeLayout布局的优点就是能够把你需要的button布局在屏幕的相对位置上,适合于不同屏幕大小的手机采用统一代码操作,减轻了移植带来的负担。这里只布局在了屏幕的正下方,同样也可布局在屏幕中央,最上方等位置。
编辑本段 回目录webView控件基本使用
浏览器控件即webView,下面谈谈如何设置和监控webView控件:webView是j2me所没有的,是类似于Symbian和.net CF 里面功能类似的浏览器控件,通过这个控件可以直接访问网页,或者把输入的HTML字符串显示出来,功能比较强大,同Symbian或.net CF 浏览器控件比起来有以下几个优点:
1、功能强大,支持CSS,Java script等HTML语言,这样页面就能更漂亮。
2、能够对浏览器控件进行非常详细的设置,比如字体大小,背景色,滚动条样式,等等。
3、能够捕捉到所有浏览器操作,比如点击URL,打开或关闭URL
4、能够很好的融入布局。
5、甚至webView还能和JS进行交互。
在使用webView布局的页面后,我们首先取得webView实例,browser就是webView的对象:
browser=(WebView)findViewById(R.id.webkit);
取得实例后,我们给browser定义下WebSettings,WebSettings是WebView的具体设置类,可以对WebView进行非常详细的设置。
WebSettings bs = browser.getSettings();
取得了webView设置对象。下面开始设置浏览器控件
举例几个最常用的设置
bs.setSupportMultipleWindows(false);
浏览器不支持多窗口显示,意思就是说所有页面在单一窗口打开,这样避免了页面布局控制显示问题,也便于操作控制页面。
bs.setSupportZoom(false);
页面是否可以进行缩放。
bs.setBlockNetworkImage(false)
是否阻止图像的显示
bs.setCacheMode()
缓存的模式,分为几种LOAD_CACHE_ELSE_NETWORK(当本地没有缓存时,从网上下载)
LOAD_CACHE_ONLY 只读取本地缓存
LOAD_DEFAULT默认的缓存模式
LOAD_NORMAL一般的缓存模式
LOAD_NO_CACHE不读取缓存,所有内容均从网络下载
bs.setJavaScriptEnabled(flag)
是否支持JS
其他比如设置字体等更不必详说。通过设置,我们可以获得一个我们需要的浏览器窗口。
另外一方面,我们还设置了一个类叫webNotify 这个类继承自WebViewClient,用来监控浏览器的一系列事件。
webNotify wn = new webNotify(); browser.setWebViewClient(wn) ;
下面列举了比较常用的4个事件
1,接收到Http请求的事件
onReceivedHttpAuthRequest(WebView view, HttpAuthHandler handler, String host, String realm)
2,打开链接前的事件
public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; }
这个函数我们可以做很多操作,比如我们读取到某些特殊的URL,于是就可以不打开地址,取消这个操作,进行预先定义的其他操作,这对一个程序是非常必要的。
3,载入页面完成的事件
public void onPageFinished(WebView view, String url){ }
同样道理,我们知道一个页面载入完成,于是我们可以关闭loading条,切换程序动作。
4,载入页面开始的事件
public void onPageStarted(WebView view, String url, Bitmap favicon) { }
这个事件就是开始载入页面调用的,通常我们可以在这设定一个loading的页面,告诉用户程序在等待网络响应。
通过这几个事件,我们可以很轻松的控制程序操作,一边用着浏览器显示内容,一边监控着用户操作实现我们需要的各种显示方式,同时可以防止用户产生误操作。
最后我们的浏览器设置好了,可以监控操作了,于是打开一个网址,
browser.loadUrl("http://www.baidu.com/");
当然也可以是自己设定的一段html字符串,当然你的URL腰符合规范。
browser.loadDataWithBaseURL()
编辑本段 回目录如何和JS进行交互
好了,到这里基本的webView的基本使用介绍完了。下面介绍下如何和JS进行交互,这个功能非常强大了,能够做出很多意想不到的事情。
首先我们在页面里有这么一段JS代码
<script language="javascript"> function wave() { document.getElementById("droid").src="android_waving.png"; } </script><a> <img id="droid" src="android_normal.png"><br> Click me! </a> function wave()就是我们要调用的函数。然后让browser和页面进行交互 bs.setJavaScriptEnabled(true); 首先让浏览器支持JS。 browser.addJavascriptInterface(new Object() { public void clickOnAndroid() { mHandler.post(new Runnable() { public void run() { mWebView.loadUrl("javascript:wave()"); } }); } }, "index");
这里的重点是addJavascriptInterface(Object obj,String interfaceName)方法,该方法将一个java对象绑定到一个javascript对象中,javascript对象名就是interfaceName,作用域是Global。这样初始化webview后,在webview加
载的页面中就可以直接通过javascript:window.demo访问到绑定的java对象了。
这样我们就能在自己的浏览器里实现html页面里面的js代码了,具体能实现什么功能这里就不做详细举例了,实用中你会发现,这个功能太强大了。
编辑本段 回目录View的触摸操作
最基本的在View里面 onTouchEvent,它主要实现的功能是Flip,主要原理就是按下的时候记录坐标(用到MotionEvent.ACTION_DOWN),然后滑动(MotionEvent.ACTION_MOVE),然后在抬起(MotionEvent.ACTION_UP),在抬起的时候在记录坐标,把按下的坐标和抬起的坐标做比较,这样就能判断出是左还是右了,然后作出相应的处理。一般情况下,我们执行程序操作时就在ACTION_UP时进行。
最基本的就是onTouchEvent,同时Android平台还给我们提供了更多彩的操作方式,我们需要android.view.GestureDetector
android.view.GestureDetector.SimpleOnGestureListener 这两个类
新建一个类继承SimpleOnGestureListener,HahaGestureDetectorListener
可以实现以下event事件。
boolean onDoubleTap(MotionEvent e)
解释:双击的第二下Touch down时触发
boolean onDoubleTapEvent(MotionEvent e)
解释:双击的第二下Touch down和up都会触发,可用e.getAction()区分。
boolean onDown(MotionEvent e)
解释:Touch down时触发
boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY)
解释:Touch了滑动一点距离后,up时触发。
void onLongPress(MotionEvent e)
解释:Touch了不移动一直Touch down时触发
boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY)
解释:Touch了滑动时触发。
void onShowPress(MotionEvent e)
解释:Touch了还没有滑动时触发
(与onDown,onLongPress比较
onDown只要Touch down一定立刻触发。
而Touchdown后过一会没有滑动先触发onShowPress再是onLongPress。
所以Touchdown后一直不滑动,onDown->onShowPress->onLongPress这个顺序触发。
boolean onSingleTapConfirmed(MotionEvent e)
boolean onSingleTapUp(MotionEvent e)
解释:上面这两个函数都是在touch down后又没有滑动(onScroll),又没有长按(onLongPress),然后Touchup时触发。
点击一下非常快的(不滑动)Touchup:
onDown->onSingleTapUp->onSingleTapConfirmed
点击一下稍微慢点的(不滑动)Touchup:
onDown->onShowPress->onSingleTapUp->onSingleTapConfirmed
有了这么多的响应方式,我们能更加方便的对用户的触摸操作进行响应,对各种动作都有所对应。那么这个类如何使用呢,其实非常简单,在view的新建一个GestureDetector的对象。
构造函数里
gestureDetector = new GestureDetector(new HahaGestureDetectorListener());
然后在View的onTouchEvent里以下这样用,就可以在gestureDetector的事件里写自己的代码了。
@Override
public boolean onTouchEvent(MotionEvent event)
{
gestureDetector.onTouchEvent(event);
}
这里简单介绍了webView和触摸方法的实现,希望对大家有一定帮助,创造出更加适合用户操作的程序来。