`
高级java工程师
  • 浏览: 410706 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

XBL绑定组建的实例

    博客分类:
  • xul
阅读更多
可以利用绑定方法创建具有复合功能的控件

1.被绑定的标签常由样式表指向绑定元素定义的.xml,
如: xbltest.css中
#shortcutlistbutton_popup
{
    min-width:200px;
    min-height:300px;   
    -moz-binding:url(chrome://proj/content/bindings/startmenu.xml#startpopup);
}
其中-moz-binding 表明这是一个绑定样式,具体绑定到的位置由url指定.

2.在使绑定的控件所在的.xml页中要先引入xbl命名空间
<bindings xmlns="http://www.mozilla.org/xbl"
          xmlns:xbl="http://www.mozilla.org/xbl"
          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
......
</bindings>

3.在<bindings></bindings>之间可以有多个<binding>标签,每一个binding标签表示一个绑定
<content>标签中为绑定的内容,当绑定xul标签时,在xbl中每一个标签名称前要加xul: 在xbl中的标签没有id属性,所以不可以直接在.xul或.js中访问,在xbl中标签作为匿名控件具有anonid属性,在xbl中可以通过
document.getAnonymousElementByAttribute(this,'anonid','toolBarBtn').来得到匿名标签.
在xul中可以通过用 绑定的xul控件.属性=newvalue的方式来改变在xbl中描述的标签的属性.

4    <implementation>标签中存放一系列的属性和方法,<method>表示方法
<resources>中可用于引入源如:
   <resources>
      <stylesheet src="hello.css"/>
      <image id="img" src="1.jpg"/>
    </resources>
  
例:xblDemo.xul
[color=red]<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<?xml-stylesheet href="xblDemo.css" type="text/css"?>
<window xmlns:html="http://www.w3.org/1999/xhtml"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        onload="" >
<script>
function changeC()
{
document.getElementById("mybox").setAttribute("content","9");
var obj=document.getElementById("mybox");
alert(obj.getAttribute("content"));
}

</script>  
<vbox flex="1" style="overflow:auto">    
<label value="下面是绑定一个box"/>     
<box id="mybox" class="boxBinding" value="age"/>
<button maxwidth="200px" label="通过content属性改变内容" oncommand="changeC();"/>

<spacer height="30px"/>
<box id="mybox2" class="boxBinding2">
      <label value="第二個綁定,xbl中的标签不会显示"/>
      <textbox value="xul中的textbox" />
</box>

    <spacer height="30px"/>
<box id="mybox3" class="boxBinding3">
      <label value="在xbl中用children标标签,xul,xbl标签同时显示"/>
      <textbox value="xul中的textbox" />
      <button label="show" oncommand=""/>
</box>

<spacer height="30px"/>
<abox id="mybox4" class="boxBinding4">
      <label value="children 的includes可以过滤显示xul中的元素"/>
      <textbox value="xul中的textbox" />
      <textbox value="xul中的textbox" />
      <textbox value="xul中的textbox" />
      <image src="xulplanet.png"/>
</abox>

<spacer height="30px"/>
<box id="mybox5" class="boxBinding5"/>

<spacer height="30px"/>
<box id="mybox6" class="boxBinding6"/>
</vbox>
</window>    

//xblDemo.css
.boxBinding
{
-moz-binding: url("xblDemo.xml#boxBinding");
}

.boxBinding2
{
-moz-binding: url("xblDemo.xml#boxBinding2");
}

.boxBinding3
{
-moz-binding: url("xblDemo.xml#boxBinding3");
}

abox
{
-moz-binding: url("xblDemo.xml#boxBinding4");
}

.boxBinding5
{
-moz-binding: url("xblDemo.xml#boxBinding5");
}

.boxBinding6
{
-moz-binding: url("xblDemo.xml#boxBinding6");
}
//xblDemo.xml
<?xml version="1.0"?>

<bindings xmlns="http://www.mozilla.org/xbl"
          xmlns:xbl="http://www.mozilla.org/xbl"
          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
         
<binding id="boxBinding">
<content>
    <xul:label   value="Name:" xbl:inherits="value"/> <!--xbl:inherits使xul中的标签具有绑定元素的属性,此处为具有value属性-->
    <xul:textbox value="default value" xbl:inherits="value=content"/>
    <!--前面的value="default value"是绑定控件具有的默认值,可以通过inherits继承到xul中的绑定标签上,这里使xul中的绑定标签具有了content属性-->

</content>
</binding>

<binding id="boxBinding2">
<content>
    <xul:textbox value="I am xbl: textbox"/>
   <!--在本binding中,由于xul中綁定的box中已有了元素,所以在xbl中的綁定标签不起作用了,如果还想显示xbl中的标签用children标记,见下例boxbinding3-->
</content>
    <implementation id="www">
      <method name="fun">
      <body>
      <![CDATA[
       alert("hello,in boxBinding2");
      ]]>
      </body>
      </method>
    </implementation>
</binding>

<binding id="boxBinding3">
<content>
<xul:vbox>
    <xul:textbox value="I am xbl: textbox"/>
    <children />
    <!--当xul中标签已存在标签,会覆盖掉xbl中的绑定标签。可以在xbl中加上children标记,使xul,xbl中标签同时显示在绑定元素中-->
</xul:vbox>
</content>
</binding>

<binding id="boxBinding4">
<content>
    <xul:vbox>
      <children/><!--必需有一个空的children,过滤才起作用-->
      <xul:textbox value="I am xbl: textbox"/>
      <children includes="image|textbox"/>       
      <!--children标签还可以筛选xul中的指定类型的标签-->
    </xul:vbox>
</content>
</binding>

<binding id="boxBinding5" extends="#boxBinding2">
<!--在boxBinding5中,并没有直接去写绑定的标签,而是用extends去
继承boxinding2,从而使xul中的mybox5具有了textbox -->
</binding>

<binding id="boxBinding6" extends="#boxBinding2">
<content> <!--如果在binding中写上content标签,则只有写在content中的绑定标签起作用.(即使有extends继承就失效了-->
     <xul:textbox value="这是content中的绑定标签"/>
     <xul:button label="调用父类的方法" oncommand="fun();"/>
     <!--虽然boxBinding2中的标签不会在xul中显示出来,但boxBinding2中定义的方法还可以调用-->
</content>
<implementation id="aa">

</implementation>
</binding>

</bindings>   [/color]
分享到:
评论

相关推荐

    如何在xbl中读取分区信息.docx

    【如何在XBL中读取分区信息】 在Android系统中,特别是在高通(Qcom)平台上,启动流程涉及多个阶段,其中包括XBL(eXtended Boot Loader)。XBL是引导加载程序的一部分,负责初始化硬件并准备加载下一级引导加载...

    XBL(Exec Bin Lib)

    在计算机编程的历史长河中,XBL(Exec Bin Lib)作为一种跨时代的执行库技术,曾在软件开发领域扮演了至关重要的角色。XBL,全称为Exec Bin Lib,是一种执行库技术,其设计理念是为开发者提供一个简单而基础的运行库...

    XBL开发规范.pdf

    xbl:attr属性用来定义组件的自定义属性,这些属性可以在组件实例化时进行设置。 2.9 **xbl:pseudo Attribute** xbl:pseudo属性则用于定义组件的伪类,使得组件可以响应特定状态,如鼠标悬停、选中等。 2.10 **div ...

    mozilla xbl基本用法示例

    在XUL文档中,我们可以定义UI元素并引用XBL绑定。一个典型的XUL文件可能包含如下结构: ```xml &lt;binding id="myCustomElement" xmlns:xbl="http://www.mozilla.org/xbl"&gt; &lt;!-- XBL内容在这里 --&gt; ...

    xbl中的属性继承与事件继承实例

    总结了xbl中的继承用法,属性继承和事件继承 本资源为火狐扩展

    EIKI爱其LC-XBL20 用户手册.pdf

    EIKI爱其LC-XBL20多媒体投影机用户手册 本手册为EIKI爱其品牌的LC-XBL20多媒体投影机提供了详细的使用说明书。该投影机采用了最新的技术,具有便携、耐用、易于操作等特点,适合广泛的应用场景。 多媒体投影机的...

    如何解封垃圾邮件IP方法图解(XBL,SBL,PBL,ROKSO)宣贯.pdf

    垃圾邮件IP解封方法图解(XBL,SBL,PBL,ROKSO) 本文主要介绍了如何解封垃圾邮件IP的方法,并对 Spamhaus 组织下的四种类型的黑名单进行了解释,即 XBL、SBL、PBL 和 ROKSO。 Spamhaus 是一个世界上影响最大的反垃圾...

    xbl_config.prof

    xbl_config.prof

    xbl_config(5).zip

    《xbl_config配置详解》 在IT领域,配置文件是系统、软件或服务运行不可或缺的部分。今天我们将聚焦于“xbl_config”这个特定的配置文件,深入探讨它的用途、结构和重要参数。在这个名为"xbl_config(5).zip"的...

    EIKI爱其LC-XBL21 用户手册.pdf

    EIKI爱其LC-XBL21用户手册 EIKI爱其LC-XBL21多媒体投影机用户手册是EIKI爱其品牌的产品说明书,该手册详细介绍了LC-XBL21多媒体投影机的特点、设计、网络支持、多媒体功能、安全功能等方面的知识点。 一、网络支持...

    xbl:xbl.js - JavaScript 中的跨浏览器 XBL 2 实现

    这是 JavaScript 中的 XBL 2 实现。 除了 [ 2.0) 语言,它还包含 [ API)支持 [ 3 Selectors) 以及 [ Extensions to CSS)、[ (文档对象模型 (DOM) 级别 3 事件)和 [ 基础)。 &lt; head &gt; ... &lt; script ...

    jquery jqGrid 4 7 1 zip下载 css js plugins src

    | ellipsis xbl xml | ui jqgrid css js | i18n | grid locale en js | grid locale cn js | grid locale js | Changes txt | install txt | jquery jqGrid min js | jquery jqGrid src js | jquery 1 9 0 min js ...

    高通手机详细过程

    详细的,从最简单的概念讲解了高通手机的开机过程和详细细节,对你的boot理解很有帮助

    XBL in JS-开源

    使用纯跨平台JavaScript,DOM 1和CSS 1编写XBL样式的小部件的实现。

    gaming-app

    【标题】"gaming-app" 暗示了这是一个与游戏应用...对于游戏爱好者和开发者来说,这个压缩包可能包含了一系列的学习资料、工具或实例,可以帮助他们提升技能,了解游戏开发的最新进展,或者直接应用于他们的项目中。

    ask fsk.rar_ASK和FSk调制解调 matlab_MatlabASKFSK_XBL_ask调制解调_fsk解调

    在本文中,我们将深入探讨两种常见的数字调制技术——ASK(Amplitude Shift Keying,幅度键控)和FSK(Frequency Shift Keying,频率键控),以及如何在MATLAB环境中实现这两种调制与解调的过程。...

    ABL计算机软件开发

    ABL计算机软件开发

    hob-demo-app

    1. **Vue.js基础**:Vue.js的核心特性包括声明式渲染、组件化、响应式数据绑定等。在hob-demo-app中,可能会看到如何使用模板语法来创建视图,并通过Vue实例管理数据,实现数据变化时视图的自动更新。 2. **组件...

    mod_spamhaus_new:Apache 2.4.x安全性,阻止已知的错误IP-开源

    默认配置利用Spamhaus阻止列表(SBL)和漏洞利用阻止列表(XBL)查询sbl-xbl.spamhaus.org,但您可以使用其他DNSBL,例如sbl-xbl的本地rbldnsd实例(提高查询性能) 。 Spamhaus的DNSBL作为免费的公共服务提供,...

    qcm2150 lk阶段操作i2c读写寄存器

    1. gpio22 gpio23当i2c操作,patch包含了两种方式gpio模拟i2c和blsp方式添加 2.lk 阶段读写i2c

Global site tag (gtag.js) - Google Analytics