【Firefox扩展】简单扩展之1——overlay statusbar
2007-07-29 14:48
471 查看
简单扩展之1——overlay statusbar
对于overlay，我的理解很简单：如果把firefox浏览器想成一个基本的界面，那么overlay就是在这个基本界面上的各种元素的位置上，以自定义的方式做出一个新的界面元素，然后像胶布一样贴上去，覆盖到原来元素的位置，使之显示新的界面信息。
那么都有什么样的界面元素可以被覆盖呢？通过两周的学习，我大概明白了4中最基本的元素，状态栏statusbar，工具条toolbar，菜单中“工具”的下拉菜单menupopup，还有一个是定制工具栏toolbarpalette。当然肯定还有其他的扩展位置，像ScrapBook扩展中修改菜单，迅雷的扩展修改邮件弹出等。做完这4篇blog后，我会去研究一下迅雷扩展的xpi，然后是功能强大的web developer。
上一篇blog介绍了一个扩展的基本目录结构，我们扩展状态栏的基本目录结构如下：
/chrome
---/content
---/sample.xul
/install.rdf
/chrome.manifest
很简单，一共三个文件就搞定了，呵呵，首先介绍一下安装文件install.rdf。代码如下：
<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:em="http://www.mozilla.org/2004/em-rdf#">
<Description about="urn:mozilla:install-manifest">
<em:id>sample@foo.net</em:id>
<em:version>1.0</em:version>
<em:type>2</em:type>
<!-- Target Application this extension can install into,
with minimum and maximum supported versions. -->
<em:targetApplication>
<Description>
<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
<em:minVersion>1.0+</em:minVersion>
<em:maxVersion>2.0.0.5</em:maxVersion>
</Description>
</em:targetApplication>
<!-- Front End MetaData -->
<em:name>Sample!</em:name>
<em:description>A test extension</em:description>
<em:creator>Hotcat</em:creator>
<em:homepageURL>http://www.foo.com/</em:homepageURL>
</Description>
</RDF>
逐行解释：
<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:em="http://www.mozilla.org/2004/em-rdf#">
这三行相对固定——本例中用于引入RDF的命名空间。
<Description about="urn:mozilla:install-manifest">
Description 标记下的内容是文件内容的实质性描述，下面的标签各具意义：
<em:id>用于标示唯一的扩展，此标记的内容在1.5以前的版本中要求GUID格式，1.5以后是extension@domain形式，到现在为止firefox已经出到了2.0.0.5，firefox3的beta版本已经出来了，所以知道后一种格式就ok了，本例中填了一个简单的内容sample@foo.net。
<em:version>标示当前扩展的版本，本例中为1.0
<em:type>标示当前这个xpi安装包的类型，2表示扩展，4表示主题，8表示本体化，16标示Plugin。本例是一个扩展，所以选2。
<em:targetApplication>这个标记用来标示当前的安装所包适用的Mozilla平台，访问一下Mozilla的主页，你会发现很多基于Mozilla的软件，而这个标签下的子标记id则标示了哪个软件可以安装但前的这个xpi，他是GUID形式的。 <em:minVersion>和<em:maxVersion>这对标签用于标示当前安装包的适用版本范围，如果我们把一个最大支持到2.0.0.4的xpi安装到.5版本中，就会提示不兼容。
我从网上找了些基于Mozilla软件的id列在了下边：
Firefox {ec8030f7-c20a-464f-9b0e-13a3a9e97384}
Thunderbird {3550f703-e582-4d05-9a08-453d09bdfdc6}
Nvu {136c295a-4a5a-41cf-bf24-5cee526720d5}
Mozilla Suite {86c18b42-e466-45a9-ae7a-9b95ba6f5640}
SeaMonkey {92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a}
Sunbird {718e30fb-e89b-41dd-9da7-e25a45638b28}
Netscape Browser {3db10fab-e461-4c80-8b97-957ad5f8ea47}
Flock Browser {a463f10c-3994-11da-9945-000d60ca027b}
<em:name>标签标示xpi的名字。
以上的几项标签都是必选的，每一个install.rdf中都必须存在，当然顺序无所谓。
以下的三个标签是可选的，<em:description>是对这个xpi的简单描述；<em:creator>是作者名；<em:homepageURL>是主页。还有其他可选标记，没什么大用，先不列出来了。
接下来，是负责注册的文件chrome.manifest，代码如下：
content sample chrome/content/
overlay chrome://browser/content/browser.xul chrome://sample/content/sample.xul
不知道Mozilla为什么用chrome这么一个让人摸不着头脑的词做这么重要的部分的名字。文章开头提到的那些界面元素都是chrome的一部分，这段代码中的chrome://browser/content/browser.xul ，是chrome的一个重要特性——chromeURL，即标准的界面元素和我们自定义的界面，都可以通过chrome://的方式访问，可以把这中方式理解为地址映射，Mozilla本身及其扩展都是通过这种方式访问的，这样做的好处在于他可适用于多种文件格式的平台，你在windows平台下编写的xpi可运行，也可以不经修改应用到linux平台下。
chromeURL的格式如下：
chrome://<package name>/<part>/<filename>
package name表示访问扩展的名称，本例中是sample；part表示访问chrome的包类型（content、skin、locale）；filename就是文件名。当然如果part还有子目录，可以加上。
下面列出了firefox本身的界面元素和位置：
主窗口 chrome://browser/content/browser.xul
选项窗口 chrome://browser/content/pref/pref.xul
私有选项窗口 chrome://browser/content/pref/pref-privacy.xul
书签管理器 chrome://browser/content/bookmarks/bookmarksManager.xul
书签面板 chrome://browser/content/bookmarks/bookmarksPanel.xul
历史记录面板 chrome://browser/content/history/history-panel.xul
Javascript 控制台 chrome://global/content/console.xul
管理员密码 chrome://pippki/content/pref-masterpass.xul
下载管理器 chrome://mozapps/content/downloads/downloads.xul
在了解了chromeURL后，我们来看chrome.manifest这个文件的内容：
content sample chrome/content/
这是资源注册，本例中注册了一个content包，名字为sample，后面的chrome/content/表示一个路径，这个简单的例子中没有用到chrome下的jar包，所以你会发现和以后的注册方式略有不同。
overlay chrome://browser/content/browser.xul chrome://sample/content/sample.xul
表示一个覆盖，格式也很简单，overlay 标准资源 自定义资源。本例中用sample中的元素覆盖browser.xul中的元素。
当然，注册还有skin和locale的注册，而且除了overlay覆盖，还有style和override覆盖，本例中尚未用到，以后用到了再做介绍。
最后介绍sample.xul这个文件，代码如下：
<?xml version="1.0"?>
<overlay id="sample"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<statusbar id="status-bar">
<statusbarpanel id="my-panel" label="XP Forever"/>
</statusbar>
</overlay>
逐行介绍：
<?xml version="1.0"?>
由于XUL是XML用户界面语言，是对XML的一种扩展，所以XUL也是一种XML，也要符合XML的语法规范，这一行是每一个XML都有的。
<overlay id="sample"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
这句说明他是一个overlay，id为sample，xmlns是一个命名空间，默认情况下，overlay所有子标记都继承这个命名空间。
<statusbar id="status-bar">
<statusbarpanel id="my-panel" label="XP Forever"/>
</statusbar>
这三句是覆盖的实质内容，statubar的id为status-bar，这就是我们的状态栏，如果你要覆盖状态栏，那他能指示系统，你要覆盖的元素是什么。子标记statusbarpanel是一个按钮，但是这个按钮不能按，没有click事件，他只有一个label或image，他的功能很简单，通常被用作标签或者提示用户有什么新信息等简单的消息。
好了，这三个文件都搞定了，打包安装后，就会在Firefox的状态栏的右下角显示“XP Forever”。当然你可以在label里填写你喜欢的东西，但是如果不会本地化，建议你只写英文和数字，否则显示的会使！@#$%^&*之类的乱码。
o(∩_∩)o...一会小小来看我，拿这个给她show一下，她一定会很高兴的~（注：我们姓名的第一个大写字母是X和P哦^_^）
对于overlay，我的理解很简单：如果把firefox浏览器想成一个基本的界面，那么overlay就是在这个基本界面上的各种元素的位置上，以自定义的方式做出一个新的界面元素，然后像胶布一样贴上去，覆盖到原来元素的位置，使之显示新的界面信息。
那么都有什么样的界面元素可以被覆盖呢？通过两周的学习，我大概明白了4中最基本的元素，状态栏statusbar，工具条toolbar，菜单中“工具”的下拉菜单menupopup，还有一个是定制工具栏toolbarpalette。当然肯定还有其他的扩展位置，像ScrapBook扩展中修改菜单，迅雷的扩展修改邮件弹出等。做完这4篇blog后，我会去研究一下迅雷扩展的xpi，然后是功能强大的web developer。
上一篇blog介绍了一个扩展的基本目录结构，我们扩展状态栏的基本目录结构如下：
/chrome
---/content
---/sample.xul
/install.rdf
/chrome.manifest
很简单，一共三个文件就搞定了，呵呵，首先介绍一下安装文件install.rdf。代码如下：
<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:em="http://www.mozilla.org/2004/em-rdf#">
<Description about="urn:mozilla:install-manifest">
<em:id>sample@foo.net</em:id>
<em:version>1.0</em:version>
<em:type>2</em:type>
<!-- Target Application this extension can install into,
with minimum and maximum supported versions. -->
<em:targetApplication>
<Description>
<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
<em:minVersion>1.0+</em:minVersion>
<em:maxVersion>2.0.0.5</em:maxVersion>
</Description>
</em:targetApplication>
<!-- Front End MetaData -->
<em:name>Sample!</em:name>
<em:description>A test extension</em:description>
<em:creator>Hotcat</em:creator>
<em:homepageURL>http://www.foo.com/</em:homepageURL>
</Description>
</RDF>
逐行解释：
<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:em="http://www.mozilla.org/2004/em-rdf#">
这三行相对固定——本例中用于引入RDF的命名空间。
<Description about="urn:mozilla:install-manifest">
Description 标记下的内容是文件内容的实质性描述，下面的标签各具意义：
<em:id>用于标示唯一的扩展，此标记的内容在1.5以前的版本中要求GUID格式，1.5以后是extension@domain形式，到现在为止firefox已经出到了2.0.0.5，firefox3的beta版本已经出来了，所以知道后一种格式就ok了，本例中填了一个简单的内容sample@foo.net。
<em:version>标示当前扩展的版本，本例中为1.0
<em:type>标示当前这个xpi安装包的类型，2表示扩展，4表示主题，8表示本体化，16标示Plugin。本例是一个扩展，所以选2。
<em:targetApplication>这个标记用来标示当前的安装所包适用的Mozilla平台，访问一下Mozilla的主页，你会发现很多基于Mozilla的软件，而这个标签下的子标记id则标示了哪个软件可以安装但前的这个xpi，他是GUID形式的。 <em:minVersion>和<em:maxVersion>这对标签用于标示当前安装包的适用版本范围，如果我们把一个最大支持到2.0.0.4的xpi安装到.5版本中，就会提示不兼容。
我从网上找了些基于Mozilla软件的id列在了下边：
Firefox {ec8030f7-c20a-464f-9b0e-13a3a9e97384}
Thunderbird {3550f703-e582-4d05-9a08-453d09bdfdc6}
Nvu {136c295a-4a5a-41cf-bf24-5cee526720d5}
Mozilla Suite {86c18b42-e466-45a9-ae7a-9b95ba6f5640}
SeaMonkey {92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a}
Sunbird {718e30fb-e89b-41dd-9da7-e25a45638b28}
Netscape Browser {3db10fab-e461-4c80-8b97-957ad5f8ea47}
Flock Browser {a463f10c-3994-11da-9945-000d60ca027b}
<em:name>标签标示xpi的名字。
以上的几项标签都是必选的，每一个install.rdf中都必须存在，当然顺序无所谓。
以下的三个标签是可选的，<em:description>是对这个xpi的简单描述；<em:creator>是作者名；<em:homepageURL>是主页。还有其他可选标记，没什么大用，先不列出来了。
接下来，是负责注册的文件chrome.manifest，代码如下：
content sample chrome/content/
overlay chrome://browser/content/browser.xul chrome://sample/content/sample.xul
不知道Mozilla为什么用chrome这么一个让人摸不着头脑的词做这么重要的部分的名字。文章开头提到的那些界面元素都是chrome的一部分，这段代码中的chrome://browser/content/browser.xul ，是chrome的一个重要特性——chromeURL，即标准的界面元素和我们自定义的界面，都可以通过chrome://的方式访问，可以把这中方式理解为地址映射，Mozilla本身及其扩展都是通过这种方式访问的，这样做的好处在于他可适用于多种文件格式的平台，你在windows平台下编写的xpi可运行，也可以不经修改应用到linux平台下。
chromeURL的格式如下：
chrome://<package name>/<part>/<filename>
package name表示访问扩展的名称，本例中是sample；part表示访问chrome的包类型（content、skin、locale）；filename就是文件名。当然如果part还有子目录，可以加上。
下面列出了firefox本身的界面元素和位置：
主窗口 chrome://browser/content/browser.xul
选项窗口 chrome://browser/content/pref/pref.xul
私有选项窗口 chrome://browser/content/pref/pref-privacy.xul
书签管理器 chrome://browser/content/bookmarks/bookmarksManager.xul
书签面板 chrome://browser/content/bookmarks/bookmarksPanel.xul
历史记录面板 chrome://browser/content/history/history-panel.xul
Javascript 控制台 chrome://global/content/console.xul
管理员密码 chrome://pippki/content/pref-masterpass.xul
下载管理器 chrome://mozapps/content/downloads/downloads.xul
在了解了chromeURL后，我们来看chrome.manifest这个文件的内容：
content sample chrome/content/
这是资源注册，本例中注册了一个content包，名字为sample，后面的chrome/content/表示一个路径，这个简单的例子中没有用到chrome下的jar包，所以你会发现和以后的注册方式略有不同。
overlay chrome://browser/content/browser.xul chrome://sample/content/sample.xul
表示一个覆盖，格式也很简单，overlay 标准资源 自定义资源。本例中用sample中的元素覆盖browser.xul中的元素。
当然，注册还有skin和locale的注册，而且除了overlay覆盖，还有style和override覆盖，本例中尚未用到，以后用到了再做介绍。
最后介绍sample.xul这个文件，代码如下：
<?xml version="1.0"?>
<overlay id="sample"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<statusbar id="status-bar">
<statusbarpanel id="my-panel" label="XP Forever"/>
</statusbar>
</overlay>
逐行介绍：
<?xml version="1.0"?>
由于XUL是XML用户界面语言，是对XML的一种扩展，所以XUL也是一种XML，也要符合XML的语法规范，这一行是每一个XML都有的。
<overlay id="sample"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
这句说明他是一个overlay，id为sample，xmlns是一个命名空间，默认情况下，overlay所有子标记都继承这个命名空间。
<statusbar id="status-bar">
<statusbarpanel id="my-panel" label="XP Forever"/>
</statusbar>
这三句是覆盖的实质内容，statubar的id为status-bar，这就是我们的状态栏，如果你要覆盖状态栏，那他能指示系统，你要覆盖的元素是什么。子标记statusbarpanel是一个按钮，但是这个按钮不能按，没有click事件，他只有一个label或image，他的功能很简单，通常被用作标签或者提示用户有什么新信息等简单的消息。
好了，这三个文件都搞定了，打包安装后，就会在Firefox的状态栏的右下角显示“XP Forever”。当然你可以在label里填写你喜欢的东西，但是如果不会本地化，建议你只写英文和数字，否则显示的会使！@#$%^&*之类的乱码。
o(∩_∩)o...一会小小来看我，拿这个给她show一下，她一定会很高兴的~（注：我们姓名的第一个大写字母是X和P哦^_^）
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 【Firefox扩展】简单扩展之4——overlay others
- 【Firefox扩展】简单扩展之3——overlay toolbar
- 【Firefox扩展】简单扩展之2——overlay menupopup
- Firefox扩展开发初级教程——开发一个简单的扩展
- 【C语言简单说】三：整数变量和输出扩展(1)
- 原来开发PHP扩展可以如此简单 3ff0
- 【推荐】常用Firefox扩展/插件(2009-1-3更新)
- 使用 XUL 实现浏览器扩展，第 1 部分: 使用用户界面特性创建一个 Firefox 浏览器扩展
- Centos7下安装php-redis扩展及简单使用
- 简单几步写一个laravel扩展包
- Log4net的简单扩展
- PHP扩展开发：一个简单的例子
- 对java中MessageFormat类的一个简单扩展
- splinter简单用法环境fedora26,firefox56
- Lua源码揭秘（二）一个简单的数学扩展库函数
- firefox附加组件扩展插件开发综述
- Firefox 3.6 Web应用开发人员的扩展
- jQuery基于扩展简单实现倒计时功能的方法
- 构建一个简单的php扩展
- 简单的扩展虚拟机磁盘文件大小实例