首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

实现自定义动画以在iPad上显示指定视图的模态视图

实现自定义动画以在iPad上显示指定视图的模态视图,可以使用以下方法:

  1. 创建一个自定义的UIViewController子类,并设置其模态样式和自定义动画。
代码语言:swift
复制
class CustomModalViewController: UIViewController {
    override init(nibName nibNameOrNil: String?, bundle nibBundleOrNil: Bundle?) {
        super.init(nibName: nibNameOrNil, bundle: nibBundleOrNil)
        modalPresentationStyle = .custom
        transitioningDelegate = self
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

extension CustomModalViewController: UIViewControllerTransitioningDelegate {
    func presentationController(forPresented presented: UIViewController, presenting: UIViewController?, source: UIViewController) -> UIPresentationController? {
        return CustomPresentationController(presentedViewController: presented, presenting: presenting)
    }
    
    func animationController(forPresented presented: UIViewController, presenting: UIViewController, source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
        return CustomPresentAnimationController()
    }
    
    func animationController(forDismissed dismissed: UIViewController) -> UIViewControllerAnimatedTransitioning? {
        return CustomDismissAnimationController()
    }
}
  1. 创建一个自定义的UIPresentationController子类,并设置模态视图的大小和位置。
代码语言:swift
复制
class CustomPresentationController: UIPresentationController {
    override var frameOfPresentedViewInContainerView: CGRect {
        let containerViewSize = containerView?.bounds.size ?? .zero
        let presentedViewSize = presentedViewController.preferredContentSize
        let originX = (containerViewSize.width - presentedViewSize.width) / 2
        let originY = (containerViewSize.height - presentedViewSize.height) / 2
        return CGRect(x: originX, y: originY, width: presentedViewSize.width, height: presentedViewSize.height)
    }
}
  1. 创建一个自定义的UIViewControllerAnimatedTransitioning子类,并实现弹出和消失时的动画效果。
代码语言:swift
复制
class CustomPresentAnimationController: NSObject, UIViewControllerAnimatedTransitioning {
    func transitionDuration(using transitionContext: UIViewControllerContextTransitioning?) -> TimeInterval {
        return 0.3
    }
    
    func animateTransition(using transitionContext: UIViewControllerContextTransitioning) {
        let toViewController = transitionContext.viewController(forKey: .to)!
        let containerView = transitionContext.containerView
        toViewController.view.transform = CGAffineTransform(scaleX: 0.01, y: 0.01)
        containerView.addSubview(toViewController.view)
        
        UIView.animate(withDuration: transitionDuration(using: transitionContext), delay: 0, usingSpringWithDamping: 0.6, initialSpringVelocity: 0, options: .curveEaseInOut, animations: {
            toViewController.view.transform = .identity
        }, completion: { _ in
            transitionContext.completeTransition(!transitionContext.transitionWasCancelled)
        })
    }
}

class CustomDismissAnimationController: NSObject, UIViewControllerAnimatedTransitioning {
    func transitionDuration(using transitionContext: UIViewControllerContextTransitioning?) -> TimeInterval {
        return 0.3
    }
    
    func animateTransition(using transitionContext: UIViewControllerContextTransitioning) {
        let fromViewController = transitionContext.viewController(forKey: .from)!
        let containerView = transitionContext.containerView
        
        UIView.animate(withDuration: transitionDuration(using: transitionContext), delay: 0, usingSpringWithDamping: 0.6, initialSpringVelocity: 0, options: .curveEaseInOut, animations: {
            fromViewController.view.transform = CGAffineTransform(scaleX: 0.01, y: 0.01)
        }, completion: { _ in
            transitionContext.completeTransition(!transitionContext.transitionWasCancelled)
        })
    }
}
  1. 在需要显示模态视图的地方,创建一个CustomModalViewController实例,并使用present方法显示。
代码语言:swift
复制
let modalViewController = CustomModalViewController()
present(modalViewController, animated: true, completion: nil)

这样就可以实现在iPad上显示指定视图的模态视图,并使用自定义动画效果。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Human Interface Guidelines —— Popovers

例如,许多iPad的app在点击Action按钮时会弹出共享选项。 使用时注意 ·避免在iPhone上使用popover 一般来说,popover应该保留在iPad的app中使用。...在iPhone的app中,因为位置有限,一般在全屏的模态视图中呈现信息,而不是在popover中。...如果需要显示新的popover,请先关闭打开的popover。 ·不要在popover上显示另一个视图 除了alert外,任何东西都不应该显示在popovers上方。...最好使其大小刚好能展示内容,并指向出现的地方。请注意,系统可能会调整popover的大小以确保它适合屏幕显示。...·在更改popover的大小时采用平滑过渡 一些popover提供了相同信息的简明和扩展视图。如果您要调整popover的大小,请用动画过渡,以免让用户误以为产生了新的popover。

1.3K110

最新iOS设计规范四|3大界面要素:视图(Views)

活动由活动视图管理,以工作表或弹出窗口的形式显示,具体取决于设备和方向。活动被用来给用户在APP中执行一些自定义服务或任务。...五、图像视图(Image Views) 图像视图是在透明或不透明背景上,显示的单个图像或动画图像序列。在图像视图中,图像可以被拉伸、缩放、调整大小以适合或固定到特定位置。...如果用户想要不按顺序访问页面,你可以自定义控件来实现此功能。 七、浮层/弹出视图(Popovers) 浮层通常是当用户点击屏幕上某个内容的控制点或区域时,在其上方出现的瞬态视图。...一般来说,浮层主要应用于iPad上的APP(聚焦用户注意力)。在iPhone的APP中,通常会使用全屏模态视图来呈现信息,而不是弹出浮层来节省空间。...在这种类型的界面中,主要列显示侧边栏,可选补充列显示列表视图,辅助内容窗格显示有关所选内容的详细信息。 在iPad上,使用拆分视图而不是标签栏。

8.5K31
  • 最新iOS设计规范二|7大应用架构

    为了在你的应用中呈现自定义的模态内容,iOS 13和更高版本支持以下两种表现风格: (一) 工作表(卡片弹窗) 工作表演示样式显示为一张卡片,并覆盖在页面上。未被覆盖的区域变暗显示,无法进行交互。...始终要有取消/关闭模态视图的按钮。例如:你可以使用“完成”或“取消”。至少有一个按钮以确保辅助技术访问模态视图,并代替手势关闭模态视图。 必要时,通过在关闭模式视图之前进行确认来帮助人们避免数据丢失。...除非是警示框,任何元素都不该出现在Popover上。在极少数情况下,当用户在Popover中执行操作后需要用到模态视图时,请在显示模态视图之前先关闭Popover。 通常为模态任务设置一个标题。...例如,当模态视图包含导航栏时,它应该采用与APP导航栏相同的外观。 为模态视图的展示提供合适的过渡动画。使用与APP风格统一的过渡动画,增强用户对内容转变的认知。...使用标签栏显示对应类别的内容或功能。标签栏可让人们快速轻松地在不同类别之间切换。 在iPad上,使用拆分视图而不是标签栏。拆分视图提供与选项卡栏相同的快速导航,同时更好地利用了大屏幕。

    2.6K20

    iOS 9人机界面指南(一)上篇:UI设计基础 - 腾讯ISUX

    类似的过渡动画也出现在用户选择某个日期时:月份视图从所选位置分开,将所在的周日期推向内容区顶端并显示以小时为单位的当天时间轴视图。这些交互动画增强了年、月、日之间的层级关系以及用户的感知。 ?...它能协调视图的内容显示,实现与用户交互的功能并能在不同屏幕内容之间切换。比如,“设置”使用了一个导航控制器来展示其视图层级。...尺寸类别( Size classes)和自动布局(Auto Layout)可以通过定义屏幕的布局、视图控制器和视图在环境变化时候应该怎么适应来帮助你实现这个愿望。...下面的实例可以帮助你形象展现尺寸类型如何适配不同设备的显示环境。例如:iPad(包括iPad Pro)在长宽和横屏竖屏时都使用常规尺寸类型。换句话说,iPad显示环境一直处于垂直和水平的常规状态。...更多关于模态试图的信息请参考Modal View. 始终提供明显、安全的退出模态任务的途径。确保用户在退出模态视图时可以预期操作的结果。

    1.9K41

    IOS开发系列——启动页专题【整理,部分原创】

    启动页专题 总述: 两种方式,一种是使用系统自带的,按规则定义启动图片名称即可,显示为1秒,要想延长时间,用[nsthread sleepForTimeInterval:5.0] ,另一种就是自定义uiivew...iPad专用横向启动画面,可省略 1024x768或者1024x748 Default.png iPhone默认启动图片,如果没有提供上面几个iPad专用启动图片,则在iPad上运行时也使用Default.png...(不推荐) 320x480或者320x460 Default@2x.png iPhone4启动图片640x960或者640x920 为了在iPad上使用上述的启动画面,你还需要在info.plist中加入...1.2 延迟时间 2,如果想想设启动画面的显示时间, 在XXXAppDelegate.m的- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions...中以模态窗口的方式弹出此VC。

    1.8K10

    最新iOS设计规范三|3大界面要素:栏(Bars)

    在拆分视图中,导航栏可能会显示在拆分视图的单个窗格中。导航栏是半透明的,也可以添加背景色,并且必要时可以设置为隐藏。 ? 某些情况下可暂时隐藏导航栏,以提供更沉浸的体验。...但是,无边框样式在标准标题导航栏中可能无法很好地起作用,因为该栏的标题和按钮可能难以区分。iPad上的拆分视图是一个例外,更多的是通过在这两种视图中使用无边框样式来保持主视图和辅助视图之间的一致性。...你可以同时提供自定义的蒙版图像,以便系统在转场过渡时使用此蒙版为按钮标题设置动画效果。 不要包括多段面包屑路径。后退按钮始终执行单个操作:返回上一屏幕。...有几种常见的技术可以做到这一点: · 在APP中使用导航栏,该导航栏会自动显示状态栏背景,并确保内容不会显示在状态栏背后 · 在状态栏背后显示自定义图像,如渐变色或纯色 · 在状态栏背后放置模糊的视图...模态视图例外。因为模态视图为人们提供了一种单独的体验,使他们在完成后便会被解雇,所以这不是应用程序整体导航的一部分。 选项卡功能不可用时,请勿删除或禁用该选项卡。

    9.9K10

    《iOS Human Interface Guidelines》

    有三种类型的横幅可以用来显示在你的app中:标准型、中型矩形和全屏型。所有类型的横幅服务于同一个目标——即引导用户进入广告——但他们在表现形式和行为上不同。...你可以选择是模态地显示横幅还是在一个可滚动内容的分开的页面显示。(在这里显示的例子中,app提供一个杂志阅读体验并且让用户可以在全屏横幅上翻页。)...和所有横幅一样,当用户点击全屏横幅时会启动一个iAd体验,但你的app可以在合适的情况下响应横幅区域上的其他手势(比如拖拽或者滑动)。 确保使用合适的动画来显示和隐藏非模态的全屏横幅视图。...比如说,一个杂志阅读app可能会用显示其他内容页面的翻页动画来显示一个横幅。 确保所有横幅在你app中有意义的时间和地方显示。人们倾向于在不觉得干扰了他们工作流的时候进入一个iAd体验。...如果你的app在屏幕上显示滚动内容,确保横幅视图保持固定在其位置。 当人们查看或与广告交互时,暂停需要他们关注和交互的活动。

    1.3K40

    VCTransitionsLibrary –自定义iOS交互式转场动画的库

    使用 在自定义转场动画时,有两类关键的类: 动画控制器 –  这个类是用来实现自定义动画的.但你声明想要使用自定义动画时,你应该提供一个动画控制器.这个类会实现需要的动画,完成时会通知框架....使用动画控制器 AnimationControllers 文件夹中提供了许多可以整合进你的工程中的动画控制器: 自定义模态控制器显示/隐藏的动画 UIViewControllerTransitioningDelegate...协议被用来在模态控制器显示/隐藏时提供一个动画控制器.当一个视图控制器被模态显示或隐藏时,它的transitioningDelegate属性用来提供UIViewControllerTransitioningDelegate...方法返回模态显示时的动画, 通过 animationControllerForDismissedController: 返回模态消失时的动画即可....,可以实现交互式的动画转场效果,比如可以让用户通过手势来控制页面间的导航.交互控制器允许用户在一个转场动画中前进,后退,甚至退出.

    1.6K60

    最新iOS设计规范七|10大视觉规范(Visual Design)

    在iOS应用中,您可以配置界面元素和布局,以在iPad上执行多任务处理时,在拆分视图中,在屏幕旋转时以及在其他设备上自动更改形状和大小。设计一个适应性强的界面在任何环境下都提供出色的体验非常重要。...该系统包括预定义的布局指南,可轻松在内容周围应用标准边距并限制文本的宽度,以实现最佳的可读性。您还可以定义自定义布局指南。 ? ? 遵守UIKit定义的安全区域和布局边距。...相反,请考虑采用较少干扰性的方式来实现品牌,例如使用自定义颜色方案或字体,或巧妙地自定义背景。 避免在整个APP中显示Logo。不要在你的APP中显示Logo,除非对于上下文是很有必要出现的。...系统视图和控件使你的APP文本在所有背景上都看起来很好,并自动调整以适应是否有Vibrancy。当你可以使用系统提供的视图来显示该文本时,请不要自己绘制文本。...确保自定义视频播放器的行为符合预期。目标是在全屏设备上播放视频内容时,默认情况下是全屏模式(纵横填充)显示内容。但是,如果填充显示会导致过多的内容被裁剪,则应缩放视频以适合屏幕模式显示内容。

    8.1K30

    iOS开发常用之网络

    VOMetroLayoutDemo - Metro风格的UICollectionView,目前只支持横向布局,仅在iPad上应用。...会自动将collection view处理完善,并将用户消息以合适美观的方式显示出来。每个iOS项目都可以自动处理。...TextProgress - 自定义实现数字进度条:1,可以自定义数字(0-100),填充的比例为当前设置的数字,2,可以实现自定义填充颜色,上下部分都可以,3,可以自定义边界的颜色4,实现了水波动画...BubbleTransition - 以气泡膨胀和缩小的动画效果来显示和移除控制器,Uber的就是这种取消操作的方式。...STPopup - 提供了一个可在iPhone和iPad上使用的具有UINavigationController弹出效果的STPopupController类,并能在Storyboard上很好的工。

    23.7K10

    iOS11新特性:新增拖拽交互体验 原

    这种拖拽操作交互极大的方便了电脑的使用。在iOS11中,你可以在iPhone或iPad上构建这种交互体验!...说在前面的话:       拖拽操作在iPad上是支持跨应用程序的,你可以从一个应用中拖取项目,通过Home键回到主界面并且打开另一个应用程序,然后将被拖拽的项目传递给这个应用程序中。...2.设置UIDragInteraction对象的代理并实现相应方法。 3.将UIDragInteraction对象添加到指定View上。...,传递的数据必须遵守相应的承诺协议,后面会给大家介绍,这里只是简单返回了一个字符串数据Hello World,运行工程,你可以试验下,可以直接将我们自定义的视图拖拽进UITextField并在其中显示Hello...2.设置UIDropInteraction对象的代理并实现协议方法。 3.将其添加到自定义的视图中。

    2.1K10

    iOS 9人机界面指南(三):iOS 技术 (中) - 腾讯ISUX

    自定义信息会在警告框和横幅中显示,也会在通知中心中以通知的形式显示。你无需在自定义信息中显示你的应用名称,因为iOS会在显示信息的同时自动显示应用名称。...你可以在显示给用户进行编辑之前,预先加载具有自定义内容的撰写视图(在你呈现给用户之后,只有用户可以编辑这些自定义内容)。...确保使用合适的动画效果来显示和隐藏非模态的全屏横幅视图。例如,杂志阅读应用可以用和杂志翻页一样的动画效果。 确保横幅广告在应用中出现的时间和位置是合理的。...你可以在应用中用一个新的视图来展示文件预览,或者使用全屏模态视图。展示的形式取决于你的应用运行在什么设备上。 在iPad上使用模态视图来显示文件预览。...iPad的大屏幕适合在一个方便用户离开的沉浸式环境中展示文件预览。缩放操作(zoom transition)很适合展示预览。 在iPhone上使用专用的视图,最好是导航视图来显示文件预览。

    3.3K50

    SheetKit——SwiftUI模态视图扩展库

    因此,在此种情况下,通常我们会将所有的模态视图集中管理起来,统一调用。请参阅我之前的文章——在SwiftUI中,根据需求弹出不同的Sheet[3]。...•新的半高模态视图在WWDC 2021中,苹果为大家带来了期待已久的半高模态视图。或许推出的比较仓促,这种很受欢迎的交互方式并没有提供SwiftUI版本,仅支持UIKit。...使用下面语句将关闭显示动画 SheetKit().present(animated: false) Sheet类型 目前SheetKit支持三种模态视图类型:sheet、fullScreenCover、...Notification.Name dismissAllSheets image-20210916190651604 SheetKit支持快速取消全部正在显示的模态视图(无论该模态视图是否由SheetKit...().dismiss() 同样支持动画控制 如果在视图外执行SheetKit方法,请务必保证代码运行在主线程上。

    2.9K20

    iOS 9人机界面指南(四):UI元素(上) - 腾讯ISUX

    工具栏: 是半透明的 在iPhone上,工具栏始终位于屏幕底部,而在iPad上则有可能出现在顶部 当键盘被唤起、用户使用了手势、或者当前视图变为竖屏的情况下,工具栏可以隐藏。...集合视图: 可包含装饰视图,以从视觉上区分项的子集或者提供装饰性项目,例如自定义背景。 布局切换时支持自定义转场动画。(默认情况下,当用户导入、移动或者删除项的时候,会出现系统默认的动画效果。)...带翻页效果的控制器可以在两页中间增加书脊(book spine)的效果 可以根据指定的转场来模拟出页面切换时的动画。...举个例子,在横屏视图中,你的内容可能会全部承载在浮出层内部;而在竖屏的情况下,浮出层可以以一种全屏模态视图的样式出现。...在iOS 7及之前的版本里,对分视图控制器仅适用于iPad. 默认情况下,对分视图控制器通过当前的尺寸来管理其子视图。

    10.1K51

    iOS 9人机界面指南(四):UI元素(下)- 腾讯ISUX

    当视图数量超过页面宽度可承载的氛围时,点的大小和间距并不会因此变小(如果需要显示的点超过一定数量,系统会把它截断) 默认情况下不支持视图之间导航;你必须实现视图到视图之间的导航并适当地更新页面控件状态...你可能还需要在模态视图里加入一些补充文字,来清楚地阐明任务内容,并提供一些任务指南。 选择一个适当的过渡动画来展示模态视图。...使用与你的app一致的过渡动画,让用户可以准确地理解当前页面内容的转变与模态视图的出现。...关于这一点,你可以指定以下任意一种过渡动画: 垂直出现(Vertical).模态视图从底部边缘滑入屏幕,也同样从屏幕底部滑出(默认模式)。 弹出(Flip).当前视图从右往左水平滑动,露出模态视图。...从视觉上看,模态视图好像原来就处于当前视图的下面,当前视图移开时,它便出现了。离开模态视图时,原先的父视图从左边滑回屏幕右边。

    13.2K30

    iOS程序员面试,绝对会遇到这些问题!

    请概括一下你在构建iOS应用时的测试过程。iOS应用如何实现对其他语言、日期格式以及货币单位的支持? 请描述一下Instruments及其作用。...iPad 2,iPad mini 1-3,iPad Retina,iPad Air 2,iPhone 5、5S、6以及6+在硬件性能方面有何差异?这对注重性能的应用有何限制?...模态视图(Modal View)是什么? iOS通知属于什么类型? 关于设计 iOS应用图标是指什么?请尽可能详细地描述一下。 最小尺寸和最大尺寸的应用图标分别是什么样子的?...请概括一下它是如何运行的。 设计软件时为什么要加上动画? 请描述一下软件设计中的交互和Feedback有什么作用。 设计iPhone和iPad应用时,应分别考虑哪些因素?...你觉得Xcode有哪些需要改进的地方? iOS上你最喜欢哪些API? 是否有最中意的错误报告? 你最爱以哪种方式来检验一项新技术是否好用?

    1.4K20

    六个方向关于iOS100个面试题,你都会了吗?

    请概括一下你在构建iOS应用时的测试过程。iOS应用如何实现对其他语言、日期格式以及货币单位的支持? 请描述一下Instruments及其作用。...iPad 2,iPad mini 1-3,iPad Retina,iPad Air 2,iPhone 5、5S、6以及6+在硬件性能方面有何差异?这对注重性能的应用有何限制?...模态视图(Modal View)是什么? iOS通知属于什么类型? 关于设计 iOS应用图标是指什么?请尽可能详细地描述一下。 最小尺寸和最大尺寸的应用图标分别是什么样子的?...请概括一下它是如何运行的。 设计软件时为什么要加上动画? 请描述一下软件设计中的交互和Feedback有什么作用。 设计iPhone和iPad应用时,应分别考虑哪些因素?...你觉得Xcode有哪些需要改进的地方? iOS上你最喜欢哪些API? 是否有最中意的错误报告? 你最爱以哪种方式来检验一项新技术是否好用?

    3.6K50

    Cocoa编程中视图控制器与视图类详解

    每个iPhone用户界面都是由显示在UIWindow(这其实也是个特殊的UIView)内的众多UIView及其专门化子类构建的。...显示数据的视图: UITextView UILabel UIImageView UIWebView MKMapViews UIScrollView 可选择的视图(以下两个视图类实例都是模态显示的): UIAlertView...UIViewController实例负责设置视图的外观和它显示的子视图。 UINavigationController类 1. 导航控制器使用内置动画在视图之间切换; 2....在实现UITabBarControllerDelegate委托的视图控制器中重写init方法来自定义UITabBarItem条目。...1.作用: •创建和管理视图。 •管理视图上显示的数据。 •设备方向变化,调整视图大小以适应屏幕。 •负责视图和模型之间的数据及请示的传递。 2.

    5.1K50

    iOS 面试策略之系统框架-UIKit

    本节将从用户界面聊起,回答开发中常见的布局和交互问题;之后将重点集中在动画渲染上,最后的问答题将集中在 iPad 的多屏开发上。...layoutSubviews 是用来自定义视图尺寸调整的。它是系统自动调用的,开发者不能手动调用。我们能做的就是重写该方法,让系统在尺寸调整时能按照希望的效果去进行布局。...除了 UIView Animation 可以实现的效果。它可以修改更多的属性以实现各种复杂的动画效果。其实现的动画可以回撤、暂停、与手势交互。...假设圆形小球已经在屏幕上,面试官没有参数要求,只是要实现水平移动的效果。...下图详尽说明了 iPad 上多任务的尺寸分类: [image] 11.代码实现:将 UIImageView 上的图片直接拖拽到另一个 UIImageView 上。

    1.5K20
    领券