1. ホーム
  2. ios

[解決済み] ぼかしの入ったオーバーレイビューの作成

2022-03-26 21:40:31

質問

新しいiOSのミュージックアプリで、アルバムジャケットをぼかした表示の後ろに、アルバムジャケットを見ることができます。

どうしたらそんなことが実現できるのでしょうか?ドキュメントを読みましたが、何も見つかりませんでした。

解決方法は?

を使用することができます。 UIVisualEffectView を使えば、この効果を得ることができます。これは、パフォーマンスと優れたバッテリー駆動時間のために微調整されたネイティブAPIであり、さらに実装も簡単です。

Swiftです。

//only apply the blur if the user hasn't disabled transparency effects
if !UIAccessibility.isReduceTransparencyEnabled {
    view.backgroundColor = .clear

    let blurEffect = UIBlurEffect(style: .dark)
    let blurEffectView = UIVisualEffectView(effect: blurEffect)
    //always fill the view
    blurEffectView.frame = self.view.bounds
    blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]

    view.addSubview(blurEffectView) //if you have more UIViews, use an insertSubview API to place it where needed
} else {
    view.backgroundColor = .black
}

Objective-Cです。

//only apply the blur if the user hasn't disabled transparency effects
if (!UIAccessibilityIsReduceTransparencyEnabled()) {
    self.view.backgroundColor = [UIColor clearColor];

    UIBlurEffect *blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleDark];
    UIVisualEffectView *blurEffectView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
    //always fill the view
    blurEffectView.frame = self.view.bounds;
    blurEffectView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

    [self.view addSubview:blurEffectView]; //if you have more UIViews, use an insertSubview API to place it where needed
} else {
    self.view.backgroundColor = [UIColor blackColor];
}

このビューコントローラをモーダルに表示して、その下のコンテンツをぼかす場合は、モーダル表示スタイルを Over Current Context に設定し、背景色を clear に設定して、このビューコントローラが上に表示されても、下のビューコントローラが表示されたままになるようにする必要があります。