firefox拡張プラグインの作り方を詳しく紹介します。

8110 ワード

まず第一歩どうやってfirefoxプラグインのソースコードを調べますか？上に書いたものをダウンロードしてください。拡張子をzipに変えて解凍します。blue idaserachのフォルダが得られます。このフォルダは私が作ったこのプラグインのソースコードです。 chromeディレクトリ chrome.manifest install.rdf この三つ以外は必須ではない。chrome.manifest このファイルはすべてのファイルのリストです。install.rdf これはインストール情報の説明です。chromeディレクトリにはメインプログラムがあります。このディレクトリ全体の構成はこうです。 blue idearch----- --------chrome -----content --overlay.xul --overlay.js --------chrome.manifest ---------install.rdfとは、つまりこのカタログの構造に従って作成すればいいです。 zipパッケージに圧縮 xpiと改名するこれはfirefoxにインストールできます。 overlay.xul ファイルはプラグインの人UIの説明です。overlay.js プログラムの処理部分です。このコードは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>[email protected]</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.5</em:minVersion> 
        <em:maxVersion>2.0.0.*</em:maxVersion> 
      </Description> 
    </em:targetApplication> 

    <!-- Front End MetaData --> 
    <em:name>blueidea search</em:name> 
    <em:description>blueidea </em:description> 
    <em:creator>yaba</em:creator> 
    <em:homepageURL>http://bbs.blueidea.com/</em:homepageURL> 
    <em:iconURL>chrome://blueideasearch/content/logo.gif</em:iconURL> 
    <em:updateURL>http://www.yoursblog.cn/bibar_update.rdf</em:updateURL> 
  </Description>       
</RDF>

chrome.manifestファイルリスト記述内容


content     blueideasearch    chrome/content/  
overlay  chrome://browser/content/browser.xul chrome://blueideasearch/content/overlay.xul

install.rdf


    <Description>  
        <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>  
        <em:minVersion>1.5</em:minVersion>  
        <em:maxVersion>2.0.0.*</em:maxVersion>  
      </Description>

このem:idは変えられません。彼はこのプラグインの使用ペアを指定しました。 firefox.em:min Version このプラグインのバージョンを最小にインストールできます。。max Versionの逆です


   <em:name>blueidea search</em:name>  
    <em:description>blueidea </em:description>  
    <em:creator>yaba</em:creator>  
    <em:homepageURL>http://bbs.blueidea.com/</em:homepageURL>  
    <em:iconURL>chrome://blueideasearch/content/logo.gif</em:iconURL>  
    <em:updateURL>http://www.yoursblog.cn/bibar_update.rdf</em:updateURL>

m:name はプラグインの名前です。 em:description 説明 em:creator 作者 em:homepageURL ホームページ em:icon URL アイコンのアドレス em:udate URL 更新アドレスを探して上の内容を知ると、プラグインの作成ができます。 firefox自体はMoziaに基づいています。フレーム開発の。皆さんはFFの住所欄に下記の住所を入力してください。 chrome://browser/content/browser.xul 見に来てください FFの自身のUIの説明ここではfireBugをオススメします。を選択しますブラウザのDOM構造がよく見えます。今後の操作はすべてこのDOM構造に対応します。みんなはプラグインUIについて説明するファイルの拡張子を見ました。xulです。このxul言語に対して参考にしてくださいhttp://www.xulplanet.com/ このサイトにはXULの詳細があります。それを一種のHTMLと理解すればいいです。彼の文法表記はとても分かりやすい。


      <toolbarbutton id="home-button" class="toolbarbutton-1 chromeclass-toolbar-additional" label="  " ondragover="nsDragAndDrop.dragOver(event, homeButtonObserver);" ondragdrop="nsDragAndDrop.drop(event, homeButtonObserver);" ondragexit="nsDragAndDrop.dragExit(event, homeButtonObserver);" onclick="BrowserHomeClick(event);"/>

これはFF上のペアですはい、 "ホームページこのボタンの説明。


    <textbox sizetopopup="pref" id="urlbar" flex="1" chromedir="ltr" type="autocomplete" autocompletesearch="history" autocompletepopup="PopupAutoComplete" completeselectedindex="true" tabscrolling="true" showcommentcolumn="true" enablehistory="true" oninput="gBrowser.userTypedValue = this.value" ontextentered="return handleURLBarCommand(param);" ontextreverted="return handleURLBarRevert();"><deck id="page-proxy-deck" onclick="PageProxyClickHandler(event);"><image id="page-proxy-button" ondraggesture="PageProxyDragGesture(event);" tooltiptext="               "/><image id="page-proxy-favicon" validate="never" ondraggesture="PageProxyDragGesture(event);" onload="this.parentNode.selectedIndex = 1;                                 event.stopPropagation();" onerror="gBrowser.addToMissedIconCache(this.src);                                  this.removeAttribute('src');                                  this.parentNode.selectedIndex = 0;" tooltiptext="               "/></deck><hbox id="urlbar-icons"><button type="menu" style="-moz-user-focus: none;" class="plain" id="feed-button" chromedir="ltr" onclick="return FeedHandler.onFeedButtonClick(event);"><menupopup position="after_end" onpopupshowing="return FeedHandler.buildFeedList(this);" oncommand="return FeedHandler.subscribeToFeed(null, event);" onclick="checkForMiddleClick(this, event);"/></button><image tooltiptext="           " id="lock-icon" onclick="if (event.button == 0) displaySecurityInfo(); event.stopPropagation();"/><image id="safebrowsing-urlbar-icon" tooltiptext="          ；        。" level="safe" onclick="goDoCommand('safebrowsing-show-warning')"/></hbox></textbox>

これはFFのアドレスバーについてです。特にHTMLに似ているかどうかを説明します。プラグインのUIを書き始めましょう。。。 chrome\content\overlay.xulを開くファイル..


   <?xml version="1.0"?>  
      <overlay id="bisearch" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">  
     <script src="chrome://blueideasearch/content/overlay.js" />

id=「ビック」 xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">> HTMLを書く時に加入した声明です。 <スクリプト src="chrome://blueideasearch/content/overlay.js「 /> これはプログラムの処理部分です。 HTMLを書いているのはJSを導入しているのと同じです。って、ますますホームページを書いているようになりました。私たちはプラグインの位置を確認したいです。例えば、私達のプラグインはアドレスバーの下に現れます。私たちはFireBugを使って、先ほど私がくれたchromeの住所を調べられます。アドレスバーを見つけて、その親の結点を確認します。ここで住所欄の父の結点を調べました。 id=「navigator-toolbox」私たちはこのように書きます


        <toolbox id="navigator-toolbox">  
    <toolbaritem id="bdSearchBoxbar">  
        <toolbarbutton id="bisearch_button" tooltiptext="      " image="chrome://blueideasearch/content/blueidea.png" oncommand="GotoWebSite('http://bbs.blueidea.com');"></toolbarbutton>  
                </toolbaritem>  
          </toolbox>

このコードは。 id=「navigator-toolbox」にサブノードを追加します。 toolbarbutton はボタンですワンマンはそのイベントで、それを押すとこのイベントをトリガします。中の応答の関数は私達が最初に導入したそのJSの中にあります。


     /**  
*           。  
*/  

function GotoWebSite(url){  

    loadURI(url)  

}

C葃g gはバッグの実例コードを実現します。

ついにマウスの電源を切った後に依然として発光する原因を発見しました。キーボードのマウスの起動機能をオフにする方法と1/2ページ目です。