透過レイヤー
透過レイヤー は、合成グラフィックスを生成するために結合された 2 つ以上のオブジェクトで構成されます。結果の合成物は単一のオブジェクトとして扱われます。透過レイヤーは、図 9-1 の 3 つの円に適用される影など、オブジェクトのグループに効果を適用する場合に便利です。
図 9-1 透過レイヤーの合成としての 3 つの円
図 9-1 の 3 つの円に、最初に透過レイヤーを描画せずに影を適用すると、図 9-2 のような結果が得られます。
図 9-2 別々の実体として描かれた 3 つの円
透過レイヤーの仕組み
Quartz の透過レイヤーは、多くの一般的なグラフィックスアプリケーションで使用可能なレイヤーに似ています。レイヤーは独立した実体です。Quartz は各コンテキストの透過レイヤースタックを保持し、透過レイヤーはネストできます。しかし、レイヤーは常にスタックの一部であるため、それらを独立して操作することはできません。
CGContextBeginTransparencyLayer 関数を呼び出すことで、透過レイヤーの開始を知らせます。この関数は、グラフィックスコンテキストと CFDictionary オブジェクトをパラメータとして取ります。この dictionary では、レイヤーに関する追加情報を指定するオプションを提供できますが、dictionary が Quartz 2D API でまだ使用されていないため、NULL を渡します。この呼び出しの後、アルファ値(1 に設定されます)、陰影(オフにされます)、ブレンドモード(normal に設定されます)、および最終の合成に影響を与える他のパラメータを除いて、グラフィックス状態パラメータは変更されないままです。
透過レイヤーを開始したら、そのレイヤーに表示したいすべての描画を実行して下さい。指定されたコンテキストでの描画操作は、完全に透明な背景に合成されて描画されます。この背景は、コンテキストとは別の宛先バッファとして扱われます。
描画が終了したら、CGContextEndTransparencyLayer 関数を呼び出して下さい。Quartz は、グローバルのアルファ値とコンテキストの陰影状態を使用し、またコンテキストのクリッピング領域を注意し、コンテキストに結果を合成します。
透過レイヤーへのペイント
透過レイヤーにペイントするには、以下の 3 つの手順が必要です。
- 関数 CGContextBeginTransparencyLayer を呼び出します。
- 合成したいアイテムを透過レイヤーに描画します。
- 関数 CGContextEndTransparencyLayer を呼び出します。
図 9-3 の 3 つの長方形は透過レイヤーにペイントされています。Quartz は、長方形が単一のユニットであるかのように影をレンダリングします。
図 9-3 透過レイヤーにペイントされた 3 つの長方形
リスト 9-1 の関数は、図 9-3 の長方形を生成するために透過レイヤーを使用する方法を示しています。コードの各行の詳細な説明は、リストの後に示します。
リスト 9-1 透過レイヤーへのペイント
void MyDrawTransparencyLayer (CGContext myContext, // 1 CGFloat wd, CGFloat ht) { CGSize myShadowOffset = CGSizeMake (10, -20);// 2 CGContextSetShadow (myContext, myShadowOffset, 10); // 3 CGContextBeginTransparencyLayer (myContext, NULL);// 4 // Your drawing code here// 5 CGContextSetRGBFillColor (myContext, 0, 1, 0, 1); CGContextFillRect (myContext, CGRectMake (wd/3+ 50,ht/2 ,wd/4,ht/4)); CGContextSetRGBFillColor (myContext, 0, 0, 1, 1); CGContextFillRect (myContext, CGRectMake (wd/3-50,ht/2-100,wd/4,ht/4)); CGContextSetRGBFillColor (myContext, 1, 0, 0, 1); CGContextFillRect (myContext, CGRectMake (wd/3,ht/2-50,wd/4,ht/4)); CGContextEndTransparencyLayer (myContext);// 6 }
コードの動作は、以下の通りです:
- グラフィックスコンテキストと、長方形を構築するときに使用する幅と高さという 3 つのパラメータをとります。
- 陰影の x および y オフセット値を含む CGSize データ構造体を設定します。この陰影は、水平方向に 10 ユニット、垂直方向に -20 ユニットオフセットされています。
- 陰影を設定し、ブラー(blur) 値として 10 の値を指定します。(0 の値は、ぼかし(blur) のない硬い端の陰影を指定します。)
- 透過レイヤーの開始を通知します。この時点から、このレイヤーに描画が行われます。
- 次の 6 行のコードが 図 9-3 に示した 3 色の長方形を塗りつぶし、塗りつぶし色を設定します。これらの行は、独自の描画コードで置き換えられます。
- 透過レイヤーの終わりを通知し、Quartz が結果をコンテキストに合成すべきことを通知します。