歡迎到我的博客 一杯劉 觀看哦~愛(ài)你比心(* ￣3)(ε￣ *)
這兩天做了個(gè)小項(xiàng)目皂冰，其中客戶需求就是在 webview 中添加手勢(shì)控制闯团，比如說(shuō)畫(huà)個(gè) L 返回上一級(jí)之類的剃氧，就像這樣：
上圖就是這次的 Demo 的效果
Talk is cheap,show me the code
GestureOverlayView 的使用
這東西就是本次的主角了但指，一個(gè)繼承 FrameLayout 的 view静袖，他可以接收你的手勢(shì)觉鼻，并通過(guò)監(jiān)聽(tīng)接口判斷出你所畫(huà)的手勢(shì)和預(yù)定的手勢(shì)是否相同，直接上代碼吧队橙，在 XML 文件里 like this
<android.gesture.GestureOverlayView
android:id="@+id/gestureview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gestureColor="@color/colorAccent"
android:uncertainGestureColor="@color/colorPrimary">
<WebView
android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.gesture.GestureOverlayView>
我們把 WebView 包裹起來(lái)坠陈，讓她感受男人的溫暖，然后捐康，在 MainActivity 中調(diào)用 initGestureOverlay()
// 我把全局變量拿出來(lái)方便大家看
private GestureOverlayView mGestureview;
private GestureLibrary mGestureLib;
private void initGestureOverlay() {
//從 raw 文件夾里取出我們預(yù)制的手勢(shì)文件
mGestureLib = GestureManager.getInstance(getBaseContext()).getGestureLib();
//設(shè)置筆畫(huà)為單筆畅姊，也就是一筆畫(huà)
mGestureview.setGestureStrokeType(GestureOverlayView.GESTURE_STROKE_TYPE_SINGLE);
//畫(huà)完筆畫(huà)后到消失的間隔
mGestureview.setFadeOffset(0);
//筆畫(huà)粗細(xì)
mGestureview.setGestureStrokeWidth(15);
//重點(diǎn)啊啊啊，設(shè)置 GestureOverlayView 不攔截觸摸事件吹由，
// 不設(shè)置的話，webview 是沒(méi)法相應(yīng)我們的滑動(dòng)事件的
mGestureview.setEventsInterceptionEnabled(false);
//精髓接口朱嘴，通過(guò)他我們可以判斷用戶的手勢(shì)是不是我們想接收的手勢(shì)
mGestureview.addOnGesturePerformedListener(new GestureOverlayView.OnGesturePerformedListener() {
@Override
public void onGesturePerformed(GestureOverlayView overlay,
Gesture gesture) {
//recognize()方法接收用戶的手勢(shì)倾鲫，并返回手勢(shì)庫(kù)中和該手勢(shì)相匹配的手勢(shì)
ArrayList<Prediction> predictions = mGestureLib
.recognize(gesture);
if (predictions.size() > 0) {
//我們?nèi)∽钭钕嗨频哪莻€(gè)手勢(shì)
//prediction 里面就是我們預(yù)制的 手勢(shì)名稱 和 相匹配的分值 兩個(gè)變量
Prediction prediction = (Prediction) predictions.get(0);
//如果分?jǐn)?shù)大于 1.0 并且 匹配出來(lái)的手勢(shì)名稱是我們預(yù)制的 “back” 字符串
if (prediction.score > 1.0 && prediction.name.equals("back")) {
if (mWebview.canGoBack()) {
//webview 回退上一級(jí)
mWebview.goBack();
} else {
Toast.makeText(MainActivity.this, "已經(jīng)是首頁(yè)啦", Toast.LENGTH_SHORT).show();
}
}
}
}
});
}
這樣我們就能控制通過(guò)手勢(shì)控制 webview 的返回啦，當(dāng)然手勢(shì)的監(jiān)聽(tīng)在這里萍嬉，你想干啥都行
修改手勢(shì)
我不說(shuō)話乌昔，就上圖
恩，我們把 L 改成向右滑壤追，其實(shí)改手勢(shì)也沒(méi)啥磕道，就是把 raw 文件夾下的手勢(shì)庫(kù)文件更新一下就行
public void changeBackGesture(Gesture gesture){
mGestureLib.removeEntry("back");
mGestureLib.addGesture("back", gesture);
Toast.makeText(mContext, "成功了，快去試試吧", Toast.LENGTH_SHORT).show();
}
把我們改好的手勢(shì) Gesture 傳進(jìn)來(lái)行冰，通過(guò) GestureLibrary 修改一下就好了溺蕉，那怎么獲取這么手勢(shì)呢？
mEditoverlay.addOnGestureListener(new GestureOverlayView.OnGestureListener() {
@Override
public void onGestureStarted(GestureOverlayView overlay, MotionEvent event) {
}
@Override
public void onGesture(GestureOverlayView overlay, MotionEvent event) {
}
@Override
public void onGestureEnded(GestureOverlayView overlay, MotionEvent event) {
mGesture = overlay.getGesture();
}
@Override
public void onGestureCancelled(GestureOverlayView overlay, MotionEvent event) {
}
});
我們通過(guò)這個(gè) OnGestureListener() 接口來(lái)獲取手勢(shì)完成時(shí)的手勢(shì)悼做，傳給剛才的方法就行了
手勢(shì)庫(kù)
說(shuō)了半天疯特，raw 下面的這個(gè)手勢(shì)庫(kù)是啥啊，恩肛走，你記不記得
mGestureLib = GestureLibraries.fromRawResource(mContext, R.raw.gestures);
他制定了一個(gè)手勢(shì)庫(kù)的位置讓 GestureLibraries 去加載漓雅，GestureLibraries 也可以從文件中獲取
GestureLibraries.fromFile()
位置你可以自己指定，什么朽色？你問(wèn)我 Demo 里的 Gesture 文件怎么來(lái)的邻吞？我會(huì)告訴你我生成了一個(gè)放進(jìn) raw 里面的嗎，啊哈哈哈哈...
更多的細(xì)節(jié)葫男，建議直接看代碼抱冷，注釋很全，也方便復(fù)制粘貼...
