Swift 仿简书、淘宝App的弹出view效果
生活随笔
收集整理的這篇文章主要介紹了
Swift 仿简书、淘宝App的弹出view效果
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
感謝原作者提供OC代碼
個人博客主站:歡迎訪問http://littlesummerboy.com
先來張圖讓小伙伴們看一眼
主要有四個View
黑色 XtPopViewController的self.view的顏色
白色 主控制器self.view顏色
在白色View上方 有個透明度為0.5的view 進行遮擋. (maskView)
下方的灰色View (popView1)
不多說直接上代碼
let screen_Width = UIScreen.mainScreen().bounds.size.width let screen_Height = UIScreen.mainScreen().bounds.size.height class XtPopViewController: UIViewController {/// 在底部彈出的Viewvar popView = UIView()/// rootViewvar rootView = UIView()/// 主VCvar mainVc: UIViewController?/// maskViewvar maskView = UIView()外部傳參接口
func createPopViewControllerWithMainViewController(root: UIViewController, popView: UIView) -> Void {self.mainVc = rootself.popView = popViewself.createSubviews()}創建視圖
func createSubviews() {self.view.backgroundColor = UIColor.blackColor()mainVc!.view.frame = self.view.boundsmainVc!.view.backgroundColor = UIColor.grayColor()rootView = mainVc!.viewself.addChildViewController(mainVc!)self.view.addSubview(rootView)}關鍵的打開方法
func openAction(){UIApplication.sharedApplication().windows[0].addSubview(popView)var frame = popView.frameframe.origin.y = self.view.bounds.size.height - self.popView.frame.size.heightUIView .animateWithDuration(0.3, delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { //self.rootView.layer.transform = self.firstTransform()}) { (Bool) in//UIView .animateWithDuration(0.3, delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { //self.rootView.layer.transform = self.secondTransform()// 顯示maskview, 模糊陰影self.maskView = UIView.init(frame: self.view.bounds)self.maskView.backgroundColor = UIColor.whiteColor()self.maskView.alpha = 0.5self.rootView.addSubview(self.maskView)// popView上升self.popView.frame = frame}, completion: { (Bool) in//})}}關閉方法
func closeAction(){var frame = popView.frameframe.origin.y += popView.frame.size.heightUIView.animateWithDuration(0.3, animations: {//self.maskView.alpha = 0self.popView.frame = frame// 改善滑動效果self.rootView.layer.transform = self.firstTransform()}) { (Bool) inUIView.animateWithDuration(0.3, delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: {// 變為初始值self.rootView.layer.transform = CATransform3DIdentity;}, completion: { (Bool) in// 移除self.popView.removeFromSuperview()})} }layer層 形變
func firstTransform() -> CATransform3D {var t1 = CATransform3DIdentity;t1.m34 = 1.0 / -900;//帶點縮小的效果t1 = CATransform3DScale(t1, 0.95, 0.95, 1);//繞x軸旋轉t1 = CATransform3DRotate(t1, 15.0 * (CGFloat)(M_PI)/180.0, 1, 0, 0);return t1;}func secondTransform() -> CATransform3D {var t2 = CATransform3DIdentityt2.m34 = self.firstTransform().m34;//向上移t2 = CATransform3DTranslate(t2, 0, self.view.frame.size.height * (-0.08), 0);//第二次縮小t2 = CATransform3DScale(t2, 0.8, 0.8, 1);return t2;}使用: 創建(TestViewController)繼承于上面的控制器(XtViewController)
let popView1 = UIView.init(frame: CGRectMake(0, screen_Height, screen_Width, screen_Height / 2))/// popView1 是點擊打開的時候下方彈出的viewpopView1.backgroundColor = UIColor.grayColor()/// 加個陰影popView1.layer.shadowColor = UIColor.blackColor().CGColorpopView1.layer.shadowOffset = CGSizeMake(0.5, 0.5)popView1.layer.shadowOpacity = 0.8popView1.layer.shadowRadius = 5let main = ViewController()let mainNav = UINavigationController.init(rootViewController: main)/// 關閉按鈕let btnClose = UIButton.init(type: UIButtonType.Custom)btnClose.frame = CGRectMake(15, 0, 50, 40)btnClose.setTitle("Close", forState: UIControlState.Normal)btnClose.setTitleColor(UIColor.cyanColor(), forState: UIControlState.Normal)btnClose.addTarget(self, action:Selector("close"), forControlEvents: UIControlEvents.TouchUpInside)popView1.addSubview(btnClose)// 打開按鈕let btnOpen = UIButton.init(type: UIButtonType.Custom)btnOpen.frame = CGRectMake(((screen_Width - 100) / 2), 300, 50, 40)btnOpen.setTitle("打開", forState: UIControlState.Normal)btnOpen.setTitleColor(UIColor.cyanColor(), forState: UIControlState.Normal)btnOpen.addTarget(self, action: Selector("open"), forControlEvents: UIControlEvents.TouchUpInside)/// main.view 是主控制器的self.viewmain.view.addSubview(btnOpen)main.view.backgroundColor = UIColor.whiteColor()main.title = "XTtest"self.createPopViewControllerWithMainViewController(mainNav, popView: popView1) // self.view.backgroundColor = UIColor.whiteColor() // 底部}func open(){print("+++++++++")self.openAction()}func close(){self.closeAction()}OC版本原文鏈接
Swift入口
總結
以上是生活随笔為你收集整理的Swift 仿简书、淘宝App的弹出view效果的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 古诗词成语故事权重站打造网站模板
- 下一篇: VS 2017 生成类图