问题:CefSharp如何进行页面的缩放

摘要:由于CefSharp并没有提供鼠标滚轮事件。只有一个KeyboardHandler事件,因此只能接收到键盘事件。

环境:CefShap、Wpf

了解CefSharp是否有现成方法调用

通过这个不难看出有一个KeyboardHandler可以用来接收键盘的Ctrl按钮。因此通过这个我们可以说就相当于解决了问题的一半了,就是可以通过这个来接收按键。那么鼠标的滚轮又如何接收到呢?

CefSharp不能接收到鼠标滚轮 - 困境

相信大伙一开始肯定会想着ChromiumWebBrowser里自带的MouseWheel事件。本人一开始也是这样想的,后来发现程序在鼠标滚动的时候不会进入这个事件里面,虽然我也不知道这事什么原理,但很明显这个方法可能已经行不通了。因此我开始了我的面向百度编程历程,但我百度的时候,第一页第一篇就是说CefSharp的这个缩放,但实际上我进去浏览的时候发现,他说说的可能并不是CefSharp,因为我这CefSharp里根本没有所谓的鼠标滚轮事件,如下图所示,因此我觉得这篇文章对我的价值基本上是没有任何用处。往后翻了几页依旧没有任何收获,至此我陷入了困境。

CefSharp不能接收到鼠标滚轮 - 思路

这时的我开始想一些稀奇古怪的招了,比如什么Js注册页面缩放啊、企图在CefSharp上层铺控件来接收滚轮事件啊等等的。但js注册页面缩放经过尝试也未能达到要求。但第二个思路可以说是为当前的困境提供了一个很好的思路。但是脑袋瓜子想着就是既然页面不能接收我的滚轮事件,我为何不能在上层铺一层控件呢!这个时候思路一来立马给我精神的。说干就干。一开始的时候如下图所示。

CefSharp不能接收到鼠标滚轮 - 再临困境

当我将程序运行起来的时候发现我一开始放置用来测试的按钮并没有浮现在页面的上方。如下图所示,我再一次懵逼,完全不知所措。因为我也不知道CefSharp是什么原理,为什么控件不能浮现在页面的上方。至此,我又一次陷入了困境,并且对我之前的想法已经不抱任何希望。又开始在电脑前盲目的摸鱼起来了T T。

CefSharp不能接收到鼠标滚轮 - 奇迹再现

有一句话说得可真不错叫“无心插柳柳成荫”。这个“奇迹”可以说是无意间给了我再一次尝试解决的机会。由于前面陷入了困境,又苦于无法解决。在等待群友帮助的我又开始了开一些WPF的基础知识的查看学习。也正是这一举动让我无意间又发现了解决控件不能浮在CefSharp上方的问题。那时我正在看菜单这个东西,正巧看到了Popup自定义菜单,也正是这个控件让我对之前那个问题有了尝试的想法。如下图所示。我弄了一个这个Popup。但我运行起来的时候,惊喜的发现他居然浮现在页面的上方。也就是说我可以通过这个控件来让他浮现在网页的上方,这样一来滚轮事件就可以接收到了。这一发现让我完全可以解决了CefSharp不能就收滚轮的问题。至此一来按键事件可以通过KeyboardHandler来获取,滚轮可以通过Popup来获取。瞬间柳暗花明啊。O(∩_∩)O哈哈~

CefSharp Ctrl+鼠标滚轮进行页面缩放的处理

通过之前可以看到问题已经有了解决的方案了,接下来就是将他们结合起来了。话不多说。直接上代码图吧。O(∩_∩)O哈哈~

简要介绍下上面几张图吧,第一张就是Popup,主要点就在于那个透明度是0.01这样子当按下Ctrl的时候不会因为Popup的显现而遮挡住了页面。第二张是滚轮事件页面缩放代码,这个用了CefSharp自带的方法。第三张是KeyboardHandler注册Ctrl按下和按键松开时是发送通知来告知页面变化。第四章就是用来接收KeyboardHandler发送的通知,并改变Popup的显示和隐藏。至此,这个CefSharp滚轮缩放就解决啦。感觉是很简单,主要是有没有思路来解决这个问题。

最后

希望对大家有所帮助,还有什么问题可以在下方留言。谢谢!┭┮﹏┭┮希望不要再被移除了,这可是干货!!!!!!!

CefSharp如何进行页面的缩放(即Ctrl+滚轮)的更多相关文章

  1. iPhone/android的viewport 禁止页面自动缩放

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scal ...

  2. CefSharp如何判断页面是否加载完

    问题:CefSharp如何判断页面是否加载完毕. 摘要:相信C#用CefSharp做浏览器来发的应该有很多人都会有遇到这个问题.特别是要执行JavaScript的时候,涉及到跨页面的JavaScrip ...

  3. IDEA或Webstorm设置Ctrl+滚轮调整字体大小

    按Ctrl+Shift+A,出现搜索框 输入mouse: 点击打开这个设置:勾选 点击ok,之后就可以通过Ctrl+滚轮 调整字体大小了.

  4. IDEA设置Ctrl+滚轮调整字体大小

    IDEA设置Ctrl+滚轮调整字体大小(转载)   按Ctrl+Shift+A,出现搜索框 输入mouse: 点击打开这个设置:勾选 点击ok,之后就可以通过Ctrl+滚轮 调整字体大小了.

  5. IDEA设置Ctrl+滚轮调整字体大小(转载)

    按Ctrl+Shift+A,出现搜索框 输入mouse: 点击打开这个设置:勾选 点击ok,之后就可以通过Ctrl+滚轮 调整字体大小了. 转载自:http://www.cnblogs.com/LUA ...

  6. Pycharm使用 Ctrl+滚轮 调整字体大小

    首先,打开File中的Settings 然后,点开Editor内的General 最后,在3 指向的位置勾选:Change font size (Zoom)with Ctrl+Mouse Whel 这 ...

  7. 控制移动端页面的缩放(meta)

    meta标签中的content属性里有一个width=device-width的值,这个值就是用来告诉浏览器,该页面将要使用设备的宽度来解析,后面的属性值则是告诉该页面: user-scalable= ...

  8. web页面放到手机页面,缩放问题

    有时候写页面样式不规范,很多页面元素写死尺寸时,web页面尺寸比较大放到移动端访问时,就背缩放了,div或者按钮变得好小 可以加段js,效果会好点 <script> ! function( ...

  9. pc页面自动缩放到手机端

    今天做了个pc的页面,看了别人的网站在手机端能把pc端的网页刚好缩放到手机端,看着很舒服. 于是想把自己的页面也这样搞一下,刚开始,想到的是利用css3的缩放来做,想的是当屏幕尺寸改变时缩放整个页面, ...

随机推荐

  1. 网络编程Netty入门:EventLoopGroup分析

    目录 Netty线程模型 代码示例 NioEventLoopGroup初始化过程 NioEventLoopGroup启动过程 channel的初始化过程 Netty线程模型 Netty实现了React ...

  2. Day13_65_线程sleep()方法

    线程sleep()方法 * public static void sleep​(long millis) throws InterruptedException * Thread.sleep(),该方 ...

  3. 一致性哈希做负载均衡,基于dubbo的简化版本,超级简单容易理解!!!

    一致性哈希算法原理以及做分布式存储.一定先看:一致性哈希算法 dubbo提供了四种负载均衡实现:权重随机算法,最少活跃调用数算法,一致性哈希算法,加权轮询算法. 本文基于开源项目:guide-rpc- ...

  4. hdfs文件系统挂载

    简要说明: 使用fuse将hdfs文件系统挂载远程服务器上,像使用nfs和glusterfs那样可以挂载共享存储 fuse安装 fuse可以编译安装或者通过CDH或ambari源yum安装 此处使用a ...

  5. 17- web测试面试题

  6. 技术面试问题汇总第003篇:猎豹移动反病毒工程师part3

    从现在开始,面试的问题渐渐深入.这次的三个问题,都是对PE格式的不断深入的提问.从最初的概念,到病毒对PE格式的利用,再到最后的壳的问题.这里需要说明的是,由于壳是一个比较复杂的概念,面试中也仅仅只能 ...

  7. hdu1526 二分匹配+ floyd

    题意: 有N个插座,M个用电器,和K种转换器(每种有无限个),问最少多少个用电器无法充电. 思路 :  总的电器数 减去 电器和插座的最大匹配数 我有的是map去映射每一个串,根据转换器建边,然后跑一 ...

  8. hdu 3721 树的最小直径

    题意:       给你一棵树,让你改变一条边,改变之后依然是一棵树,然后问你怎样改变才能让树的直径最短.这里的改变一条边指的是指把一条边长度不变,连在别的两个点上. 思路:       首先求出树的 ...

  9. hdu4885 有 限制的最短路

    题意:       给你起点终点,和一些加油站,和每次加油后的最大行驶距离,问你从起点到终点最少加油次数,要求两点之间必须走直线,见到加油站必须加油,也就是说如果想从a走到b,那么a,b连线上的加油站 ...

  10. nodejs-安装/helloworld/npm

    安装---------------------------------------------------------------- http://nodejs.cn/download/ 完成之后确定 ...