XULで動的にスタイルシートを読み込む方法が分かった
ここまでのあらすじ
Firefoxの拡張機能を作ろうとしていました。でも、XULで動的にスタイルシートを読み込む方法が分からずに困っていました(そのときのエントリ)。そうすると、id:teramako さんがはてなブックマークのコメントで「stylechanger.js を読むと良いかも」と教えてくれました。なので、さっそく試してみることにしました。
試したこと
そのstylechanger.jsで(僕にとって)大事なところは、81行目あたりの以下の関数です。
var manager = { load: function(css){ /* 途中省略 */ if (sss.sheetRegistered(uri, sss.USER_SHEET)) sss.unregisterSheet(uri, sss.USER_SHEET); sss.loadAndRegisterSheet(uri, sss.USER_SHEET); /* 途中省略 */ return true; },
お、それっぽい。いかにも関係ありそうだ。
MDCで検索してみると、「タイルシートの追加」という、まさにそのまんまな項目がありました。
Using the Stylesheet Service - MDC
自分なりの結論
というわけで、以下の関数を使えば動的にスタイルシートが読み込めました。
function loadCss(cssName) { var sss = Components.classes['@mozilla.org/content/style-sheet-service;1']. getService(Components.interfaces.nsIStyleSheetService); var ios = Components.classes['@mozilla.org/network/io-service;1']. getService(Components.interfaces.nsIIOService); var uri = ios.newURI(cssName, null, null); if(! sss.sheetRegistered(uri, sss.USER_SHEET)) { sss.loadAndRegisterSheet(uri, sss.USER_SHEET); } }
使い方はこんな感じ。読み込むスタイルシートのURI文字列を渡す。
loadCss("chrome://myaddon/skin/mystyle.css");
見本としたstylechanger.jsでは、引数がnsIURI型でもOKだったりエラーチェックが入ってたりと色々実践的になってますが、そこまでは必要ないのでシンプルにしてみました。
最後に
うーむ。やっぱり検索パワーが足りなかったのかな。今回も結局は「loadAndRegisterSheet」という関数名が分かってしまえば、後はあっという間でした。
まあ、とにかく無事解決しました。めちゃうれしい。id:teramako さん、ありがとうございました。