スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

RubyCocoaでアニメーション:レイヤーにフィルタを適用する

 CoreAnimationには、アニメーション以外にも強力な機能がある。前回の最後にリンクを貼ったドキュメントにも記載があったのだが、レイヤーに対してはCore Imageのフィルタが適用できるのだ。
 と、いきなり言われてもピンと来ないかもしれない。とりあえず実際に試して見よう。画像をセピア調に換えるフィルターを使ってみることにする。そのためにはAppController.rbのawakeFromNibに、以下のコードを追加する。 
filter = OSX::CIFilter.filterWithName_('CISepiaTone')
filter.setDefaults
filter.setName_('sepiaFilter')
layer.setFilters_(OSX::NSArray.arrayWithObject_(filter))

 これでビルドして実行すると、画像がセピア調になる。このようにCIFilterを作成して、レイヤーのfilters属性に設定してやるだけで、画像にフィルターがかかるのだ。このフィルター、OSで用意されているものだけでもかなり多い。さらに、自分で新しいフィルターを作ることもできるし、サードパーティが作成したフィルターがインストールされているなら、それを使うこともできる。
OSにあらかじめ用意されているフィルターの一覧は、下のページから見ることができる。
Core Image プログラミングガイド:Core Image フィルタ

 ところで、この属性がfiltersとなっていることに気がついただろうか? 引数として配列を渡すようになっていることからも分かるかもしれないが、複数のフィルターを設定することができる。セピア調にしながら、ブルームフィルターをかける、なんてことも可能なのだ。さらに適用したフィルターのパラメータにアニメーションを設定してやると、フィルターの効果を時間によって変化させることができる。

 実際に試してみよう。先ほどのコードで、レイヤーにフィルターを設定していた、
layer.setFilters_(OSX::NSArray.arrayWithObject_(filter))

の部分を消して、以下のように書き換える。
# ブルームフィルターを作成する
filter2 = OSX::CIFilter.filterWithName_('CIBloom')
filter2.setDefaults
filter2.setValue_forKey_(OSX::NSNumber.numberWithFloat_(0.0), 'inputIntensity')
filter2.setValue_forKey_(OSX::NSNumber.numberWithFloat_(5.0), 'inputRadius')
filter2.setName_('bloomFilter')
# セピア調フィルタとブルームフィルターを配列にして、レイヤーに設定
filterArray = OSX::NSMutableArray.arrayWithObject_(filter)
filterArray.addObject_(filter2)
layer.setFilters_(filterArray)

これで、二つのフィルターがレイヤーに適用されるようになる。(ただし、この時点ではブルームフィルターのinputIntensityが0なので、セピア調フィルターの効果しか現われていない)

 続いて、フィルターのアニメーションをさせるために、doAnimationに以下のコードを書き加える
pluseAnimation = OSX::CABasicAnimation.animation
pluseAnimation.keyPath='filters.bloomFilter.inputIntensity'
pluseAnimation.fromValue = OSX::NSNumber.numberWithFloat_(0.0)
pluseAnimation.toValue = OSX::NSNumber.numberWithFloat_(1.5)
pluseAnimation.duration = 1.0
pluseAnimation.repeatCount = 1e100
pluseAnimation.autoreverses = true
layer.addAnimation_forKey_(pluseAnimation,'bloom')

 ここでは二行目のkeyPathに注目して欲しい。
'filters.bloomFilter.inputIntensity'とある。これはawakeFromNibでフィルターを作成したときに、
filter2.setName_('bloomFilter')

と書いて付けた名前を使って、どのフィルターにアクセスするかを指定している。当然、セピア調フィルターのパラメータを変化させようと思ったらこの部分は'filters.sepiaFilter.xxxx~'となるわけだ。

 これでビルドして実行すると、画像がセピア調になったまま、輝きを増したり減じたりという表示になるはずだ。もちろん、移動のアニメーションはそのままである。
スポンサーサイト

Comment

Post comment

Secret

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。