默认动画

This commit is contained in:
xaoxuu 2023-08-17 21:26:27 +08:00
parent e7029c3751
commit 6eee00880b
3 changed files with 82 additions and 70 deletions

View File

@ -58,43 +58,20 @@ class CapsuleVC: ListVC {
} }
list.add(title: "不同位置、不同动画") { section in list.add(title: "不同位置、不同动画") { section in
section.add(title: "顶部,缩放") { section.add(title: "顶部,默认滑入") {
Capsule(.info("一条简短的消息")) { capsule in Capsule(.info("一条简短的消息")) { capsule in
capsule.config.animateBuildIn { window, completion in
let duration = 1.0 }
let d0 = duration * 0.2 }
let d1 = duration section.add(title: "中间,默认缩放") {
window.transform = .init(scaleX: 0.001, y: 0.001) Capsule(.middle.info("一条简短的消息")) { capsule in
window.alpha = 0
UIView.animate(withDuration: d0, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 0.5) {
window.transform = .init(scaleX: 0.01, y: 0.5)
}
UIView.animate(withDuration: d1, delay: d0 * 0.2, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5) {
window.transform = .identity
} completion: { done in
completion()
}
UIView.animate(withDuration: duration * 0.4, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 1) {
window.alpha = 1
}
}
capsule.config.animateBuildOut { window, completion in
let duration = 0.8
UIView.animate(withDuration: duration, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 1) {
window.transform = .init(scaleX: 0.0001, y: 0.5)
} completion: { done in
completion()
}
UIView.animate(withDuration: duration * 0.6, delay: duration * 0.4, usingSpringWithDamping: 1, initialSpringVelocity: 1) {
window.alpha = 0
}
}
} }
} }
section.add(title: "中间,黑底白字,透明渐变") { section.add(title: "中间,黑底白字,透明渐变") {
Capsule(.middle.info("一条简短的消息")) { capsule in Capsule(.middle.info("一条简短的消息")) { capsule in
capsule.config.tintColor = .white capsule.config.tintColor = .white
capsule.config.cardCornerRadius = 4 capsule.config.cardCornerRadius = 8
capsule.config.contentViewMask { mask in capsule.config.contentViewMask { mask in
mask.layer.backgroundColor = UIColor.black.withAlphaComponent(0.75).cgColor mask.layer.backgroundColor = UIColor.black.withAlphaComponent(0.75).cgColor
} }
@ -118,11 +95,13 @@ class CapsuleVC: ListVC {
} }
} }
} }
section.add(title: "底部,渐变背景,回弹滑入") { section.add(title: "底部,渐变背景,默认回弹滑入") {
Capsule(.bottom.enter("点击进入")) { capsule in Capsule(.bottom.enter("点击进入")) { capsule in
capsule.config.tintColor = .white capsule.config.tintColor = .white
capsule.config.cardEdgeInsets = .init(top: 16, left: 24, bottom: 16, right: 24)
capsule.config.customTextLabel { label in capsule.config.customTextLabel { label in
label.textColor = .white label.textColor = .white
label.font = .boldSystemFont(ofSize: 16)
} }
capsule.config.contentViewMask { mask in capsule.config.contentViewMask { mask in
mask.effect = .none mask.effect = .none
@ -137,24 +116,6 @@ class CapsuleVC: ListVC {
mask.layer.insertSublayer(gradientLayer, at: 0) mask.layer.insertSublayer(gradientLayer, at: 0)
} }
capsule.config.cardCornerRadius = .infinity capsule.config.cardCornerRadius = .infinity
capsule.config.animateBuildIn { window, completion in
window.transform = .init(translationX: 0, y: 240)
window.alpha = 0
UIView.animate(withDuration: 0.8, delay: 0, usingSpringWithDamping: 0.75, initialSpringVelocity: 0.5) {
window.transform = .identity
window.alpha = 1
} completion: { done in
completion()
}
}
capsule.config.animateBuildOut { window, completion in
UIView.animate(withDuration: 0.8, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 0.5) {
window.transform = .init(translationX: 0, y: 240)
window.alpha = 0
} completion: { done in
completion()
}
}
}.onTapped { capsule in }.onTapped { capsule in
Alert(.message("收到点击事件").duration(1)).push() Alert(.message("收到点击事件").duration(1)).push()
capsule.pop() capsule.pop()
@ -181,7 +142,7 @@ extension Capsule.ViewModel {
func enter(_ text: String?) -> Self { func enter(_ text: String?) -> Self {
self.message(text) self.message(text)
.icon(.init(systemName: "arrow.right.circle.fill")) .icon(.init(systemName: "arrow.right.circle.fill"))
.duration(.infinity) // .duration(.infinity)
} }
static var systemError: Self { static var systemError: Self {

View File

@ -54,6 +54,10 @@ open class Capsule: Controller {
@objc public var position: Position = .top @objc public var position: Position = .top
public func position(position: Position) -> Self {
self.position = position
return self
}
public static var top: Self { public static var top: Self {
let obj = Self.init() let obj = Self.init()
obj.position = .top obj.position = .top

View File

@ -62,18 +62,45 @@ extension Capsule: HUD {
navEvents[.onViewWillAppear]?(self) navEvents[.onViewWillAppear]?(self)
if isNew { if isNew {
window.isHidden = false window.isHidden = false
func completion() {
self.navEvents[.onViewDidAppear]?(self)
}
if let animateBuildIn = config.animateBuildIn { if let animateBuildIn = config.animateBuildIn {
animateBuildIn(window) { animateBuildIn(window, completion)
self.navEvents[.onViewDidAppear]?(self)
}
} else { } else {
let duration = config.animateDurationForBuildInByDefault let duration = config.animateDurationForBuildInByDefault
window.transform = .init(translationX: 0, y: -window.frame.maxY - 20) switch position {
UIView.animateEaseOut(duration: duration) { case .top:
window.transform = .identity window.transform = .init(translationX: 0, y: -window.frame.maxY - 20)
} completion: { done in UIView.animateEaseOut(duration: duration) {
self.navEvents[.onViewDidAppear]?(self) window.transform = .identity
} completion: { done in
completion()
}
case .middle:
let d0 = duration * 0.2
let d1 = duration
window.transform = .init(scaleX: 0.001, y: 0.001)
window.alpha = 0
UIView.animate(withDuration: duration, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5) {
window.transform = .identity
} completion: { done in
completion()
}
UIView.animate(withDuration: duration * 0.4, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 1) {
window.alpha = 1
}
case .bottom:
let offsetY = AppContext.appBounds.height - newFrame.maxY + 100
window.transform = .init(translationX: 0, y: offsetY)
UIView.animate(withDuration: duration, delay: 0, usingSpringWithDamping: 0.75, initialSpringVelocity: 0.5) {
window.transform = .identity
} completion: { done in
completion()
}
} }
} }
} else { } else {
view.layoutIfNeeded() view.layoutIfNeeded()
@ -91,21 +118,41 @@ extension Capsule: HUD {
guard let window = attachedWindow, let windowScene = windowScene else { return } guard let window = attachedWindow, let windowScene = windowScene else { return }
AppContext.capsuleWindows[windowScene]?[vm.position] = nil AppContext.capsuleWindows[windowScene]?[vm.position] = nil
navEvents[.onViewWillDisappear]?(self) navEvents[.onViewWillDisappear]?(self)
func completion() {
window.isHidden = true
window.transform = .identity
self.navEvents[.onViewDidDisappear]?(self)
}
if let animateBuildOut = config.animateBuildOut { if let animateBuildOut = config.animateBuildOut {
animateBuildOut(window) { animateBuildOut(window, completion)
window.isHidden = true
window.transform = .identity
self.navEvents[.onViewDidAppear]?(self)
}
} else { } else {
let duration = config.animateDurationForBuildOutByDefault let duration = config.animateDurationForBuildOutByDefault
UIView.animateEaseOut(duration: duration) { let oldFrame = window.frame
window.transform = .init(translationX: 0, y: -window.frame.maxY - 20) switch vm.position {
} completion: { done in case .top:
window.isHidden = true UIView.animateEaseOut(duration: duration) {
window.transform = .identity window.transform = .init(translationX: 0, y: -oldFrame.maxY - 20)
self.navEvents[.onViewDidDisappear]?(self) } completion: { done in
completion()
}
case .middle:
UIView.animate(withDuration: duration * 0.6, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 0.5) {
window.transform = .init(scaleX: 0.001, y: 0.001)
} completion: { done in
completion()
}
UIView.animate(withDuration: duration * 0.4, delay: duration * 0.2, usingSpringWithDamping: 1, initialSpringVelocity: 0.5) {
window.alpha = 0
}
case .bottom:
let offsetY = AppContext.appBounds.height - oldFrame.maxY + 100
UIView.animate(withDuration: duration, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 0) {
window.transform = .init(translationX: 0, y: offsetY)
} completion: { done in
completion()
}
} }
} }
} }