欢迎到我的博客 一杯刘 观看哦~爱你比心(*  ̄3)(ε ̄ *)
这两天做了个小项目,其中客户需求就是在 webview 中添加手势控制,比如说画个 L 返回上一级之类的,就像这样:
上图就是这次的 Demo 的效果
Talk is cheap,show me the code
GestureOverlayView 的使用
这东西就是本次的主角了,一个继承 FrameLayout 的 view,他可以接收你的手势,并通过监听接口判断出你所画的手势和预定的手势是否相同,直接上代码吧,在 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 包裹起来,让她感受男人的温暖,然后,在 MainActivity 中调用 initGestureOverlay()
// 我把全局变量拿出来方便大家看
private GestureOverlayView mGestureview;
private GestureLibrary mGestureLib;
private void initGestureOverlay() {
//从 raw 文件夹里取出我们预制的手势文件
mGestureLib = GestureManager.getInstance(getBaseContext()).getGestureLib();
//设置笔画为单笔,也就是一笔画
mGestureview.setGestureStrokeType(GestureOverlayView.GESTURE_STROKE_TYPE_SINGLE);
//画完笔画后到消失的间隔
mGestureview.setFadeOffset(0);
//笔画粗细
mGestureview.setGestureStrokeWidth(15);
//重点啊啊啊,设置 GestureOverlayView 不拦截触摸事件,
// 不设置的话,webview 是没法相应我们的滑动事件的
mGestureview.setEventsInterceptionEnabled(false);
//精髓接口,通过他我们可以判断用户的手势是不是我们想接收的手势
mGestureview.addOnGesturePerformedListener(new GestureOverlayView.OnGesturePerformedListener() {
@Override
public void onGesturePerformed(GestureOverlayView overlay,
Gesture gesture) {
//recognize()方法接收用户的手势,并返回手势库中和该手势相匹配的手势
ArrayList<Prediction> predictions = mGestureLib
.recognize(gesture);
if (predictions.size() > 0) {
//我们取最最相似的那个手势
//prediction 里面就是我们预制的 手势名称 和 相匹配的分值 两个变量
Prediction prediction = (Prediction) predictions.get(0);
//如果分数大于 1.0 并且 匹配出来的手势名称是我们预制的 “back” 字符串
if (prediction.score > 1.0 && prediction.name.equals("back")) {
if (mWebview.canGoBack()) {
//webview 回退上一级
mWebview.goBack();
} else {
Toast.makeText(MainActivity.this, "已经是首页啦", Toast.LENGTH_SHORT).show();
}
}
}
}
});
}
这样我们就能控制通过手势控制 webview 的返回啦,当然手势的监听在这里,你想干啥都行
修改手势
我不说话,就上图
恩,我们把 L 改成向右滑,其实改手势也没啥,就是把 raw 文件夹下的手势库文件更新一下就行
public void changeBackGesture(Gesture gesture){
mGestureLib.removeEntry("back");
mGestureLib.addGesture("back", gesture);
Toast.makeText(mContext, "成功了,快去试试吧", Toast.LENGTH_SHORT).show();
}
把我们改好的手势 Gesture 传进来,通过 GestureLibrary 修改一下就好了,那怎么获取这么手势呢?
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) {
}
});
我们通过这个 OnGestureListener() 接口来获取手势完成时的手势,传给刚才的方法就行了
手势库
说了半天,raw 下面的这个手势库是啥啊,恩,你记不记得
mGestureLib = GestureLibraries.fromRawResource(mContext, R.raw.gestures);
他制定了一个手势库的位置让 GestureLibraries 去加载,GestureLibraries 也可以从文件中获取
GestureLibraries.fromFile()
位置你可以自己指定,什么?你问我 Demo 里的 Gesture 文件怎么来的?我会告诉你我生成了一个放进 raw 里面的吗,啊哈哈哈哈...
更多的细节,建议直接看代码,注释很全,也方便复制粘贴...