当前位置:首页>实用技巧>

webview安装了怎么运行(webview入门教程)

来源:原点资讯(m.360kss.com)时间:2023-07-08 23:03:08作者:YD166手机阅读>>

本文内容
  1. 步骤 1 - 安装 Visual Studio 和 Windows 应用 SDK
  2. 步骤 2 - 安装 Microsoft Edge 的预览频道
  3. 步骤 3 - 创建空白 WinUI 3 项目
  4. 步骤 4 - 添加 WebView2 控件

本文介绍如何设置开发工具并为 WinUI 3 (Windows 应用 SDK) 创建初始 WebView2 应用,并在此过程中了解 WebView2 概念。

在本教程中,你将使用空白应用、打包 (WinUI in Desktop)Visual Studio 项目模板创建空白 WinUI 3 项目。 该项目模板使用 WindowsAppSDK,其中包括 WebView2 SDK。 添加 WebView2 控件。 然后,添加地址栏和逻辑,以在用户尝试导航到带有前缀的 http:// URL 时显示警告对话框。

webview安装了怎么运行,webview入门教程(1)

已完成的项目

WebView2Samples存储库中提供了自 2020) (本教程项目的完整版本:

· 示例名称:WinUI3_GettingStarted

· 存储库目录: WinUI3_GettingStarted

· 解决方案文件:WinUI_Sample.sln

本教程已更新,仅创建单个项目,而不是第二个“ (包) ”项目,如 2020 年一样。

步骤 1 - 安装 Visual Studio 和 Windows 应用 SDK

即使已安装 Visual Studio,也请阅读以下页面,并可能更新软件并安装项目模板。

1. 在新窗口或选项卡中,打开“安装Windows 应用 SDK工具”页,然后按照该页上的步骤安装 Microsoft Visual Studio,例如 Visual Studio 2022。

1. 如果需要,请在新窗口或选项卡中,请参阅为WebView2 设置开发环境中的安装 Visual Studio。

从该页面返回并继续执行以下步骤。

对于此示例,无需单独安装 WebView2 SDK。 在下面,你将选择项目模板“空白应用”“打包 (桌面) 中的 WinUI”,该模板使用 WindowsAppSDK,其中包括 WebView2 SDK。

步骤 2 - 安装 Microsoft Edge 的预览频道

1. 安装Windows 10版本 1803 (内部版本 17134) 或更高版本上安装的 WebView2 运行时或任何 Microsoft Edge 预览版 (Beta、Dev 或 Canary) 。

从该页面返回并继续执行以下步骤。

步骤 3 - 创建空白 WinUI 3 项目

若要创建 WebView2 应用,请首先创建一个基本桌面项目,创建包含单个main窗口的桌面应用:

1. 如果 Visual Studio 未运行,请启动 Visual Studio (不Visual Studio Code) 。 在 Visual Studio 启动窗口中,单击“创建新项目”卡。 此时会打开“创建新项目”窗口。

或者,如果 Visual Studio 正在运行,请选择“文件>新建>项目”。 此时会打开“创建新项目”对话框。

打开开发人员模式:在本文的步骤中,当 Visual Studio 在某个时间点打开时,系统可能会提示你为计算机打开开发人员模式。 有关详细信息,如果需要,请参阅为 Windows 生成桌面应用中的启用设备进行开发。

2. 在“创建新项目”对话框的“搜索模板”字段中,在“桌面”中输入 WinUI 3

webview安装了怎么运行,webview入门教程(2)

3. 单击“空白应用”、“打包 (桌面中的 WinUI)卡将其选中,然后单击”下一步“按钮。

如果未列出WinUI模板,则需要从安装Windows 应用 SDK工具中安装如上所述的项目模板。 有关显示模板的其他提示:

安装 Visual Studio 2022 Community Edition 的“默认”选项后,在 Visual Studio 安装程序 单击.NET卡,然后在右侧选中Windows 应用 SDKC# 模板的复选框。

如果仍未显示正确的项目模板:在Visual Studio 安装程序中,单击UWP卡将其选中,选中右侧的v143 C 工具复选框,然后单击“修改”按钮。

此时会显示“配置新项目”对话框。

4. 在“项目名称”文本框中,输入项目名称,例如MyWebView2WinUI3

webview安装了怎么运行,webview入门教程(3)

5. 在“位置”文本框中,输入或导航到某个位置,例如 C:\Users\username\Documents\WebView2。

6. 单击“创建”按钮。

新的 WinUI 3 项目将在 Visual Studio 中的 解决方案资源管理器 中打开:

webview安装了怎么运行,webview入门教程(4)

首页 1 2 3 下一页

栏目热文

webview安装不上

webview安装不上

创作立场声明:并不是所有的用户都会出现本文中的问题,我只是告诉和我一样出现这个问题的值友们的解决方法,让你们少走弯路!可...

2023-07-08 23:35:46查看全文 >>

怎么知道webview安装是否成功

怎么知道webview安装是否成功

WebView2控件应用详解系列博客  客户端程序(WinForm、WPF、Win32、WinUI)集成WebView控...

2023-07-08 23:15:46查看全文 >>

webview初始化失败是什么意思(webview开好还是不开好)

webview初始化失败是什么意思(webview开好还是不开好)

上次说为了不想在web端登录博客园,我想着还是继续使用MarkWord编写博客,不过在使用的过程中,如果Markdown...

2023-07-08 23:30:54查看全文 >>

webview中点击不了(webview打不开带参数的链接)

webview中点击不了(webview打不开带参数的链接)

作者:子非转发链接:https://juejin.im/post/5ce76ee4f265da1b8d15f700前言我...

2023-07-08 23:22:28查看全文 >>

webview安装失败怎么弄(webview安装失败 -22)

webview安装失败怎么弄(webview安装失败 -22)

为什么要学习Android与H5互调?微信,QQ空间等大量软件都内嵌了H5,不得不说是一种趋势。Android与H5互调...

2023-07-08 23:10:12查看全文 >>

webview怎么找(webview地址怎么设置)

webview怎么找(webview地址怎么设置)

默认我们用Android SDK下包含的UiautomatorViewer.bat 工具查看app页面控件时只能查看原生...

2023-07-08 23:02:55查看全文 >>

webview不兼容怎么办

webview不兼容怎么办

WebView2控件应用详解系列博客 长青版WebView2运行时将作为Windows 11操作系统的一部分包含在内。但...

2023-07-08 23:03:55查看全文 >>

webview打开方式(多进程webview打开好吗)

webview打开方式(多进程webview打开好吗)

开发小程序绕不开 webview,什么是 webview?有什么作用呢?一、什么是 webviewWebView 也叫网...

2023-07-08 23:33:41查看全文 >>

webview无法更新(webview安装不了)

webview无法更新(webview安装不了)

作为一个博客站长,手机上的浏览需求是一定会有的,最起码的博客网站的调试必须要有“手机端”这个环节的,所以手机端的浏览器大...

2023-07-08 23:19:37查看全文 >>

webview回调怎么解决

webview回调怎么解决

一 背景熟悉 iOS\macOS Hybrid 混合开发的同学应该都有体会,WKWebView 虽然是苹果作为替代 UI...

2023-07-08 23:27:56查看全文 >>

文档排行