本文介绍: 在我们的 CSS 教程中,您会学到如何使用 CSS 同时控制多重网页样式和布局。本章节的每一篇都包含了在线实例 通过本站在线编辑器,你可以在线运行修改后的代码,并查看运行结果基于chromium,去除了chromium所有多余的部件,只保留最基本的排版引擎blink,总而言之就是chromium的阉割版,也可以把它当成一个功能强大体积小巧的浏览器或者超文本浏览框。所开发的,虽然也提供了相关的例程,但内容比较凌乱,并且没有对应的教程解说,对于小白来说比较入门,所以我弄了这个教程,带大家玩明白这玩意。

1、什么是 miniblink

Miniblink是一个非常小巧的浏览器内核,它由 @龙泉寺扫地僧 基于chromium,去除了chromium所有多余的部件,只保留最基本的排版引擎blink,总而言之就是chromium的阉割版,也可以把它当成一个功能强大体积小巧的浏览器或者超文本浏览框。

Miniblink – 免费小巧开源浏览器控件miniblink是一款极致小巧的开源浏览器控件,可嵌入各种软件中,提供浏览服务icon-default.png?t=N0U7https://miniblink.net/

 

2、为什么要用 miniblink

原因很简单,易语言目前处于弃坑的状态,并且易语言UI方面的支持库、模块很难做出特别好的效果。但如果miniblinkui界面的话,你就可以用HTML5和Css3、Javascrip实现各种炫酷的交互效果,同时你也可以调用很多开源前端UI框架

Ant Design框架

 

组件总览 – Ant Designantd 为 Web 应用提供了丰富的基础 UI 组件,我们还将持续探索企业应用的最佳 UI 实践。除了官方组件,我们也提供了社区精选组件作为必要的补充,另外如果您是内网用户,欢迎尝试使用 TechUI。https://ant.design/components/overviewcn

有人可能会说这种WebUI运行效率不行,个人感觉Miniblink运行效率的确比较一般(毕竟阉割了那么多功能);

所以我会更倾向于CEF(完整的chromium框架),但缺点也很明显:体积太大了(150M左右),完整的chromium内核运行效率就跟平常浏览器一样,举个例子:著名的开发软件VSCode就是用Electron框架开发的(chromium内核) 。

3、学习 miniblink 需要哪些相关的知识

前面有说到了,miniblink实际上就是个浏览器,浏览器渲染显示内容自然是要用到HTML、CSS、JavaScript/JQuery

当然,如果你是纯易语言小白,或者说从来没接触过这方面的,学起来的过程可能会比较痛苦;但如果你接触过网页抓包、爬虫方面的,学起来就会很轻松。

分享我之前用过的几个HTML学习网给大家

HTML5教程

HTML5 教程 | 菜鸟教程HTML5 简介 HTML5是HTML最新的修订版本,2014年10月由万维网联盟(W3C)完成标准制定。 HTML5的设计目的是为了在移动设备上支持多媒体。 HTML5 简单易学。 什么是 HTML5? HTML5 是下一代 HTML 标准。 HTML , HTML 4.01的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。 HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML..https://www.runoob.com/html/html5-intro.html

HTML 教程 | 菜鸟教程HTML 教程– (HTML5 标准) 超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。 您可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。 在本教程中,您将学习如何使用 HTML 来创建站点。 HTML 很容易学习!相信您能很快学会它! HTML 实例 本教程包含了数百个 HTML 实例。 使用本站编辑器,..https://www.runoob.com/html/html-tutorial.html

w3school 在线教程全球最大的中文 Web 技术教程。https://www.w3school.com.cn/

CSS教程

CSS 教程 | 菜鸟教程CSS 教程 CSS (Cascading Style Sheets,层叠样式表),是一种用来结构化文档(如 HTML 文档或 XML 应用添加样式(字体、间距和颜色等)的计算机语言,CSS 文件扩展名为 .css。 通过使用 CSS 我们可以大大提升网页开发工作效率! 在我们的 CSS 教程中,您会学到如何使用 CSS 同时控制多重网页的样式和布局。 CSS3 现在已被大部分现代浏览器支持,而下一版的 CSS4 仍在开发..https://www.runoob.com/css/css-tutorial.html

JS / JQuery教程

JavaScript 教程 | 菜鸟教程JavaScript 教程 JavaScript 是 Web 的编程语言。 所有现代的 HTML 页面都可以使用 JavaScript。 JavaScript 非常容易学。 本教程将教你学习从初级到高级 JavaScript 知识。 JavaScript 在线实例 本教程包含了大量的 JavaScript 实例, 您可以点击尝试一下’ 来在线查看实例。 实例 function displayDat..https://www.runoob.com/js/js-tutorial.html

jQuery 教程 | 菜鸟教程jQuery 教程 jQuery 是一个 JavaScript 库。 jQuery 极大地简化了 JavaScript 编程。 jQuery 很容易学习。 本章节的每一篇都包含了在线实例 通过本站在线编辑器,你可以在线运行修改后的代码,并查看运行结果。 实例 [mycode3 type=’javascript‘] $(document).ready(function(){ $(‘phttps://www.runoob.com/jquery/jquery-tutorial.html

如果你仅仅只是想弄UI,可以简单了解下JS,着重了解JQuery,因为对于界面开发来说,js原生代码弄得会特别少。因为这个我教程主要是讲解Miniblink的使用方法,所以HTML这部分大家就看上面的教程自学吧。

4、必要的开发工具

使用合适的工具才能提高码字的效率,所以我给大家推荐几款我我在折腾Mniblink时常用的一些开发工具:

1、易语言(这个是必须的)

2、VSCode 或 HBuilder X ,主要用于前端开发,也就是在写HTML的时候用,个人感觉HBuilder X代码提示功能会更完善点;但是VSCode会更轻巧,看你个人的选择

3、火狐浏览器或Chrome浏览器,这两款堪称程序员的最爱,由于miniblink没有内置开发者工具(被阉割了),所以只能通过这些浏览器来调试网页部分了。

5、Miniblink 学习计划

为了更高效地让大家学习 mniblink 如何使用,我主要把教程分为三个部分:

  1. miniblink窗口绑定、载入HTML
  2. miniblink的JS函数绑定、交互、传参
  3. miniblink事件绑定

由于miniblink并未提供易语言的模块,因此也没有官方的相关教程及模块,目前我所使用的模块主要是 @kyozy 开发的,虽然也提供了相关的例程,但内容比较凌乱,并且没有对应的教程解说,对于小白来说比较难入门,所以我弄了这个教程,带大家玩明白这玩意。

如果你需要这个例程可以在这里下载(虽然教程中用不上这个例程):

夸克网盘分享夸克网盘是夸克推出的一款云服务产品,功能包括云存储、高清看剧、文件在线解压、PDF一键转换等。通过夸克网盘可随时随地管理和使用照片、文档手机资料,目前支持Android、iOS、PC、iPadhttps://pan.quark.cn/s/92a58340402e

原文地址:https://blog.csdn.net/hotdog233/article/details/128916944

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。

如若转载,请注明出处:http://www.7code.cn/show_6131.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注