一、WebView2的概述
1、WebView2 基于性能强悍的 Edge(Chromium) 内核。
2、调用 WebView2 生成的软件体积很小。所有基于 WebView2 的软件可以共享同一个 WebView2 组件。Win11 已经内置 WebView2 组件,其他操作系统也可以快速地自动安装 WebView2 。
3、WebView2 接口非常简洁,嵌入其他窗口界面也非常方便。
总结一句话就是:WebView2 简单、好用、生成软件体积小。
二、开发WebView2的入门介绍
入门介绍:点击这里。
三、aardio开发WebView2应用简单说明
1、使用HTML和CSS进行页面设计
aardio开发WebView2应用很方便,设置一个窗口,如form、static、custom控件,在窗口中可以直接写入HTML,也可以引用本地文件。
2、业务逻辑的设计,可以使用方法包括Javascript内部函数的实现、Javascript调用aardio函数,aardio回调Javascript函数。既可以本地业务逻辑实现,也可以与后台系统对接。
2.1 Javascript的内部函数示例
2.2 Javascript调用aardio函数示例
2.3 aardio回调Javascript函数示例
四、低代码平台amis的概述
amis 框架作为低代码领域的代表,与传统前端框架(如 React、Vue、Angular)以及其他低代码工具相比,有其独特的优势,主要体现在开发效率、使用门槛和业务适配等方面。以下是其核心优势的对比分析:
1. 开发模式:JSON 配置 vs 代码编写
传统框架(React/Vue 等):需要编写大量 HTML、CSS、JavaScript 代码,涉及组件封装、状态管理、DOM 操作等细节,对前端技能要求高。
amis:通过 JSON 配置描述页面,无需关注 DOM 操作、样式适配等底层实现,开发者只需关注「页面结构」和「业务逻辑」。例如,一个表单页面用 amis 只需几十行 JSON 配置,而用 React 可能需要编写多个组件和处理复杂状态。
优势:极大降低前端开发门槛,后端开发者、产品经理也能参与页面开发,实现「跨角色协作」。
2. 开发效率:快速交付 vs 从 0 构建
传统框架:开发一个包含表格、表单、筛选的后台页面,需要设计组件结构、实现交互逻辑、处理数据流转,通常需要数天时间。
amis:内置大量「开箱即用」的业务组件(如 crud 表格、form 表单、modal 弹窗等),这些组件已经封装了分页、搜索、校验、提交等通用逻辑。例如,一个带筛选、分页、编辑功能的表格,用 amis 只需配置 api 和 columns 即可,几小时内就能完成。
优势:开发效率提升 50% 以上,尤其适合需求频繁变更、需要快速上线的业务系统。
3. UI 一致性与标准化
传统框架:团队需要维护一套组件库(如 Ant Design),但不同开发者可能有不同的实现方式,容易导致页面风格、交互逻辑不一致。
amis:所有组件由框架统一提供,样式、交互逻辑完全标准化。例如,按钮的点击反馈、表单的校验提示、表格的排序交互等,无需额外配置即可保持一致。
优势:减少「样式统一」「交互规范」的沟通成本,尤其适合中大型团队协作。
4. 响应式与兼容性
传统框架:需要手动处理响应式布局(如媒体查询),并针对不同浏览器做兼容性适配,工作量大。
amis:所有组件默认支持响应式,自动适配 PC、平板等设备;框架内部已处理主流浏览器的兼容性问题。
优势:省去响应式和兼容性开发的时间,专注业务逻辑。
五、aardio基于amis开发应用
1、代码示例
1.1 amis配置生产UI
1.2 HTML页面引入amis并渲染
1.3 演示效果