NanUI | NanUI 0.7 正式发布 (4)

nanui-command属性的值有以下几组:

属性名 命令作用
maximize   最大化窗口  
minimize   最小化窗口  
restore   还原窗口  
close   关闭当前窗口  
浏览器中的NanUI对象

NanUI在Chromium的Javascript环境中注册了NanUI对象,通过该对象您能够获取当前窗体的相关信息,或者使用内置的函数来改变窗体的各项状态。

NanUI对象

version - type:object | NanUI版本信息对象

cef - type:string | 显示CEF版本字符串

chromium - type:string | 显示CEF版本字符串

nanui - type:string | 显示NanUI版本字符串

hostWindow - type:object | NanUI承载窗口对象

close() - type:function | 关闭承载窗口

maximize() - type:function | 最大化承载窗口

minimize() - type:function | 最小化承载窗口

restore() - type:function | 还原承载窗口

moveTo(x, y) - type:function | 移动承载窗口到x,y的位置

sizeTo(width,height) - type:function | 设置承载窗口的宽为width,高为height

height - type:integer | 当前承载窗口的高度

width - type:integer | 当前承载窗口的宽度

state - type:object | NanUI承载窗口的详细状态

clientHeight - type:integer | 承载窗口客户区域高度

clientWidth - type:integer | 承载窗口客户区域宽度

height - type:integer | 承载窗口的高度

width - type:integer | 承载窗口的宽度

windowState - type:object | 承载窗口最大化最小化状态对象

state - type:string | 承载窗口状态名称[normal|minimized|maximized]

code - type:object | 承载窗口状态编码[0:normal|1:minimized|2:maximized]

浏览器中的自定义事件

NanUI除了在Chromium的Javascript环境中注册了对象以外,还注册了一些承载窗口改变的通知事件。您可以通过注册事件句柄来捕获这些事件,以此来实现各项功能。

hostactived - 承载窗口获得焦点并被激活

hostdeactivate - 承载窗口失去焦点

hostactivestatechange - 承载窗口焦点状态改变

参数:actived - type:boolean | 激活状态[true:获得焦点|false:失去焦点]

hoststatechange - 承载窗口最大化最小化状态改变

参数:state - type:string | 承载窗口状态名称[normal|minimized|maximized]

参数:code - type:integer | 承载窗口状态编码[0:normal|1:minimized|2:maximized]

hostsizechange - 承载窗口状态尺寸改变

参数:width - type:integer | 承载窗口客户区域宽度

参数:height - type:integer | 承载窗口客户区域高度

例如,我们可以通过捕获承载窗口最大化最小化状态改变的事件来为窗体添加不同的样式:

window.addEventListener("hoststatechange", e => { if (e.detail.code === 2) { console.log("最大化状态"); } else if(e.detail.code === 1) { console.log("最小化状态"); } else { console.log("正常状态"); } }); 使用无边框模式示例

通过此示例将告诉您如何使用React以及React Desktop制作一个.NET CORE 3.1桌面应用程序的用户界面。

B站:https://www.bilibili.com/video/av87654610/

西瓜视频:https://www.ixigua.com/i6791109614734672391/

GitHub项目地址:https://github.com/XuanchenLin/using-react-desktop-with-nanui-0.7

无边框模式示例

致谢

NanUI从诞生到现在经历了四个年头,这期间受到过来自网络上的经管受到过各种侮辱和谩骂,但更多的是来自大家的鼓励和支持,再次感谢各位对NanUI的关注和对本人的理解,谢谢!

NanUI是一个基于MIT协议的开源项目并且它是完全免费的。尽管如此,如果没有适当的资金支持,项目维护和新功能的开发是无法持续下去的。所以如果您喜欢这个项目并认可我的工作,您可以支付我一杯咖啡的钱请我喝一杯咖啡,或者您也可以成为长期的项目资助人以帮助NanUI变得更好!

使用微信或者支付宝扫描下方二维码来进行资金方面的捐助。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zyxgfj.html