Effectの使い方。部品を曇りガラスのようにする。Effectの使い方。部品を曇りガラスのようにする。Effect(以下、ブラーエフェクト)を使って、背後の部品をぼんやり見せる方法について説明した。Effect(以下、バイブレンシーエフェクト)がある。本記事では、バイブレンシーエフェクトの使い方について説明する。バイブレンシーエフェクトとは、中の部品が曇りガラスのようになる入れ物である。ブラーエフェクトは1枚の曇りガラスを置くイメージだが、バイブレンシーエフェクトは、中に入れた部品すべてが曇りガラスのようになる。Vibrancy(ブラー&バイブ)」のどちらかを使う。この違いから説明しておこう。「ブラーエフェクト」は前回の記事でも使った部品で、デバイス画面に配置すると下図赤枠の階層で部品が配置される。View」が背後の部品を曇らせる効果を持ち、配下のViewの部品は曇らずに表示される。ブラーエフェクトの設定から簡単にバイブレンシーエフェクトに変更できる。Effectにチェックを入れるだけだ。ブラーエフェクトとバイブレンシーエフェクトを同時に配置するしかし、ブラーエフェクトをバイブレンシーエフェクトに切り替えると、全面曇りガラスのような効果が無くなる。バイブレンシーエフェクトは曇った状況で部品を際立たせるために使うのが一般的なので、ブラーエフェクトと一緒に使うことが多い。ブラーエフェクトの中にブラーエフェクトを格納してバイブレンシーエフェクトに変更する使い方でも問題無いが、なんだか煩わしい。そこで利用するのが「ブラー&バイブ」である。デバイス画面にブラー&バイブを配置すると下図赤枠のように階層で部品が配置される。View」が入れ子になっている。View」がバイブレンシーエフェクトになっていることが分かる。要するに、ブラーエフェクトの中にバイブレンシーエフェクトが格納された部品が配置されるということだ。下図のような重ね合わせイメージバイブレンシーエフェクトの効果を確認ではバイブレンシーを適用するとどのように表示されるかを確認しよう。⇒「テスト用画像」まず、テスト用画像をプロジェクトに取り込む。取り込み方は次の記事を参照されたし。⇒「プロジェクトにファイルを追加する方法」ImageViewをデバイス画面に配置し、画面いっぱいに引き延ばす(下図青矢印)。黄緑枠のアトリビュートインスペクタボタンを押して設定画面を表示し、Imageにテスト用画像(blur_test_img.png)を入力する。次に、「ブラー&バイブ」をデバイス画面に配置して、画面いっぱいに引き延ばす(下図赤矢印)。2つのビューは独立して拡大されるので、両方とも引き延ばすこと(下図青枠)。ラベルを選択した状態で、紫枠のアトリビュートインスペクタボタンを押して設定画面を表示し、Fontのサイズを大きくしておく。この状況でアプリを起動すると下図のようになる。Light」に変更して起動すると下図になる。ブラーエフェクトは「Light」のままで、バイブレインシーエフェクトを「Dark」に変更して起動すると下図になる。Styleの設定は部品の表示に影響する。その際、Darkに設定すると部品が黒っぽくなるわけでは無く、背景がDarkだったとして、それに合わせた見えやすい配色になる。部品自体のカラーはバイブレンシーエフェクトの色に影響しない。下図のようにラベルとセグメントコントロールの色を赤に変更して起動するとどうなるか。下図は、ブラーエフェクトは「Light」、バイブレインシーエフェクトは「Dark」にした結果。部品の色が影響していないことが分かる。ソースコードからバイブレンシーエフェクトを実装するちなみに、ストーリーボードを使わずに、ソースコードからブラーエフェクトやバイブレンシーエフェクトを使うには以下のようなコードになる。//画像をViewに追加する。//ブラーエフェクトをViewに追加する。//バイブレンシーエフェクトをブラーエフェクトに追加する。//ラベルをバイブレンシーエフェクトに追加する。{super.viewDidLoad()//画像をViewに追加する。view.boundsview.addSubview(testImageView)//ブラーエフェクトをViewに追加する。testImageView.boundsview.addSubview(testBlurrView)//バイブレンシーエフェクトをブラーエフェクトに追加する。testImageView.boundstestBlurrView.contentView.addSubview(testVibrancyView)//ラベルをバイブレンシーエフェクトに追加する。Effectの使い方。曇りガラスのように背後の部品がぼんやり見えるビュー。...【Swift】SpriteKitの使い方。物理ボディを等速度運動させる。...【Swift】SpriteKitの使い方。SKTileDefinitionを使ってタイルの画像を反転、回転したり、パラパラアニメのように切り替える。Recognizerの使い方。上下左右のスワイプを検知する。Layoutの使い方。部品の位置を相対的な表現で設定する。コメントをキャンセルメールアドレスが公開されることはありません。