Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

Generating XUL with Python

この記事は Mozilla Japan 翻訳部門または関連グループにより過去に翻訳された文書を移行したものです。 移行元の文書。よって、英語版と内容が異なる場合や、MDN の他の記事との整合性がとれていない場合があります。


注意: この文章では、実際の XUL と Python言語との結合に関しては何も述べられていません。専門的な話をするには、わたしはその辺りのことについて、あまりにも知らなすぎます。 最近、XPConnect の一般化についての話がちらほら聞かれますので、XPIDL/XPCOM 中に述べられている Mozilla API ―― すなわちその全て ―― は Python のようなスクリプト言語からアクセスすることが、またその逆も、できるようになるでしょう。 このことは、数多の作品を take するでしょう、そしてその周辺に Mozilla はどこにもありません。

一方、この文章で述べられるようなハックは、あなたが XPFE開発環境に慣れる助けとなることができましょうし、ひょっとしたら触発されて自分で探究することになるかもしれません。 実際にたとえ Python を知らなくても、この文書はあなたのアプリケーションのコアを再構築または実装することなしに、Gecko を理解する単純な方法を示す助けとなるでしょう。

イントロダクション

この文章では XULウィンドウを作って表示する Pythonモジュールについて述べます。 Tkinter や wxWindows といった、Pythonで使用されるいくつかの GUIパッケージを使ったことがあるなら、以下の Python コードもいくらか見慣れたものでしょう:

>>> from XUL import *
>>> myXWin = XWindow('XUL Pie', 100, 200)
>>> myXT1 = XText('Hello World!', bclass='marquee')
>>> myXB1 = XButton('Quit', oncommand='window.close()')
>>> myXWin.Bake(myXT1, myXB1)
>>> myXWin.Serve()

xulモジュールを使用するには、上の例にあるように Serve()関数で Mozilla に XUL ウィンドウを表示するように指示します。次のように表示されます:

Mozilla はウィンドウのみを表示し、ブラウザを表示しません。 コードを見ればお分かりのように、このXULファイルは次の 3つのウィジェットを含んだ Python から生成されています: 親ウィンドウ、<text>ウィジェット、<button>ウィジェット、です。これら全ては一緒に「焼かれ」て単独の XUL ファイルに格納されます。そして Mozilla 内部で仕事を待っているレンダリングエンジン Gecko でレンダリングされます。 この Pythonモジュールは数多くのウィジェットや詳細を提供しませんので、生成される XUL ファイルは単純なものになります。しかし、これら二つのテクノロジーの相互作用は、XPFE開発にいくつかの conspiratorial な可能性を開きます: Python と XUL は真にクロスプラットフォームなので、Mozilla で新たなパッケージを作り、それを単独で仕様することが簡単にできます。Python はおそらくいつの日にか XPConnect が使えるようになるでしょう ―― これは、わたしのようなシステムプログラミング言語が得意でない人たちにとっては、プロメテウスが神々から火を盗みとったことにも比すべき、とてつもないことになるでしょう。また他にも色々な可能性があるでしょう。めまいがしてしまう。

次のいくつかのセクションでは、ウィンドウ構築系の環境(つまりは oven、この文章のタイトルです) をセットアップする方法について述べます。そして、Pythonモジュールとその出力 XUL を試してみてみます。

The Oven: たたき台となるパッケージを作る

この Python モジュールを使うために、環境を 2点ほど変更しなければなりません。わたしは、こういった変更作業は一般的に良いことであると考えます ―― 特に、Mozilla をただ Web を見ることだけに使うようなこととは反対に、いじりたおすつもりであるならば。

Mozilla\bin ディレクトリをパスに追加する

まだあなたの現在のプラットフォームで行っていないなら、Mozillaの bin ディレクトリをパスに追加してください。これでコマンドラインで、面倒なフルパス指定をすることなく、Mozilla を起動することができます。

わたしの場合、Windows98 ですが、次のようなコードを autoexec.bat へ追加しました。

C:\Progra~1\Netscape\Mozilla\bin\

一度これをセットしたら(さらに再起動、またはコマンドラインで autoxec.bat を再実行したら)、プロンプトでMozilla と打つだけで Mozilla を起動できます。

Mozilla以外の Chrome を表示する

Mozilla とタイプするのを楽にしたところで、次はこの為の -chrome フラグを Mozilla の呼び出しに組み込みます。Mozilla コマンドで Mozilla を起動するのは、アイコンをダブルクリックして起動するのとちょうど同じようなものです。ですが、-chromeフラグを使うと、Mozilla にデフォルト以外の chrome を表示しろと指示していることになります。例えば、次の行は、分離されたひとつのウィンドウとして検索コンポーネントを生成します。

mozilla -chrome "chrome://search/content"

検索コンポーネントは Mozilla アプリケーションのパッケージ階層中のパッケージなので、以上のようなオプションで利用できるようになります。chrome:// のような URL は単一の XUL ファイル(その含まれるパッケージ名に従った名前の XUL ファイルが chrome:// URL で仮定されるので、上の行は chrome://search/content/search.xul と同等です)を指しますが、それは実際にはそのファイルの所属する chrome 全体を指します。search.xul ファイルがロードするときに、そのパッケージから、スキン、オーバーレイ、地域化文字列、さらに他のコンテンツといった、他の全ての種類のデータをロードします。これが chrome の全てです。

新たなパッケージを作る

chrome は魔法ではありません。なににせよ、全て魔法というわけではありません。Mozilla は、あなたがたそれぞれの意図に容易に沿うことのできる有用な機構として、特別な URLタイプとパッケージ階層を提供しています。Python モジュールのデバッグとテストを楽にするために、単純に新しいパッケージを XUL の解釈とレンダリングエンジンを示すことのできる新たなパッケージを作りました(訳注: まちがってるかも)。この章で述べられる、この叩き台のパッケージは、 Mozilla を明らかにし、その柔軟性と活動能力を理解するとても良い方法です。

新しいパッケージを作るには、Mozilla の chromeサブディレクトリへ cd します。わたしのシステムだと、このディレクトリは次のところにあります:

C:\Program Files\Netscape\Mozilla\bin\chrome\

ここで新しいディレクトリを作って、"oven" と名付けます。oven の下に、3つのサブディレクトリを作ります: "content", "skin", "locale" です。次の基本構造になるように、それぞれのディレクトリの下にさらにディレクトリを作ります。

oven/
  content/
    default/
  skin/
    default/
  locale/
    US-en/

この構造は Mozilla がパッケージを見るときに想定するものです。ですので、全てが正しい名前と配置にしてください。Python モジュールから作られるファイルは全て "oven.xul" と呼ばれ、作られるときには oven の content\default\ サブディレクトリ内に破壊的に置かれます。

Oven用に小さなスキンを作る

XUL ミニビルダモジュールを使う前に、その生成するウィジェットクラスと相互関係を持つ、oven chrome 用のスキンを作る必要があります。望むならばそのスキンを拡張することもできますが、わたしは oven スキン中で単独のスキンを定義しました。この文章の最初のサンプルのように、"marquee"クラスのテキストが青い見出しのようになるスタイルです。 ですがこの oven スキンは、あらゆる優れたスキンがそうするように、グローバルなスキンをロードするので、Pythonモジュール中の XULウィジェットの基本的な見映え振舞いはそこで扱われます。

この oven のスキン、oven.css、は次のように読み込まれます:

@import url(chrome://global/skin/);

text.marquee {
    font-size: 18pt;
    color: darkblue;
    font-weight: bold;
    font-style: italic;
    text-alignment: center;
}

一度パッケージ構造とスキンファイルを配置すれば、先頭行に以下の行を書くことによって、モジュールは生成された XUL のスキンをセットできます。

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

おそまつですが、XULミニビルダ Pythonモジュールです

XUL.py モジュールは、次の 3つの XULウィジェット・属性を定義する XULファイルの作成を、すばらしく向上します。モジュールを介しては太字の属性をセットでき、それ以外はセットできません。

<window>
id="xulpie"
xmlns
xmlns:html
title
height
width
orient="vertical"
align="center"
autostretch="never"
<text>
value
class
<button>
value
class
oncommand

全てのウィジェットは python クラスです。たとえば、ある XUL ウィンドウをタイトル、高さ、幅のパラメータ付きで(最後の二つのパラメータはデフォルト値があるので、省略できます)生成します。

xWin = XWindow('window title', 200, 200)

次いで、同様のコンストラクタで 2つのオブジェクトを作り組み入れることで、この XWindow の子を作ります。

xTex = XText('Hello World!')
xBut = XButton('Quit', oncommand='window.close()')

この場合、XTextコンストラクタは入力パラメータで value属性を得て、"marquee" デフォルトクラスでスタイリングされます。また、XButtonコンストラクタは title とイベントハンドラ ―― これは Python でなくて JavaScript で書かれます ―― を得ます。次に、XWindow クラスの Bake() メソッドでこのクラス群から実際の XUL を生成し、oven.xul 用にオープンされたファイルオブジェクトに書き出します。最後に、Serve() メソッドが os.system 関数を用いて、前節で設定した Mozilla を呼び出します:

mozilla -chrome "chrome://oven/content"

これで、作成したウィンドウが出現します。生成された oven.xul ファイルと、それと一緒に使われる skin ディレクトリ中の oven.css ファイル、加えるとこのパッケージ構造それ自体が、この方法で単独にウィンドウを生成するのに必要なもののすべてであることに注意してください。ここに述べたモジュールを用いると、対話的に oven.xul ファイルを作り直してデスクトップに表示させることができます。

残念ながら、このモジュールのソースは残念なやり方でハードコードされています: 現在のところ、親ウィンドウは、その焼き込むウィジェットの型をチェックしませんし、単一のテキストウィジェットと単一のボタンウィジェットを期待します。しかし、2,3の属性(たとえば、"type"や、おそらく "is_parent" など)を追加することで、焼きあげ動作を簡単に拡張することができます。そしておそらくは任意の長い子ウィジェットのリスト(と、子ウィジェットリストのリスト!)を然るべきレイアウトで渡せるようになるでしょう。

その間は、ここでソースコードを利用できます。このモジュールを使用するには、ソースコードを XUL.py という名にコピーして、PYTHONPATH に入れてください。インタプリタを起動し、モジュールクラスをインポートします。

ボタンウィジェットとボタンスキン

このサンプルでは、いくつかの新しい XUL ツールキットのウィジェットを使用します。実際、新たな <button>ウィジェットはそのほとんど全てのスタイルと位置指定にグローバルスキンを用いる点で、XUL.py モジュールは優れています。 <titlebutton> ウィジェットが親コンテナ中の位置を指定するのに、align のような属性を使用する以前は、<button>ウィジェットがその振る舞いを得るのに "left","right","top"といったグローバルスキンで基本的な新しいボタンクラスを得る点が優れています(訳注: まちがってるかも)。

新しいボタンウィジェットのクラスは以下を含みます:

  • button.small
  • button.left
  • button.right
  • button.top
  • button.bottom

これら簡単な定義は XUL 自身の中でエレメントをスタイリングするやり方から遥かに転移することを意味します。構造と表現の独立は、XUL の最も優れた特徴のひとつです; エレメントの表現を CSS ファイルに記述することは、私たちがここで行った、Pythonラッパーで基本構造を作り残りのインターフェースを整えるのにグローバルスキンを利用したようなことを可能にします。

グローバルスキンもいくつかのファイルにモジュール化されることに注意してください。グローバルスキンのディレクトリ(Mozille\bin\chrome\global 中にあるグローバルパッケージの一部分)は以下のグローバルスキンモジュールを含みます:

  • button.css
  • checkbox.css
  • commonDialog.css
  • dialogOverlay.css
  • global.css
  • menubutton.css
  • menulist.css
  • radio.css
  • scrollbars.css
  • tasksOverlay.css
  • wizardOverlay.css

…これらはスキンを提供し、XBL で追加的な XUL コンテンツを参照します。XBL については後の文章でさらに説明します(XBLが実際どのように動作するか詳しく学びたいならば、それを読みなさい)。

XUL は成長し続けているので、ユーザーインターフェース言語というよりは開発フレームワークに近くなりつつあります。そこで、わたしがここで述べたようなプロジェクトへのより良いサポートが提供されます。それは XUL が Python により直結しているように見えるようなものではなく、これらの 2つの技術を簡単に一緒に使えるようになります。もしあなたが、わたしのように、概念や技術を利用しながら新しい技術を学ぶことに親しんでいるならば、同様の方法で Mozilla の標準ベースの技術の利点を活かすことを勧めます。

Author: Ian Oeschger
Other Documents: Module source code

Original Document Information

ドキュメントのタグと貢献者

タグ: 
 このページの貢献者: Taken, Mgjbot
 最終更新者: Taken,