programing

UI 스택 보기 보기 숨기기 애니메이션

newstyles 2023. 9. 1. 20:38

UI 스택 보기 보기 숨기기 애니메이션

iOS 11에서 숨김 애니메이션의 동작은 다음과 같습니다.UIStackView변경되었지만, 이 문서는 어디에서도 찾을 수 없었습니다.

iOS 10

iOS 10 animation

iOS 11

iOS 11 animation

둘 다 코드는 다음과 같습니다.

UIView.animate(withDuration: DiscoverHeaderView.animationDuration,
                       delay: 0.0,
                       usingSpringWithDamping: 0.9,
                       initialSpringVelocity: 1,
                       options: [],
                       animations: {
                            clear.isHidden = hideClear
                            useMyLocation.isHidden = hideLocation
                        },
                       completion: nil)

iOS 11에서 이전 동작을 복원하려면 어떻게 해야 합니까?

방금 같은 문제가 있었습니다.수정 프로그램이 추가 중입니다.stackView.layoutIfNeeded()애니메이션 블록 안에 있습니다.어디에stackView숨기려는 항목의 컨테이너입니다.

UIView.animate(withDuration: DiscoverHeaderView.animationDuration,
                   delay: 0.0,
                   usingSpringWithDamping: 0.9,
                   initialSpringVelocity: 1,
                   options: [],
                   animations: {
                        clear.isHidden = hideClear
                        useMyLocation.isHidden = hideLocation
                        stackView.layoutIfNeeded()
                    },
                   completion: nil)

iOS 11에서 갑자기 이것이 문제가 되는 이유는 잘 모르겠지만 공정하게 말하면 항상 권장되는 접근 방식이었습니다.

이미 수락된 답변의 댓글에 언급되었지만, 이것은 저의 문제였고 여기에 있는 답변에는 없습니다.

절대 설정하지 마십시오.isHidden = true이미 감춰져 있는 견해로그러면 스택 보기가 엉망이 됩니다.

스위프트 4 확장:

// MARK: - Show hide animations in StackViews

extension UIView {

func hideAnimated(in stackView: UIStackView) {
    if !self.isHidden {
        UIView.animate(
            withDuration: 0.35,
            delay: 0,
            usingSpringWithDamping: 0.9,
            initialSpringVelocity: 1,
            options: [],
            animations: {
                self.isHidden = true
                stackView.layoutIfNeeded()
            },
            completion: nil
        )
    }
}

func showAnimated(in stackView: UIStackView) {
    if self.isHidden {
        UIView.animate(
            withDuration: 0.35,
            delay: 0,
            usingSpringWithDamping: 0.9,
            initialSpringVelocity: 1,
            options: [],
            animations: {
                self.isHidden = false
                stackView.layoutIfNeeded()
            },
            completion: nil
        )
    }
}
}

숨어서 많은 뷰를 보여주기에 좋은 이 기능을 공유하고 싶습니다.UIStackView왜냐하면 이전에 사용했던 모든 코드가 일부 레이어에서 애니메이션을 제거해야 하기 때문에 원활하게 작동하지 않았기 때문입니다.

extension UIStackView {
    public func make(viewsHidden: [UIView], viewsVisible: [UIView], animated: Bool) {
        let viewsHidden = viewsHidden.filter({ $0.superview === self })
        let viewsVisible = viewsVisible.filter({ $0.superview === self })

        let blockToSetVisibility: ([UIView], _ hidden: Bool) -> Void = { views, hidden in
            views.forEach({ $0.isHidden = hidden })
        }

        // need for smooth animation
        let blockToSetAlphaForSubviewsOf: ([UIView], _ alpha: CGFloat) -> Void = { views, alpha in
            views.forEach({ view in
                view.subviews.forEach({ $0.alpha = alpha })
            })
        }

        if !animated {
            blockToSetVisibility(viewsHidden, true)
            blockToSetVisibility(viewsVisible, false)
            blockToSetAlphaForSubviewsOf(viewsHidden, 1)
            blockToSetAlphaForSubviewsOf(viewsVisible, 1)
        } else {
            // update hidden values of all views
            // without that animation doesn't go
            let allViews = viewsHidden + viewsVisible
            self.layer.removeAllAnimations()
            allViews.forEach { view in
                let oldHiddenValue = view.isHidden
                view.layer.removeAllAnimations()
                view.layer.isHidden = oldHiddenValue
            }

            UIView.animate(withDuration: 0.3,
                           delay: 0.0,
                           usingSpringWithDamping: 0.9,
                           initialSpringVelocity: 1,
                           options: [],
                           animations: {

                            blockToSetAlphaForSubviewsOf(viewsVisible, 1)
                            blockToSetAlphaForSubviewsOf(viewsHidden, 0)

                            blockToSetVisibility(viewsHidden, true)
                            blockToSetVisibility(viewsVisible, false)
                            self.layoutIfNeeded()
            },
                           completion: nil)
        }
    }
}

이것이 다른 사람들의 좌절감을 몇 시간 덜어주기를 바랍니다.

애니메이션 숨기기 및 여러 UI StackView 하위 보기를 동시에 표시하는 것은 엉망입니다.

경우에 따라 애니메이션 블록에서 .isHidden에 대한 변경 내용은 다음 애니메이션이 무시될 때까지만 올바르게 표시됩니다.이에 대해 찾은 유일한 신뢰할 수 있는 트릭은 애니메이션의 완료 블록에 숨겨진 명령을 반복하는 것입니다.

    let time = 0.3

    UIView.animate(withDuration: time, animations: {

        //shows
        self.googleSignInView.isHidden = false
        self.googleSignInView.alpha = 1
        self.registerView.isHidden = false
        self.registerView.alpha = 1

        //hides
        self.usernameView.isHidden = true
        self.usernameView.alpha = 0
        self.passwordView.isHidden = true
        self.passwordView.alpha = 0

        self.stackView.layoutIfNeeded()

    }) { (finished) in

        self.googleSignInView.isHidden = false
        self.registerView.isHidden = false
        self.usernameView.isHidden = true
        self.passwordView.isHidden = true
    }

jimpic의 답변에 따라 간단한 함수를 작성하여 stackView에서 뷰를 보여주고 숨기는 문제를 애니메이션으로 해결하였습니다.

func hide(_ vu: UIView) {
    if vu.isHidden == true {
        return
    } else {
        vu.isHidden = true
    }
}

func show(_ vu: UIView) {
    if vu.isHidden == true {
        vu.isHidden = false
    } else {
        return
    }
}

위의 기능을 사용합니다.

UIView.animate(withDuration: 0.3, delay: 0, options: [.curveEaseOut], animations: {
    self.hide(self.nameTextField)
})

언급URL : https://stackoverflow.com/questions/46326302/uistackview-hide-view-animation