入力データ・モデルは、「Java™
用 CSS」エンジンのシードを表します。セレクターの解決に必要な次の 3 種類の重要な情報を CSS エンジンに提供します。
- セレクターの遷移に使用される、オブジェクトのツリー構造。
- 要素のタイプ、ID、CSS のクラスに一致するオブジェクトのタイプ、ID、タグ (またはユーザー定義のタイプ)。ID およびタイプはストリングです。CSS クラスはスペース文字で区切られている単語です。ID は固有である必要はありませんが、普通はそのように理解されます。
- セレクター内の属性条件で同じ名前の属性に一致させる属性。
ターゲット・オブジェクトは、モデル・オブジェクトに関連するグラフィック・オブジェクトです。宣言は一致するモデル・オブジェクトに対応するグラフィック・オブジェクトのプロパティー値を変更するので、レンダリングによってグラフィックの外観をカスタマイズすることができます。
Rogue Wave® JViews Diagrammer では、
ターゲット・オブジェクトは IlvGraphic インスタンス (
IlvGraphic
オブジェクトについては、
「JViews Framework 基本編」のグラフィック・オブジェクトを参照) または複合グラフィックです。オブジェクト・タイプおよび属性マッチング
以下のコード例で、属性
model
が sport
に等しいクラス (タイプ) test_Vehicle
のオブジェクトにマッチングさせて、
(別の場所で定義された) このオブジェクトに関連付けられたグラフィック・オブジェクトのプロパティー icon
を sport-car.gif
に設定するルールを示します。test_Vehicle[model=sport] {icon : "sport-car.gif";}
属性マッチングを使用して動的な動作を追加できます。すなわち、モデル上で発生した
PropertyChange
イベントによって CSS エンジンをアクティブ化し、グラフィック・オブジェクトに新しいプロパティー値を設定することができます。
以下のコード例で、モデル属性
state
が down
に設定さている場合に常に CSS クラス computer
の任意のオブジェクトの色を変更するルールを示します。.computer[state = down] {color : "gray"}
属性マッチングについて詳しくは、属性マッチングを参照してください。
オブジェクト ID および CSS クラス
Java モデルは、モデル・オブジェクトの ID を表す getID メソッドを提供します。
この ID は、ルールの # セレクターと照合できます。
セレクターに単一の CSS クラスがある場合は、モデルの getTag メソッドで解決されます。
CSSclass
というプロパティーでオブジェクトに対する追加 CSS クラスを設定できます。
エンジンは getTag
の結果と CSSclass
プロパティーの値とを自動的にマージします。CSS クラスは必ずしもデータ・モデルの意味に関連しているわけではなく、スタイル・シートにパターン・マッチング機能を追加するためのツールとして使用されます。オブジェクトは 1 つのクラス (そのタイプ) にしか属しませんが、複数 (またはゼロ個の) CSS クラスに属することができます。
CSS クラスのチェックは、クラスが存在するかしないかのチェックになります。そのため、CSS クラスは値のない属性と見なすことができます。
デフォルトでは、XML 要素名は CSS クラスとして定義されます。
例えば、単純な XML ファイルに要素名
root
および leaf
が含まれている場合について、
以下のコード例で、リーフ・ノードの色を RGB 色仕様に変更する方法を示します。node.leaf { fillColor1 : 255,198,202 ; foreground : 153,40,100 ; }
前景 (ボーダー) 色用に示された RGB 色仕様はマゼンタです。
クラス名
class
プロパティー名は予約キーワードであり、生成されたグラフィック・オブジェクトのクラス名を示します。
言うまでもなく、クラス宣言が適用されるのは、作成要求が存在する場合だけです。モデル状態が変更されると、スタイル・シートの新規マッチング・ルールからの新規宣言のみを適用することによって、
グラフィック・オブジェクトがカスタマイズされます。その後、クラス宣言は単に無視されます。クラスを変更するには、モデル・オブジェクトを削除してから再度追加する必要があります。
クラス宣言の右側は以下のものにすることができます。
- クラス名。システム・クラス・ローダーでロードされます。次に例を示します。
link { class : ilog.views.sdm.graphic.IlvGeneralLink; foreground : red; }
以下の 2 つの提供基本クラスがあります。1 つは IlvGeneralLink でリンク用であり (スタイル・シートでの一般リンクのカスタマイズを参照)、 もう 1 つは IlvGeneralNode でノード用です (スタイル・シートでの一般ノードのカスタマイズを参照)。 - ファクトリー (インターフェース IlvRectangularObjectFactory)。ファクトリーには、宣言で指定する必要がある IlvRect オブジェクトが必要です。 この矩形は、ファクトリーのパラメーターとして渡されます。次に例を示します。
node { class : ilog.views.interactor.IlvMakeFilledRectangleInteractor; IlvRect : 0,0,100,200; }
ほとんどの使用可能なグラフィック・コンポーネント用のファクトリーがあります。詳しくは、IlvGraphicFactoriesを参照してください。 - ファイルへのパス名。クラス名は Bean ライブラリーに転送されるため (メソッド
java.beans.Beans.instantiate
)、シリアライズされた Bean が適しています。次に例を示します。link { class : data.beans.gauge; foreground : red; }
beanName
がシリアライズド・オブジェクト名として使用されると、 指定されたbeanName
はリソース・パス名に変換されて、末尾に.ser
サフィックスが追加されます。 そのリソースからのシリアライズド・オブジェクトのロードが試行されます。この例では、Beans.instantiate
は、リソースdata/beans/gauge.ser
からシリアライズド・オブジェクトを読み取ろうとします。
疑似クラスと疑似エレメント
モデル間接化技法
宣言の右側は、実行時にプロパティー・エディターで決定されるリテラルを解決します。ただし、
リテラルの前に @ が付いている場合は、ストリングの残りはモデル属性名として解釈されます。
宣言は、以下のコード例に示すように、モデル・オブジェクトから値を取得します。
node { label : "@caption" ; title : "CSS rocks" ;}
label
プロパティーは、モデルの caption
という属性の値に設定されます。
指定された属性がそのオブジェクトに存在しない場合は、モデル制御内で再帰的に検索されます。
title
プロパティーは、リテラル CSS rocks
に設定されます。このような間接性は逆方向、つまりグラフィック・プロパティーを制御するモデル属性の名前を受信するときにも使用されます。これにより、ユーザー操作でデータ・モデルを正しく変更することができます。
2 つの特殊名
@_ID
および @_TAG
は、
モデル・メソッド呼び出し getID および getTag getTag
によってそれぞれ返された値を表します。パレット記号 CSS の間接参照では、パレット記号によってレンダリングされた SDM オブジェクトのプロパティーに直接アクセスできません。
この場合、間接参照は記号パラメーターにのみアクセスできます。
記号のグラフィック要素のプロパティーを対応する SDM オブジェクトのプロパティーにマップする場合は、
パラメーターを定義してそれを媒介プロパティーとして使用する必要があります。
その後、記号 CSS でオブジェクト・プロパティーとしてこのパラメーターの ID にアクセスできます。
外部の CSS では、このパラメーター ID を Bean プロパティーとして使用できます。
URL の解決
宣言値は、スタイル・シートの場所に対する URL であることがあります。CSS レベル 2 標準の特別構造を使用すると、現在のスタイル・シートの基本 URL から URL を作成することができます。次に例を示します。
imageURL : url(images/icon.gif) ;
この宣言は、現在のスタイル・シートの URL のパスを
images/icon.gif
を使用して拡張します。
スタイル・シートが結合されたり別の場所にインポートされたりしても URL はそのまま有効なため、この構造はスタイル・シートを基準にした場所にあるイメージを使用してスタイル・シートを作成するときには非常に有効です。