50天iOS挑战(Swift) - 第7天：弹出View后背景变暗效果
50天，每天一个Swift语言的iOS练手项目，覆盖iOS开发的主要知识。贵在坚持，重在思考
文章列表：http://08643.cn/nb/13566182
Github项目：https://github.com/Minecodecraft/50DaysOfSwift
简介
很多项目都会有弹出view效果，同时背景会变暗，这个demo就实现一下背景变暗效果
主要知识点: 动画闭包、弹出view
GIF
过程
1、 分析
要实现弹出view后背景变暗的效果，只需要在原有view之上添加一个带透明度背景即可，然后再添加弹出框即可满足需求。
2、 界面实现
首先添加上述两个view，bkgView为背景，popupView为弹出窗口
// 添加带透明度的背景视图，从而实现下方视图变暗
guard let window = UIApplication.shared.keyWindow else { return }
bkgView = UIView()
bkgView.frame = window.bounds
bkgView.backgroundColor = UIColor(white: 0.1, alpha: 0.6)
window.addSubview(bkgView)
// 添加弹出控件，添加到window而不是bkgView
popupView = UIView()
popupView.frame = CGRect(x: 30, y: kScreenHeight, width: kScreenWidth-60, height: 60)
popupView.backgroundColor = UIColor.orange
popupView.layer.cornerRadius = 15
window.addSubview(popupView)
3、 动画实现
iOS简单动画实现起来很容易，通过UIView提交一个动画即可，采用尾随闭包来写。
// 添加一个弹出动画
UIView.animate(withDuration: 0.3) {
// 尾随闭包播放弹出动画
self.popupView.frame = CGRect(x: 30, y: (kScreenHeight-60)/2, width: kScreenWidth-60, height: 60)
}
// 收回动画
UIView.animate(withDuration: 0.3) {
// 尾随闭包播放弹出动画
self.popupView.frame = CGRect(x: 30, y: kScreenHeight, width: kScreenWidth-60, height: 60)
// 提交一个延时任务线程
DispatchQueue.main.asyncAfter(deadline: .now() + 0.3) {
self.popupView.removeFromSuperview()
self.bkgView.removeFromSuperview()
}
}
一点小小的补充
- 项目源码地址 GitHub，欢迎大家前来支持，希望可以随手留个Star。多谢~
