XUL透明异形旋转窗体
200行不到的代码,实现透明异形旋转窗体。
下载(25MB): http://oltag.com:8080/yaolixing/18/11/00/OHUIv52.0.1_3_webTrans20180106.rar
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<?xml-stylesheet href="chrome://xulApp/skin/index.css" type="text/css"?> <xul:window id="test-window" title="他山跨平台混合应用开发框架 V52"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:xbl="http://www.mozilla.org/xbl"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns="http://www.w3.org/1999/xhtml"
drawintitlebar='true'
onload='onload()' > <div style='background:url(../skin/images/mp18517973_1434019011825_16.gif) no-repeat -25px 4px;height:170px;' />
<script type="application/javascript" src="chrome://xulApp/content/js/common.js" />
<script type="application/javascript" src="chrome://xulApp/content/js/global.js" />
<script type="application/javascript" src="chrome://xulApp/content/js/index.js" /> <xul:tooltip id="aHTMLTooltip" page="true"/>
<xul:hbox flex="1">
<xul:vbox width="2" style="background-color: grey;overflow: hidden;">
<xul:resizer dir="topleft" style="cursor: nw-resize;"/>
<xul:resizer dir="left" flex="1" style="cursor: w-resize;"/>
<xul:resizer dir="bottomleft" style="cursor: sw-resize;"/>
</xul:vbox>
<xul:vbox flex="1" >
<xul:vbox height='2px' style="background-color: grey; overflow: hidden;"><xul:resizer dir="top" style="cursor: n-resize;"/></xul:vbox>
<xul:vbox flex="1">
<xul:hbox id='tbar'>
<xul:hbox class='toolbar' >
<xul:label id="appicon" flex='1'/>
<xul:label id='apptitle' >他山跨平台混合应用开发框架 V52</xul:label>
</xul:hbox> <xul:hbox class='toolbar' flex="1"><spacer id="titlebar-spacer" flex="1"/></xul:hbox> <xul:hbox class='toolbar' >
<xul:label id="minimize" flex='1' tooltiptext="最小化"/>
<xul:deck class='toolbar-split'/>
<xul:label id="maximize" tooltiptext="最大化" />
<xul:deck class='toolbar-split'/>
<xul:label id="close" tooltiptext="关闭" title="关闭" />
</xul:hbox>
</xul:hbox> <xul:hbox flex="1" style="vertical-align:middle;color:#303030;font:normal 22px 方正静蕾简体,华文行楷,楷体_GB2312,arial, tahoma, helvetica, sans-serif;font-weight:100;"> <marquee direction='up' scrolldelay='500' style='padding-left:20px;height:500px;overflow: hidden;border:0px solid green;'>
<br />
那一夜,我听了一宿梵唱,不为参悟,只为寻你的一丝气息。<br />
那一月,我转过所有经轮,不为超度,只为触摸你的指纹。<br />
那一年,我磕长头拥抱尘埃,不为朝佛,只为贴着了你的温暖。<br />
那一世,我翻遍十万大山,不为修来世,只为路中能与你相遇。<br />
那一瞬,我飞升成仙,不为长生,只为佑你平安喜乐。<br />
那一天,那一月,那一年,那一世<br />
<br /><br /> 那一天<br />
闭目在经殿的香雾中<br />
蓦然听见<br />
你诵经的真言<br />
<br /><br /> 那一月<br />
我转动所有的经筒<br />
不为超度<br />
只为触摸你的指尖<br />
<br /><br /> 那一年<br />
我磕长头匍匐在山路<br />
不为觐见<br />
只为贴着你的温暖<br />
<br /><br /> 那一世<br />
我转山转水转佛塔呀<br />
不为修来世<br />
只为在途中与你相见<br />
<br /><br /> 天空中洁白的仙鹤<br />
请将你的双翅借我<br />
我不往远处去飞<br />
只到理塘就回<br />
<br /><br />
</marquee>
</xul:hbox>
<xul:hbox>
<xul:deck flex="1">
<xul:statusbar flex="1" id="statusbar"><xul:statusbarpanel flex="1">Ready</xul:statusbarpanel></xul:statusbar>
</xul:deck>
</xul:hbox>
</xul:vbox>
<xul:vbox height='2px' style="background-color: grey; overflow: hidden;"><xul:resizer dir="bottom" style="cursor: s-resize;"/></xul:vbox>
</xul:vbox>
<xul:vbox width="2" style="background-color: grey; overflow: hidden;">
<xul:resizer dir="topright" height="1" style="cursor: ne-resize;"/>
<xul:resizer dir="right" flex="1" style="cursor: e-resize;"/>
<xul:resizer dir="bottomright" height="1" style="cursor: se-resize;"/>
</xul:vbox>
</xul:hbox> <script>
var oBtn;
function onload()
{
var aWidth=800;
var aHeight=787; var xOffset = (window.screen.availWidth - aWidth)/2;
var yOffset = (window.screen.availHeight - aHeight)/2; xOffset = xOffset > 0 ? xOffset : 0;
yOffset = yOffset > 0 ? yOffset : 0; //align to screen
window.resizeTo(aWidth, aHeight);
window.moveTo(xOffset, yOffset); oBtn = Comm.$('minimize');
Comm.addEvent(oBtn, 'mouseup', function(){
window.minimize();
}); oBtn = Comm.$('close');
Comm.addEvent(oBtn, 'mouseup', function(){
window.close();
}); var otbar = Comm.$('tbar'); oBtn = Comm.$('maximize');
(function(){
var isFullScreen=false;
var oldX=0,oldY=0,oldWidth=0,oldHeight=0;
function windowToScreen()
{
if(isFullScreen)
{
isFullScreen=false;
window.moveTo(oldX, oldY);
window.resizeTo(oldWidth, oldHeight);
}else
{
isFullScreen=true;
oldX=window.screenX;
oldY=window.screenY;
oldWidth=window.outerWidth;
oldHeight=window.outerHeight; window.moveTo(0,0);
window.resizeTo(window.screen.availWidth, window.screen.availHeight);
//window.maximize();
}
} Comm.addEvent(oBtn, 'mouseup', function(e){
windowToScreen();
});
Comm.addEvent(otbar, 'dblclick', function(){
windowToScreen();
});
})(); Comm.DragDropTitle(otbar); }//onload() </script> <xul:keyset>
<xul:key id="key1" modifiers="control" key="Q" oncommand="alert('你按了快捷键crtl+Q')"/>
<xul:key id="key2" modifiers="control alt" key="C" oncommand="alert('你按了快捷键crtl+alt+C')"/>
<xul:key id="key3" keycode="VK_F5" oncommand="location.reload();" />
</xul:keyset> </xul:window>
支持html,css,js开发右键菜单
支持任意节点右键菜单
支持右键菜单在屏幕任意位置弹出显示
有人问:有了HTML5,为什么还要XUL,XUL不是要淘汰了吗?
XUL是类似于HTML5中web component的东西。但是web也好,web component也好,终究是为网页开发的,而应用开发和网页不一样,在安全性,可操作性方面,应用程序有更多需求。比如读写本地文件,调用系统服务,界面上xul提供快捷键,resizer缩放控件,spilter拆分窗口,多标签页,进度条等100多种控件(参考[1]),有些控件是可以用html实现,比如树型目录控件,但是xul提供了一致的本地外观风格,使用纯web实现,可能导致tree你要使用一个js库,table你又要使用另一个js的外观,造成界面风格的混乱。xul提供的这些多达100多种的常用控件,都是可以使用css,js,html进行修改。xul还提供多国语言,布局重用(Overlay)等特性,方便了程序开发。因为xul开发跨平台桌面的强大特性,所以被firefox重度使用和依赖,短期内是不会被淘汰,手机端在v57后会放弃使用XUL,但在桌面端不会。
更多介绍: http://yaolixing.oltag.com/gns-8ABFFE2D-EB1E-44FA-9118-217ED7959536.html
参考:
[1]. XUL Reference: https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/XUL_Reference
XUL透明异形旋转窗体的更多相关文章
- 窗体透明,但窗体上的控件不透明(简单好用)good
1.在Delphi中,设置窗体的AlphaBlend := true;AlphaBlendValue := 0-255; AlphaBlendValue越小窗体的透明度就越高.这种方法将会使窗体和窗体 ...
- UI设计篇·入门篇·简单动画的实现,透明动画/旋转动画/移动动画/缩放动画,混合动画效果的实现,为动画设置监听事件,自定义动画的方法
基本的动画构成共有四种:透明动画/旋转动画/移动动画/缩放动画. 配置动画的方式有两种,一种是直接使用代码来配置动画效果,另一种是使用xml文档配置动画效果 相比而言,用xml文档写出来的动画效果,写 ...
- pyqt4制作透明无边框窗体
用PyQt做了一个无边框登陆窗口,效果如下: 下面是代码: # -*- coding: utf-8 -*- from PyQt4 import QtGui ,Qt ,QtCore image=QtGu ...
- WPF圆角透明无边框窗体
<Window x:Class="ImportData.MainWindow" xmlns="http://schemas.microsoft.com/winfx/ ...
- C# 实现透明可移动窗体
1.设置窗体属性 this.BackColor this.TransparencyKey = this.BackColor; 2.窗体加载图片 this.BackgroundImage = globa ...
- Qt之窗体透明 (三种不同的方法和效果)
关于窗体透明,经常遇到,网上的资料倒不少,也不知道写的时候是否验证过,很多都不正确...今天就在此一一阐述! 以下各效果是利用以前写过的一个小程序作为示例进行讲解!(代码过多,贴主要部分) ...
- C# 制作透明窗体
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- delphi 窗体透明详解TransparentColorValue,窗体透明控件不透明
关于窗体透明的做法 来自:http://blog.csdn.net/shuaihj/article/details/8610343 关于窗体透明的做法 1.在Delphi中,设置窗体的AlphaBle ...
- Qt之窗体透明
简述 关于窗体透明,经常遇到,下面我们针对常用的透明效果进行讲解: 全透明(主窗体.子窗体均透明) 主窗体透明(子窗体不透明) 子窗体透明(主窗体不透明) 简述 正常状态 全透明 效果 源码 主窗体透 ...
随机推荐
- yii2.0框架debug模式
- iOS 视频直播弹幕的实现
弹幕,并不是一个多么复杂的功能. 1.弹幕的实现性分析 首先,从视觉上明确当前弹幕所具有的功能 从屏幕右侧滑入左侧,直至完全消失 不管是长的弹幕,还是短的弹幕,速度一致(可能有的需求是依据弹幕长度,调 ...
- velocity 是如何实现内省 屏蔽反射的
velocity的标签中支持$abc 这样的语法,如果abc是一个对象,则写模板时就可以利用它来进行反射,调用一些危险的方法,如 $vm.getClass().newInstance() #set ( ...
- 调参过程中的参数 学习率,权重衰减,冲量(learning_rate , weight_decay , momentum)
无论是深度学习还是机器学习,大多情况下训练中都会遇到这几个参数,今天依据我自己的理解具体的总结一下,可能会存在错误,还请指正. learning_rate , weight_decay , momen ...
- gulp杂记
一.什么是gulp gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉 ...
- 二叉树的递归遍历 Tree UVa548
题意:给一棵点带权的二叉树的中序和后序遍历,找一个叶子使得他到根的路径上的权值的和最小,如果多解,那该叶子本身的权值应该最小 解题思路:1.用getline()输入整行字符,然后用stringstre ...
- 为开源社区尽一份力,翻译RocketMQ官方文档
正如在上一篇文章中写道:"据我所知,现在RocketMQ还没有中文文档.我打算自己试着在github上开一个项目,自行翻译."我这几天抽空翻译了文档的前3个小节,发现翻译真的不是一 ...
- 从durable谈起,我是如何用搜索引擎抓住技术的关键字学习新姿势打开敏捷开发的大门
---又名我讨厌伸手党 我又把个人博客的子标题改为了 你可以在书和搜索引擎找到90%的问题的答案,为什么要问别人?剩下的10%或许没有答案,为什么要问别人? 这是由于最近在网上看到各种伸手,对于我这种 ...
- HDU 2298 Toxophily(公式/三分+二分)
Toxophily Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total ...
- 18、Cocos2dx 3.0游戏开发找小三之cocos2d-x,请问你是怎么调度的咩
重开发人员的劳动成果,转载的时候请务必注明出处:http://blog.csdn.net/haomengzhu/article/details/30478251 Cocos2d 的一大特色就是提供了事 ...