一.Winform使用Webview2(Edge浏览器核心) 创建demo(Demo1)实现回车导航到指定地址

这篇具有很好参考价值的文章主要介绍了一.Winform使用Webview2(Edge浏览器核心) 创建demo(Demo1)实现回车导航到指定地址。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

往期目录

往期相关文章目录
专栏目录文章来源地址https://www.toymoban.com/news/detail-832187.html

参考文档

WinForms 应用中的 WebView2 入门

实现

1.安装visual studio

按照官方文档一路操作,可以自行百度或者查看WinForms 应用中的 WebView2 入门。为了避坑,本人安装的时vs2022(visual studio 以下简称vs)

2.创建单窗口应用

打开vs(visual studio 以下简称vs) 点击创建新项目,选择C# Windows 窗体应用 (.NET Framework) 注意后面一定要带有(.NET Framework) 不然有些用不了。然后选择.NET Framework4.7.2
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform

3.修改项目中的窗体名称MainForm

因为后面要做好多Demo,所以做一个统一入口界面,防止许多点击按钮进行跳转各个Demo
整体修改需要做以下步骤

  • 在解决方案资源管理器 双击Form1.cs,选中Fom1窗体,再右侧找到属性窗口中的(name)修改为MainForm。属性窗口可以通过视图->属性窗口或者Ctrl+w,p打开 c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
    在右侧解决方案资源管理器中选中Form1.csF2修改为MainFormc# webview2 edge,WInform-Webview2,edge,前端,C#,winform
  • Program.cs修改Form1MainForm
 /// <summary>
 /// 应用程序的主入口点。
 /// </summary>
 [STAThread]
 static void Main()
 {
     Application.EnableVisualStyles();
     Application.SetCompatibleTextRenderingDefault(false);
     //修改`Form1`为`MainForm`
     Application.Run(new MainForm());
 }

4.添加按钮

在解决方案资源管理器中双击MainForm.cs 。在视图点击工具箱或者Ctrl+w,x打开工具箱。
在工具箱中选择Button,拖拽到右侧MainForm窗体上。
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
在按钮上右键属性打开属性栏。修改按钮名称为btnDemo1,文字为 Webview2 初始基本HTML展示,回车导航
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform

5.添加窗口Demo1

资源管理器选中解决项目,鼠标右键添加,添加窗体,输入Demo1添加。
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform

6.在Demo1中添加WebView2 SDK

官方这一步骤挺详细的WinForms 应用中的 WebView2 入门 -> 步骤 4 - 安装 WebView2 SDK, 图标和官方有点不一样。
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
添加完之后在工具箱中可以看到webview2了
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
若如果没有出现可以查看官方的WinForms 应用中的 WebView2 入门 -> 步骤 5 - 创建单个 WebView2 控件 -> 5,6 点,

7.在Demo1窗体中选择添加textbox和webview2

现在你已经学会则怎么在窗体上创建按钮。同样的操作,在Demo1中从工具箱中拖拽 TextBoxWebView2.

  • 在属性栏中修改TextBox 如下属性
    (Name)->navigationUrl
    Anchor->Top,Left,Right

  • 在属性栏中修改WebView2如下属性
    (Name)->mainView2
    Anchor->Top,Bottom,Left,Right
    Source->https://www.baidu.com 页面导航地址

8.在MainForm.cs窗体中添加button的点击事件

回到MainForm窗体,找到前面创建的按钮,双击会跳转到对于的点击事件窗口。或者选中按钮通过右侧属性栏找到Click 双击跳到对应事件c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
添加如下代码

/// <summary>
/// 按钮点击打开Demo1窗口
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void btnDemo1_Click(object sender, EventArgs e)
{
    Demo1 demo1 = new Demo1();
    demo1.Show();
}

点击启动按钮或者F5启动应用。点击按钮会出现如下界面。
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform

9.在Demo1中为TextBox创建回车跳转到对于导航

选中TextBox在右侧属性栏中事件KeyDown,双击添加事件
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform
添加如下代码

/// <summary>
/// 输入url地址,回车跳转到导航
/// </summary>
private void navigationUrl_KeyDown(object sender, KeyEventArgs e)
{
    if (e.KeyCode == Keys.Enter)
    {
        try
        {
            this.mainView2.CoreWebView2.Navigate(
            this.navigationUrl.Text);
        }
        catch (Exception exception)
        {
            this.mainView2.ExecuteScriptAsync($"alert('{exception.Message.ToString()}')");
        }
    }
}

效果

启动在Demo1窗体中输入其他地址回车试试
输入地址https://www.taobao.com跳转到淘宝网
c# webview2 edge,WInform-Webview2,edge,前端,C#,winform

往期目录

往期相关文章目录
专栏目录

到了这里,关于一.Winform使用Webview2(Edge浏览器核心) 创建demo(Demo1)实现回车导航到指定地址的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • delphi使用Edge Browser浏览器组件

    RAD Studio 10.4在VCL Web浏览器上具有一项新功能。它是Edge Browser,它具有新功能,并且比以前的Web浏览器更具兼容性。 这是在C ++ Builder和Delphi中使用Edge浏览器的快速帮助。 在Windows上安装“ Edge ”版本 从RAD Studio的GetIt菜单下载“ Edge SDK” 从MS microsoft.web.webview2.0.9.515- prerelease

    2024年02月15日
    浏览(39)
  • Linux(Ubuntu)安装和使用Edge浏览器

    全文内容完全由AI创作,并通过人工核验,感谢各位的阅读。 Microsoft Edge是一款现代化的浏览器,它拥有众多功能和强大的性能,为用户带来更加流畅的浏览体验。 Edge最近推出了分屏功能,支持一个窗口同时显示两个选项卡,这可以大大提高生产力和多任务处理能力。欢迎大

    2024年02月08日
    浏览(65)
  • Edge浏览器的使用体验及优缺点

    🔍【浏览器必备】你们用哪个浏览器呀?相信大家都有各自喜欢的浏览器吧。今天小编要给大家介绍一款浏览器,它就是——Microsoft Edge! 🌟【品牌介绍】Microsoft Edge是由微软公司推出的全新浏览器,它是Windows 10的默认浏览器,也可以在其他操作系统上使用,如MacOS和Andro

    2024年02月08日
    浏览(137)
  • Edge浏览器免费使用GPT3.5

    搜索sider,安装Sidebar插件 注册账号即可每天免费使用30次。  

    2024年02月12日
    浏览(52)
  • Windows使用selenium操作Edge浏览器实现爬虫

    以前的大部分程序都是操作Chrome,很少有操作Edge,现在以Edge为例。 Selenium本身是无法直接控制浏览器的,不同的浏览器需要不同的驱动程序,Google Chrome需要安装ChromeDriver、Edge需要安装Microsoft Edge WebDriver,其他浏览器也需要安装相应的驱动。 edge://version/ https://developer.micros

    2024年02月03日
    浏览(59)
  • Selenium WebDrive使用Edge浏览器模拟登录163邮箱

    ** ** 1.首先要在pycharm中下载好Selenium 2.然后下载浏览器驱动这里是链接 (https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/) *注意版本要一致 *注意放置的位置要在python3.7(这里是我用的)的更目录下也就是找到python文件夹打开后放进去有些资料说要改名这里不用因为Seleni

    2023年04月15日
    浏览(58)
  • 四.Winform使用Webview2加载本地HTML页面并互相通信

    往期相关文章目录 专栏目录 实现刷新按钮 点击 C# winform 按钮可以调用 C# winform 代码显示到html上 点击 HTML 按钮可以调用 C# winform 代码更改html按钮字体 C# - html html-C# 确保mainView2的CoreWebView2异步初始化完成 在webview2的CoreWebView初始化之后设置属性 在coreWebview2完成时添加 WebMess

    2024年01月24日
    浏览(44)
  • 掌握这5款 Edge插件,让你的浏览器使用更高效!

    您好,今天我想向您推荐两款不常用的 Edge 插件,它们可以帮助您更高效地浏览网页和管理标签页。这些插件可能不像一些常见的插件那样广为人知,但它们的功能却非常实用。 IHome新标签页插件 下载地址: https://microsoftedge.microsoft.com/addons/detail/ihome%E5%8E%9Fbdtab%E6%96%B0%E6%A0%

    2024年02月04日
    浏览(47)
  • edge浏览器使用ie兼容模式以及不安全的TLS设置

    win11使用的浏览器是Edge,不再使用IE浏览器,但大多数小网站依旧使用的是IE,或使用的是低版本不安全的TLS协议,这时使用Edge浏览器就无法访问了。 打开Edge设置-》默认浏览器: 也可在工具栏上显示IE模式,在外观的自定义工具栏里: 在Internet选项中选择高级将‘使用TLS1

    2024年02月11日
    浏览(77)
  • IE强制被禁用的解决方案(Edge浏览器中使用IE模式)

    2023年2月14日,微软发布通告,将 永久禁用IE 浏览器。 近期有些小伙伴在使用IE浏览器时会强制被打开到edge浏览器。 众所周知,我国许多网站,例如 政府、金融、教育、医疗、财务、监控、OA等等 相关软件是基于IE的内核开发的,所以这次升级造成很多网站部分功能的不可用

    2024年02月04日
    浏览(48)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包