programing

UIVisual EffectView(UI 시각 효과 보기) 및/또는 UIBlurEffect(UI블러 효과)를 안팎으로 페이드하는 방법은 무엇입니까?

css3 2023. 10. 17. 20:28

UIVisual EffectView(UI 시각 효과 보기) 및/또는 UIBlurEffect(UI블러 효과)를 안팎으로 페이드하는 방법은 무엇입니까?

UI Blur Effect가 포함된 UIVisual Effects View를 페이드하고 싶은 경우:

var blurEffectView = UIVisualEffectView()
blurEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .dark))

나는 a라는 함수 안에서 일반 애니메이션을 사용합니다.UIButton퇴색하는 것과 마찬가지로 퇴색하는 것..alpha = 0&hidden = true:

blurEffectView.hidden = false
UIView.animate(withDuration: 1, delay: 0, options: .curveEaseOut) {
    self.blurEffectView.alpha = 1
}

양방향으로 페이딩하면 효과가 있지만 페이딩 시 오류가 발생합니다.

<UIVisualEffectView 0x7fdf5bcb6e80>불투명성을 애니메이션으로 만들어 달라는 요청을 받고 있습니다.이렇게 하면 불투명도가 1로 돌아올 때까지 효과가 깨져 보입니다.

질문.

어떻게 하면 성공적으로 페이드할 수 있을까요?UIVisualEffectView부서지지도 않고 퇴색하지도 않은 채 밖으로 들락날락하는 거요?

메모

  • 는 했습니다.UIVisualEffectViewUIView그리고 그것을 희미하게 하지만, 성공하지 못합니다.

iOS9에서는 이것이 새로운 것이라고 생각하지만, 이제 당신은 a의 효과를 설정할 수 있습니다.UIVisualEffectView애니메이션 블록 내부:

let overlay = UIVisualEffectView()
// Put it somewhere, give it a frame...
UIView.animate(withDuration: 0.5) {
    overlay.effect = UIBlurEffect(style: .light)
}

에 설정합니다.nil제거합니다.

매우 중요 - 시뮬레이터에서 이 기능을 테스트할 때는 시뮬레이터의 그래픽 품질 오버라이드를 고품질로 설정해야 작동할 수 있습니다.

Apple 문서(현재)에 다음과 같이 나와 있습니다.

UIVisualEffectView 클래스를 사용할 때는 1보다 작은 알파 값을 사용하지 마십시오.

그리고.

시각적 효과 보기 또는 시각적 효과 보기에서 알파를 1 미만으로 설정하면 많은 효과가 잘못 표시되거나 아예 표시되지 않습니다.

여기에 중요한 맥락이 빠진 것 같습니다.

저는 영속적인 보기를 위해 1보다 작은 알파 값을 피하는 것이 목적이라고 제안합니다.나의 겸손한 의견으로는 이것은 뷰의 애니메이션에는 해당되지 않습니다.

제 요점은 1 미만의 알파 값은 애니메이션에서도 허용된다는 것입니다.

터미널 메시지는 다음과 같습니다.

UIVisual EffectView는 불투명도를 애니메이션화하라는 요청을 받고 있습니다.이렇게 하면 불투명도가 1로 돌아올 때까지 효과가 깨져 보입니다.

이 글을 잘 읽어보면 효과가 깨지는 처럼 보일 것입니다.여기에 대한 제 의견은 다음과 같습니다.

  • 명백한 단절은 변하지 않고 지속적인 관점에만 실제로 중요합니다.
  • 끈질긴/변함없는UIVisualEffectAlpha 값이 1보다 작은 뷰는 Apple이 의도/설계한 대로 나타나지 않습니다.
  • 단말기의 메시지는 오류가 아니라 단지 경고일 뿐입니다.

제 문제를 해결하는 데 도움이 된 @jrturton의 답변을 위에서 확장하기 위해, 저는 덧붙이고 싶습니다.

페이드 아웃 시키기 위해.UIVisualEffect합니다(Objective-C)합니다.

UIView.animateWithDuration(1.0, animations: {
//  EITHER...
    self.blurEffectView.effect = UIBlurEffect(nil)
//  OR...
    self.blurEffectView.alpha = 0
}, completion: { (finished: Bool) -> Void in
    self.blurEffectView.removeFromSuperview()
} )

두 가지 방법을 모두 성공적으로 사용합니다.effect에의 재산.nil설정을 하고 있습니다.alpha에의 재산.0.

다음을 설정할 때 주의하십시오.effect.nil애니메이션 끝에 "멋진 플래시"(더 나은 설명을 원하기 위해)를 생성하는 동시에alpha.0매끄러운 전환을 만듭니다.

(구문법 오류가 있으면 알려주세요...obj-c로 씁니다.)

스위프트 3를 사용하여 iOS10과 이전 버전에서 모두 작동하는 솔루션은 다음과 같습니다.

extension UIVisualEffectView {

    func fadeInEffect(_ style:UIBlurEffectStyle = .light, withDuration duration: TimeInterval = 1.0) {
        if #available(iOS 10.0, *) {
            let animator = UIViewPropertyAnimator(duration: duration, curve: .easeIn) {
                self.effect = UIBlurEffect(style: style)
            }

            animator.startAnimation()
        }else {
            // Fallback on earlier versions
            UIView.animate(withDuration: duration) {
                self.effect = UIBlurEffect(style: style)
            }
        }
    }

    func fadeOutEffect(withDuration duration: TimeInterval = 1.0) {
        if #available(iOS 10.0, *) {
            let animator = UIViewPropertyAnimator(duration: duration, curve: .linear) {
                self.effect = nil
            }

            animator.startAnimation()
            animator.fractionComplete = 1
        }else {
            // Fallback on earlier versions
            UIView.animate(withDuration: duration) {
                self.effect = nil
            }
        }
    }

}

요지를 확인하여 예시적인 용법을 찾을 수도 있습니다.

그냥 해결 방법 - 퍼팅UIVisualEffectView컨테이너 뷰로 변경합니다.alpha해당 컨테이너의 속성입니다.그 접근 방식은 iOS 9에서는 완벽하게 작동합니다. iOS 10에서는 더 이상 작동하지 않는 것 같습니다.

콘솔의 경고 이외에 시각 효과 보기의 알파를 문제없이 변경할 수 있습니다.보기는 흐리게 표시되지 않고 부분적으로 투명하게 표시될 수 있습니다.하지만 애니메이션 중에 알파를 변경하는 경우에는 보통 이것이 문제가 되지 않습니다.

이것 때문에 앱이 다운되거나 거절되지는 않을 것입니다.실제 장치(또는 8개)에서 테스트합니다.외관과 성능에 만족하시면 괜찮습니다.애플은 단지 알파 값이 1인 시각 효과 보기만큼 겉보기나 성능이 좋지 않을 수 있다고 경고하고 있을 뿐입니다.

정적 기본 뷰의 스냅샷을 생성하고 블러 뷰의 불투명도를 건드리지 않고 페이드 인/아웃 할 수 있습니다.blurView의 ivar 가정:

func addBlur() {
    guard let blurEffectView = blurEffectView else { return }

    //snapShot = UIScreen.mainScreen().snapshotViewAfterScreenUpdates(false)
    let snapShot = self.view.snapshotViewAfterScreenUpdates(false)
    view.addSubview(blurEffectView)
    view.addSubview(snapShot)

    UIView.animateWithDuration(0.25, animations: {
        snapShot.alpha = 0.0
    }, completion: { (finished: Bool) -> Void in
        snapShot.removeFromSuperview()
    } )
}

func removeBlur() {
    guard let blurEffectView = blurEffectView else { return }

    let snapShot = self.view.snapshotViewAfterScreenUpdates(false)
    snapShot.alpha = 0.0
    view.addSubview(snapShot)

    UIView.animateWithDuration(0.25, animations: {
        snapShot.alpha = 1.0
    }, completion: { (finished: Bool) -> Void in
        blurEffectView.removeFromSuperview()
        snapShot.removeFromSuperview()
    } )
}

UIVisual EffectView - ios10의 경우 UIViewPropertyAnimator를 사용합니다.

    UIVisualEffectView *blurEffectView = [[UIVisualEffectView alloc] initWithEffect:nil];
    blurEffectView.frame = self.view.frame;
    blurEffectView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

    UIView *blackUIView = [[UIView alloc]initWithFrame:self.view.frame];
    [bacgroundImageView addSubview:blackUIView];
    [blackUIView addSubview:blurEffectView];
    UIViewPropertyAnimator *animator  = [[UIViewPropertyAnimator alloc] initWithDuration:4.f curve:UIViewAnimationCurveLinear animations:^{
        [blurEffectView setEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleDark]];
    }];

그러면 퍼센트를 설정할 수 있습니다.

[animator setFractionComplete:percent];

ios9의 경우 알파 성분을 사용할 수 있습니다.

UIVisualEffectView의 알파는 항상 1이어야 합니다.배경색의 알파를 설정하면 효과를 얻을 수 있을 것 같습니다.

출처 : https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIVisualEffectView/index.html

나는 알파가 0인 유아이뷰를 만들고 그것의 서브뷰로 블러뷰를 추가합니다.그래서 숨김/보여주기나 애니메이션으로 모서리를 둥글게 만들 수 있습니다.

나는 결국 다음과 같은 해결책을 가지게 되었고, 별도의 애니메이션을 사용하여UIVisualEffectView그리고 내용물. 요.viewWithTag()참조를 얻는 방법UIView내부에UIVisualEffectView.

let blurEffectView = UIVisualEffectView()
// Fade in
UIView.animateWithDuration(1) { self.blurEffectView.effect = UIBlurEffect(style: .Light) }    
UIView.animateWithDuration(1) { self.blurEffectView.viewWithTag(1)?.alpha = 1 }
// Fade out
UIView.animateWithDuration(1) { self.blurEffectView.effect = nil }    
UIView.animateWithDuration(1) { self.blurEffectView.viewWithTag(1)?.alpha = 0 }

저는 싱글 애니메이션이 알파를 변경하는 것을 선호하지만, 이것은 오류를 방지하고 잘 작동하는 것 같습니다.

저는 방금 이 문제를 겪었고 제가 이 문제를 해결하는 방법은 UIView에 UIVisual Effects View를 저장하고 UIView의 알파를 애니메이션화하는 것이었습니다.

알파가 1.0 이하로 바뀌자마자 흰색으로 변하여 매우 거슬려 보인다는 점을 제외하고는 이것은 잘 작동했습니다.이 문제를 해결하려면 UIView의 레이어 속성을 설정해야 합니다.containerView.layer.allowsGroupOpacity = false이렇게 하면 흰색으로 깜박이는 것을 막을 수 있습니다.

이제 시각 효과 보기 및 기타 하위 보기가 포함된 UIView를 알파 속성을 사용하여 애니메이션화/페이드할 수 있으며 그래픽 오류나 경고 메시지 기록에 대해 걱정할 필요가 없습니다.

_visualEffectView.contentView.alpha = 0;

UIVisualEffectView의 알파를 변경하려면 _visualEffectView의 내용 보기를 변경해야 합니다._visualEffectView의 alpha를 변경하면 다음을 얻을 수 있습니다.

<UIVisualEffectView 0x7ff7bb54b490> is being asked to animate its opacity. This will cause the effect to appear broken until opacity returns to 1.

보통 저는 화면에 보기 컨트롤러를 표시할 때만 흐리게 표시하고 표시된 보기 컨트롤러를 흐리게 표시하고 있습니다.보기 컨트롤러에 blur()와 unblur()를 추가하여 다음과 같은 기능을 지원하는 확장 기능이 있습니다.

extension UIViewController {

   func blur() {
       //   Blur out the current view
       let blurView = UIVisualEffectView(frame: self.view.frame)
       self.view.addSubview(blurView)
       UIView.animate(withDuration:0.25) {
           blurView.effect = UIBlurEffect(style: .light)
       }
   }

   func unblur() {
       for childView in view.subviews {
           guard let effectView = childView as? UIVisualEffectView else { continue }
           UIView.animate(withDuration: 0.25, animations: {
                effectView.effect = nil
           }) {
               didFinish in
               effectView.removeFromSuperview()
           }
       }
   }
}

물론 사용자가 효과 스타일을 선택하게 하고, 지속 시간을 수정하게 하고, 애니메이션이 완성되면 무엇인가를 호출하게 하고, 추가된 시각 효과 뷰를 블러()로 태그하여 블러()를 해제할 때 유일하게 제거되도록 하는 등 이것을 더욱 견고하게 만들 수 있지만, 지금까지 이러한 작업을 수행할 필요성을 발견하지 못했습니다.이것은 "불타고 잊어버리는" 유형의 작업이기 때문입니다.

@cc의 답변에 근거하여 나는 시야를 흐리게 하기 위해 그의 확장을 수정했습니다.

확장 UI 보기 {
펑치 블러 () {//   현재 보기 흐리게 하기blurView = UIVisualEffectView(프레임: self)로 합니다.경계)self.addSubview (blurView)UIView.animate(기간: 0.25) {blurView.effect = UIBlurEffect(스타일: .dark)}}
funcunblur () {하위 보기의 하위 보기 {guardlet effectView = childView as?UIVisualEffectView기타 {continue}UIView.animate(기간: 2.5, 애니메이션: {effectView.effect = 0}) {마쳤습니다.effectView.removeFromSuperview()}}}}

@Tel4tel 및 @cc 응답 기능을 개선하여 매개 변수와 간단한 설명을 제공합니다.

extension UIView {

    // Perform a blur animation in the whole view
    // Effect tone can be .light, .dark, .regular...
    func blur(duration inSeconds: Double, effect tone: UIBlurEffectStyle) {
        let blurView = UIVisualEffectView(frame: self.bounds)
        self.addSubview(blurView)
        UIView.animate(withDuration: inSeconds) {
            blurView.effect = UIBlurEffect(style: tone)
        }
    }

    // Perform an unblur animation in the whole view
    func unblur(duration inSeconds: Double) {
        for childView in subviews {
            guard let effectView = childView as? UIVisualEffectView else { continue 
        }
            UIView.animate(withDuration: inSeconds, animations: {
                effectView.effect = nil
            }){
                didFinish in effectView.removeFromSuperview()
            }
        }
    }
}

그러면 다음과 같이 사용할 수 있습니다.view.blur(duration: 5.0, effect: .light)아니면view.unblur(duration: 3.0)

사용하지 말 것을 명심하십시오.viewDidLoad()애니메이션을 무시할 수 있기 때문입니다.또한 시뮬레이터에서 실행할 때는 그래픽을 Higher 레벨로 돌려 애니메이션을 볼 수 있습니다(Debug > Graphics Quality Override > High Quality).

언급URL : https://stackoverflow.com/questions/29307827/how-to-fade-a-uivisualeffectview-and-or-uiblureffect-in-and-out