首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在触摸浮动按钮时停止flutter_ WebView的WebView的触摸响应

在Flutter中停止WebView的触摸响应,可以通过以下步骤实现:

  1. 导入所需的包:
代码语言:txt
复制
import 'package:flutter/gestures.dart';
  1. 创建一个自定义的WebView Widget,并继承自flutter_webview插件提供的WebView Widget:
代码语言:txt
复制
import 'package:flutter_webview/flutter_webview.dart';

class CustomWebView extends WebView {
  CustomWebView({
    Key key,
    initialUrl,
    ...
  }) : super(
          key: key,
          initialUrl: initialUrl,
          ...
        );
}
  1. 在CustomWebView中重写createHitTestable方法,返回一个自定义的GestureRecognizer:
代码语言:txt
复制
class CustomWebView extends WebView {
  ...
  
  @override
  createHitTestable() {
    return CustomWebViewGestureRecognizer();
  }
}
  1. 创建一个自定义的GestureRecognizer,并继承自OneSequenceGestureRecognizer:
代码语言:txt
复制
class CustomWebViewGestureRecognizer extends OneSequenceGestureRecognizer {
  @override
  void addAllowedPointer(PointerEvent event) {
    // 在此处判断是否触摸到了浮动按钮,如果是,则不允许继续传递事件给WebView
    // 可以通过判断触摸点的位置和浮动按钮的位置关系来实现
    if (isTouchingFloatingButton(event.position)) {
      stopTrackingPointer(event.pointer);
    } else {
      super.addAllowedPointer(event);
    }
  }

  @override
  void handleEvent(PointerEvent event) {
    // 不处理任何事件
  }

  @override
  String get debugDescription => 'CustomWebViewGestureRecognizer';
}
  1. 在使用WebView的地方,替换为CustomWebView:
代码语言:txt
复制
CustomWebView(
  initialUrl: 'https://example.com',
  ...
)

通过以上步骤,当触摸到浮动按钮时,WebView将不再响应触摸事件,从而实现停止WebView的触摸响应。

注意:以上代码仅为示例,实际使用时需要根据具体情况进行适当的修改和调整。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Mac高效-自定义悬浮菜单

下面介绍如何解决快速切换应用难点: 设置自定义操作菜单栏 上一篇介绍了两种解决办法 为特定应用定义快捷键 这种方式缺点是需要自己记住每个应用快捷键,操作必须是快捷键触发,如果是单手操作电脑就比较不方便...一键启动下班流程: 下班不想关应用,这样第二天上班前一天工作现场得以保存,能更快进入工作状态,但是时间久了电脑会负荷重,你不得不关机重启一下,这时候你工作现场因此被破坏,怎样解决这个问题呢?...这里主要使用BTT强大触摸板手势,再配合显示浮动WebView操作实现单手方便快捷切换应用和其它任何你想要操作 任何地方快速唤起菜单栏 这里设置了双击触摸板唤起菜单栏,还定义了一个快捷键唤起菜单栏...,具体菜单栏就是一个HTML文件: 实现每个菜单栏选项action 这里我大概分为了三类,第一类是直接打开应用,相对简单;第二类是通过脚本触发KM宏;第三类是触发另外一个浮动WebView...;下面简单介绍一下 1、 直接打开应用 这里选择是其他触发,红框部分就是对应命名触发 2、 脚本触发KM宏 3、触发另外一个浮动WebView 这里主要是显示日历窗口,当然你也可以做其他显示

1.8K20

WPF 使用 Edge 浏览器

; } 优点 触摸非常流畅 加载页面非常快 缩放页面几乎不使用CPU 对于很多图片时候使用内存很小 可以使用 RenderTransform 修改显示,但不是所有的变换都可以使用...可以进行布局,如下图,使用Grid分开按钮 存在问题 吃掉了 Touch 事件、MouseDown事件,也就是吃掉了所有用户输入 第一次加载无法覆盖控件大小,在修改窗口大小之后才可以...设置 IsEnable 无作用 设置 IsHitTestVisible 无作用,依然可以响应输入 默认没有设置 IsManipulationEnable ,但是可以响应手势 能够使用...snoop 在视觉树找到 WebView 但是没有看到 WebView 里面的元素 无法在 WebView 上面放控件 我尝试了下面的代码,虽然设计界面可以看到按钮,但是运行界面没有按钮...Click="Button_OnClick"> 但是运行时候就看不到按钮了,所以存在层级问题,这个问题是在08年就有大神说到问题。

1.6K10

移动端app开发问题及理解

元素滚动条被滚动 移动端事件有 click 单击事件 类似于pc端click,移动端中,连续click触发有200ms-300ms延迟 touch 触摸类事件 touchstart 手指触摸到屏幕触发...touchmove 手指在屏幕上移动触发 touchend 手指离开屏幕触发 touchcancel 可由系统进行触发,比如手指触摸屏幕,突然alert了,或者系统中其他打断了touch行为可触发...可以改用beforeClose事件 回调函数有两个参数,第一个判断点击是确认按钮还是取消按钮。第二个感觉是可以关闭模态框 移动端消息推送 消息推送跟设备走还是跟人走?...内核容器统称WebView。...我理解WebView相当于一个中间层,h5和原生应用交互都是通过原生应用中WebView,h5调用原生应用注入其中原生对象方法,原生应用调用h5暴露在该环境中JavaScript对象方法,

3.8K10

Android 12行为变更和版本兼容思路

换句话说,系统会阻止通过某些窗口触摸,但有一些例外。 受影响应用 此更改会影响选择让触摸通过其窗口(例如通过使用 FLAG_NOT_TOUCHABLE 标志)应用。...当组合不透明度小于或等于系统对触摸最大遮盖不透明度,系统认为一组系统警报窗口是足够透明。...此外,用户可能已经使用通知操作按钮与通知进行了交互,并且您应用正在响应该用户操作来处理服务或广播接收器。...如果您应用程序检测到违反StrictMode行为,则可能要停止执行应用程序以保护潜在敏感信息。...无法从服务或广播接收者创建Notification trampolines 当用户与通知交互 ,某些应用程序会通过启动应用程序组件来响应通知点击,该组件最终会启动用户最终看到并与之交互活动。

4.4K10

Native地图与Web融合技术应用与实践

但从打车业务角度来看,因为打车业务有很多功能入口需要漂浮在地图之上,起终点卡片、用户中心入口等,这种漂浮功能在技术上并不容易实现,而且还要保证用户触摸动作在漂浮元素与地图上发生,分别派发给各自事件系统...我们期望效果是: 点击H5元素,点击事件会派发给H5 WebView容器处理。 点击地图区域,点击事件会派发给Native地图组件处理。...手势消息分发给WebView层流程 主要为上图1-->2-->3-->4过程,如下: 用户触摸动作首先被手势分发层捕获,手势分发层判断用户点击到热区数据范围内,将消息分发到WebView H5层处理。...两端分别在启动App设置三层内容,最上层是手势触摸事件接收层,中间是WebView层(背景设置透明),最下层是Native地图层(腾讯地图SDK)。...用数组记录当前热区数据,当手势分发层有事件发生,通过Touch事件获取手指位置信息,遍历热区数组判断手指位置是否与热区矩形相交,相交则将消息分发给WebView层,否则分发给Native层。

1.4K10

【原理篇】WebView 实现嵌套滑动,丝滑般实现吸顶效果,完美兼容 X5 webview

对于一个 ACTION_MOVE 动作 scrolling child 在滑动之前,会通过 NestedScrollingChildHelper 查找是否有响应 scrolling parent,如果有的话...滑动结束之后,Scrolling child 会停止滑动,并通过 NestedScrollingChildHelper 通知相应 Scrolling Parent 停止滑动。...因此我们直接 extends com.tencent.smtt.sdk.WebView,对触摸事件进行拦截,实际上是对 FrameLayout 进行拦截处理,而不是对里面的 WebView 进行拦截处理...解决方案 我们先来看一下 X5 webView View Tree 结构,因为 X5 webView 代码是混淆,我们想要通过代码直接看出他 View Tree,是不太方便。...当 X5 里面的 webview 进行滑动时候,会调用相应方法。

97010

移动开发实用

通常我们再滑屏页面,会调用eventpreventDefault()可以阻止默认情况发生:阻止页面滚动 touchend 当手指离开屏幕触发 touchcancel 系统停止跟踪触摸时候会触发。...200-300 ms延迟响应 移动设备上web网页是有300ms延迟,玩玩会造成按钮点击延迟甚至是点击失效。...解决方案: fastclick可以解决在手机上点击事件300ms延迟 zeptotouch模块,tap事件也是为了解决在click延迟问题 触摸事件响应顺序 1、ontouchstart...1/2,例如视觉稿40px字体,使用样式写法为20px .css{font-size:20px} 参考《高清显示屏原理及设计方案》 ios系统中元素被触摸产生半透明灰色遮罩怎么去掉 ios用户点击一个链接.../a> 发短信,winphone系统无效 发短信 发短信给: 10086 模拟按钮hover效果 移动端触摸按钮效果,可明示用户有些事情正要发生,是一个比较好体验

6.4K30

(你也不想那个啥也不懂测试嘲笑你吧)H5开发过程中那些不要碰CSS选择器

在开发针对移动设备H5页面,开发者往往会遇到各种挑战,尤其是当内容需要在不同Web浏览器和WebView中呈现时。...尽管它们提供了一种强大方式来增加装饰性内容,但在某些WebView中可能存在兼容性问题,特别是在使用复杂样式或动画。...替代方法:尽可能使用更简单属性选择器,[attribute=value],或者通过JavaScript来动态查询和操作这些元素。 6....:hover 尽管:hover在桌面浏览器中非常有用,用于改变鼠标悬停在元素上样式,但在触摸设备上,特别是在WebView环境中,:hover可能会导致不可预测行为。...考虑使用触摸事件处理器来改变元素样式,或设计一个不需要:hover状态UI。 在开发针对WebViewH5内容,了解哪些CSS选择器可能引起兼容性问题是很重要

11710

Material Design —悬浮响应按钮(Buttons: Floating Action Button)

悬浮响应按钮 悬浮响应按钮代表一个应用中最重要操作。 悬浮响应按钮用于促进操作。 就像在UI上方浮动圆形icon一样,它会在聚焦改变颜色,并在选择上浮。...避免对次要和消极操作使用浮动操作按钮,包括以下内容: ·存档或清空 ·不明确行为 ·警告或错误 ·有限制任务,剪切文本 ·应该在工具栏中控件,音量控制或更改字体颜色 浮动操作按钮不包含应用栏...尝试最适合您app和按钮所在屏幕变换。 触发 悬浮响应按钮可以简单地触发动作或在某处导航。 触摸波动动画向外扩展导致UI变化。 工具栏 浮动动作按钮可以在按下变换成工具栏。...如果您有两个选项 ,即您浮动操作按钮只显示另一个选项,则选最重要动作作为悬浮响应按钮。 如果你有超过六个,用户可能难以触摸到最远选择。 为用户提供最好,最明显,最少选择,来减少决策疲劳。...如果app特点是添加文件类型,浮动操作按钮可以在第一次触摸后转换为相关操作。 但是,如果显示操作与按钮无关,请将操作放入溢出菜单。 ? 悬浮响应按钮可以包含联系人列表。

5.7K90

使用 Cordova 构建应用流程

当点击按钮,它会被触发。在这个函数中,我们调用由插件API提供 navigator.camera 全局对象。...插件 安卓插件开发指南 本节提供如何在 Android 平台上实现本地插件代码详细信息。...具有长时间运行请求、后台活动(媒体播放、侦听器或内部状态)插件应该实现 onReset ()方法。 它在 WebView 导航到新页面或刷新执行,这会重新加载 JavaScript。...性能考虑 点击与触摸 最大和最简单错误,你可以使用点击事件。 虽然这些"工作"在移动设备上还不错,但大多数设备都会延迟300毫秒,以区分触摸触摸"保持"事件。...您还应该考虑这样一个事实,即非 webkit 浏览器不支持"触摸"事件,请参阅 canifuse。 为了解决这些限制,您可以签出各种类型库, HandJS 和 Fastclick。

4.2K11

解读Android 12首个开发者预览版

相关API返回空值或占位符值,具体取决于应用程序目标SDK版本: ➀ target = 12 ,返回 null ➁ target <12 ,返回 02:00:00:00:00:00 未被信任触摸事件将被阻止...为了保护系统安全和更好用户体验,Android 12将会阻止某些窗口触摸。...上面应用名字显示和折叠按钮都是相同、固定,下面折叠和展开状态呈现区域是可自定义: 折叠和展开样式: 折叠状态 展开状态 若APP中存在自定义Notification.Style,亦或是使用了...隐私/安全 WebViewSameSite cookie行为 AndroidWebView组件基于Chromium来提高安全性和隐私性,去年,Chromium对第三方Cookie处理方式进行了更改...组件需要添加 exported 配置 target=12,使用activity 、service或者广播有用到 intent filters ,则需声明 android:exported 属性。

1.8K30

Flutter 深入探索混合开发技术演进

其他页面的时候会被当前原生 WebView 挡住;并且打开页面的动画Appbar 和 WebView 难以保持一致,因为 Appbar 和 WebView 是出于两个动画体系和渲染体系。...触摸事件 默认情况下, PlatformViews 是没办法接收触摸事件,因为 AndroidView 其实是被渲染在 VirtualDisplay 中 ,而每当用户点击看到 "AndroidView..." ,其实他们就真正”点击是正在渲染 Flutter 纹理 ,用户产生触摸事件是直接发送到 Flutter View 中,而不是他们实际点击 AndroidView。...所以 AndroidView 使用 Flutter Framework 中检测用户触摸是否在需要特殊处理区域内: 当触摸成功时会向 Android embedding 发送一条消息,其中包含 touch...这就变成有些本末倒置,触摸事件从原生-Flutter-原生,中间转化导致某些信息被丢失,也导致了响应延迟。

1K10

android WebView总结

webview.getSettings().setJavaScriptEnabled(true); 触摸焦点起作用 requestFocus();...给WebView加入一个事件监听对象(WebViewClient)并重写当中一些方法: shouldOverrideUrlLoading:对网页中超链接button响应。...当按下某个连接WebViewClient会调用这种方法,并传递參数:按下url。比方当webview内嵌网页某个数字被点击,它会自己主动觉得这是一个电话请求。...告诉用户程序在等待网络响应。 通过这几个事件。我们能够非常轻松控制程序操作,一边用着浏览器显示内容。一边监控着用户操作实现我们须要各种显示方式。...同一候能够防止用户产生误操作。 6) 假设用webview点链接看了非常多页以后。

73620

Android Compose 新闻App(六)导航动画、WebView浮动按钮、底部导航

Android Compose 新闻App(六)导航动画、WebView浮动按钮、底部导航 前言 正文 一、导航动画 ① 添加依赖 ② 使用 二、WebView使用 ① 导航传递URL参数 ② 配置WebView...三、FloatingActionButton使用   浮动按钮在日常开发中,也是很常见,下面在我们EpidemicNewsListPage中添加一个浮动按钮。...因为页面使用了Scaffold,因此可以直接通过Scaffold去添加浮动按钮。...添加浮动按钮同时,我把TopAppBar中多余内容清除掉了,下面我们运行一下: 点击弹出Toast,默认显示在页面的右下角。 那如果要改位置呢?...floatingActionButtonPosition = FabPosition.End 这里疫情详情页面已经是写完了,你会看到当前页面中有一个浮动按钮,那么这个按钮就是用来返回主页面的,App现在还没有主页面的

4.2K20

touchesBegan 触摸事件

一、概念介绍 1、在用户使用App过程中,会产生各种各样事件,iOS中事件可以分为3大类型: 1)触摸事件 2)加速计事件 3)远程操控事件 响应者对象UIResponder 在iOS...,通过forin循环来遍历NSSet中每一个元素,当用户用一根手指触摸屏幕,会创建一个与手指相关联UITouch对象, 保存着跟本次手指触摸相关信息,比如触摸位置、时间、阶段, 当手指离开屏幕...1、属性: 1)获取触摸产生所处窗口 @property(nonatomic,readonly,retain) UIWindow *window; 2)获取触摸产生所处视图 @property...【操作:按耳机线控中间按钮三下不要松开】 UIEventSubtypeRemoteControlBeginSeekingBackward = 106, //快退停止【操作:按耳机线控中间按钮三下到了快退位置松开...= 108, //快进停止【操作:按耳机线控中间按钮两下到了快进位置松开】 UIEventSubtypeRemoteControlEndSeekingForward = 109, (3)获取触摸产生或变化时间戳

78020

Appium自动化测试框架

Appium自动化测试框架 环境搭建 adb 构成和原理 连接 包名,界面名 文件传输 获取APP启动时间 获取手机日志 安装和卸载APP 进入到安卓手机内部Linux系统命令行 启动和停止adb服务端...使用可以重启服务器,先关闭再启动 adb start-server 停止adb服务端 adb kill-server ---- 查看命令帮助 adb --help ---- 其他命令 ---- Appium..."); ---- 键值事件 Android平台独有,向系统发送键值事件,不同键值对应不同功能,: keyevent(4)表示手机HOME按键 public void pressKey(AndroidKey...打开手机端开发者选项 对于原生界面来说,都会被线条包裹起来 对于webview界面来说,中间一部分是一整个控件,并没有被线条包裹起来,则该页面为webview ---- 线上app开启webview...模块来开启APPWebView debug模式。

2K30
领券